Skip to content Skip to sidebar Skip to footer

Widget Atas Posting

How to make RESPONSIVE ads space on Blogspot

Blogger - Hi Blogger friends, newbies or veterans... Greetings to all... I'm Prince Rahman :) from the RahmanCyber kingdom.. hehe, I haven't discussed Blogger for a long time, this time the tutorial that I present is "How to make Slots or Ad Spaces on our beloved Blog, namely Blogger "

 

slot iklan responsive blogger

 

 

What's the use?

 

The point is, if someone wants to advertise their products on our blog, they already know which places we provide ... thank God we have determined the price ... whether it's monthly, annually, or once paid.. hehe

Then we get money from that income... not bad, for example, we set the cheapest price for 300px advertising and 50 thousand per month. It can cover the cost of renting a domain, if there are several ad slots... try to imagine it yourself, just multiply it, it can already be a cost for you to take care of your blog.

So you take care of the blog, you already have a monthly fee... hehe, butiiiiiiiiiiii

It's not Easy man..!




Factors Affecting Advertiser Considerations

 

 

There are several factors that affect the attractiveness of advertisers to advertise their products on your blog... hehe, what are the factors of advertiser attractiveness to want to advertise their products on your blog?

 

1. Updates

Yes, take a look, how fast is the blog updating... hehe, how many days, or how many times a week.. Usually the advertiser will research about this first, before deciding to sign an advertisement on your blog.

 

2. Rating

Yes, today's advertisers are also sophisticated, so before advertising, there are many considerations... in order to bring in good input for the company's cash. So advertisers can just check Rank on Alexa, or through Check Domain Authority or DA, or it can also be Page Authority or PA. In the past, Google Page Rank, yes, but now I have changed PA and DA  

 

3. Articles

Usually this concerns the suitability of the article with the product he is going to sell, whether there is a topic that is almost in line with the product being sold or not. If so, it can increase the rating of the advertiser

 

4. Social Media

Related social media such as Facebook, twitter and other social media also affect, if there is it will get a plus in the eyes of advertisers

 

5. Friendly or Not

Yes, this is also a factor, bro, so to serve buyers, in this case advertisers, we need to be friendly, at least get used to being a friendly person.




Those are some of the factors that influence advertisers' considerations, now now we will discuss, how to make it in blogger, the latest display we created is 300 x 250 and 125 x 125 pixels which is located on the sidebar of the blog.




Go ahead, here's the tutorial

 

 

 

 

Tutorial How to make Responsive Ad Slots on Blogger


1. Log in to your Blogger account – ThemesCustomizeEdit HTML

 



*{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
.iklan_iklan{background:#efefef;width:300px;margin:0 auto;text-align:center;padding:16.6666666667px}
.iklan{background:grey;height:125px;width:125px;display:inline;margin:0;padding:0;float:left;position:relative;}
.iklan:nth-child(1),.iklan:nth-child(3){margin-right:16.6666666667px}
.iklan:nth-child(1),.iklan:nth-child(2){margin-bottom:16.6666666667px}
.iklan a{position:relative;display:block;z-index:2}
.iklan:before{content:"Your Space 125x125";line-height:1.2;position:absolute;top:0;left:0;width:100%;height:100%;color:#fff;font-size:20px;display:flex;flex-direction:column;justify-content:center;z-index:1;}
.iklan-300{width:300px;height:250px;}
.iklan.iklan-300:nth-child(1){margin-right:0;margin-bottom:0;}
.iklan_iklan.p0{padding:0;}
.iklan-300:before{content:"Your Space 300x250";}
.clear{clear:both;}



2. Copy and Paste the CSS Style code above right before the code ]]></b:skin> or </style> , this must be extra careful, because it is still in the process of adjustment,

 

 


3. Save your Blogger Theme

4. Select the Layout / Layout menu – Add a Gadget – Select HTML/JavaScript – Enter the calling code below.






Universal Responsive Ad Code for Blogger



<div class="iklan_iklan p0">
    <div class="iklan iklan-300">
    <!-- Paste URL Gambar/Banner Disini -->
   
    </div>
    <div class="clear"></div>
</div>


<div class="iklan_iklan">
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni -->
    
    </div>
   
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni -->
   
    </div>
   
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni  -->
   
    </div>
   
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni  -->
   
    </div>
   
    <div class="clear"></div>
</div>


 

 

 

Pre-sized ad slots for Blogspot

 

If this is an ad slot that has been set in size...

 

Ad Slot Size 125 x 125 pixels



<div class="iklan_iklan">
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni -->
    
    </div>
   
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni -->
   
    </div>
   
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni  -->
   
    </div>
   
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni  -->
   
    </div>
   
    <div class="clear"></div>
</div>

 


Ad Slot Size 300×250 Pixels


<div class="iklan_iklan p0">
    <div class="iklan iklan-300">
    <!-- Paste URL Gambar/Banner Disini -->
   
    </div>
    <div class="clear"></div>


 

 

okay, finally finished too... well. this is the result, visitor...

If someone wants to advertise on your blog, just enter the gif or jpg or png image caller code right below the comment code. 


<!-- Paste URL Gambar/Banner Disni  -->

 

What I have provided above... adjust the size... if you don't know how, please search for "How to Create a Web Ad Banner in Adobe Photoshop" if you use Adobe Photoshop, or "How to Make a Web Ad Banner in GIMP" if you use software free graphics processor or freeware.



As an example of how to call the image:


<a href="#" target="_blank" rel="nofollow noopener" title="Bitcoin">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPtyCOgWbKsKFd54aUaHcUh47Krqp0hNDdY5B-2bznJALQE707K7n6WRmar7t8o_u-3RfvRJPVHPdU5rPUeWKR7fbVzrbS6k_W89YmI7xi2nROpaDLoHItuv_SiARpcbhfO573vccr5hQ/s694/html.JPG" alt="Slot Iklan" title="Slot Iklan responsive" height="125" width="125"/>
    </a>
 

 

That's it, bro... try to adjust the image first in Photoshop if you have a subscription or freeware graphics processing software gimp so it won't be flat... even though the above code has width and height settings, but it would be better if it was set before image uploaded.






 

thanks for listening and that's all  tutorial Create your own ad space on Blogger .






See you...

 

 

 

 

 

Post a Comment for "How to make RESPONSIVE ads space on Blogspot"

Article original from MyShorTTips Stuff. Don't Copied or Sale. Protected by LAW. Thanks for Reading.