How to Create Similar Link Ads Like AdSense Link Ads on Blogger - hyderabadrichest

How to Create Similar Link Ads Like AdSense Link Ads on Blogger

How to Make Cool Loading Effects Before Blog Images Appear

This time I will share a tutorial on How to Create Similar Link Ads Like AdSense Link Ads on Blogger. Because it is similar to Google AdSense link ads, you can use this link ad slot to open advertising services on your blog, and you can apply this link ad anywhere, either under posts, in the middle of posts or above posts.

That way you can provide more independent link ad slots with a cool appearance, because this ad link will look like an AdSense link ad display and of course also responsive.

How to Create Similar Link Ads Like AdSense Link Ads on Blogger

1. Please Login to  Blogger.

2. Then go to the THEME menu > click  Edit HTML .

3. Then find the following code  ]]></b:skin>  or  </style> and paste the CSS code right below   ABOVE  the code.
  *Adsense-like Link Ads by Hyderabad Richest*/   
.HyderabadRichestlink{width:100%;position:relative;padding-top:15px}
.HyderabadRichest:after{clear:both;content:"";display:block}
.label-HyderabadRichestlink{font-size:12px;color:#333;position:absolute;top:0;left:0;line-height:1}
.label-HyderabadRichestlink svg{width:15px;height:15px;vertical-align:-3px}
.label-HyderabadRichestlink svg path{fill:#00aecd}
.HyderabadRichestlink-left,.JagoanRedesignlink-right{width:calc(50% - 10px);float:left}
.HyderabadRichestlink-left{margin-right:10px}
.HyderabadRichestlink-right{margin-left:10px}
.tombol-link{width:100%;height:41px;display:block;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;text-align:center;line-height:41px;box-shadow:0 1px 1px rgba(255,255,255,0.35) inset,0px 1px 1px rgba(0,0,0,0.3);align-items:center;justify-content:center;background-color:#119af5;border:1px solid #ffffff;border-radius:30px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;color:#ffffff;font-weight:normal;font-family:arial,sans-serif;font-size:16px;margin:5px auto}
.tombol-link:hover{background-color:#fff;color:#333}
@media screen and (max-width:640px){.HyderabadRichestlink-left,.HyderabadRichestlink-right{width:100%;float:none;margin:0 auto}}
4. Next you SAVE THEME

5. Then you enter the LAYOUT menu> please select where you put the Widget> click ADD GADGET.

6. Then you select HTML/JAVASCRIPT and put the code below in it.
 <div class='HyderabadRichestlink'>  
<div class='HyderabadRichestlink-left'>
<a class='tombol-link' href='#' target='_blank'>Place an Ad Link Here</a><a class='tombol-link' href='#' target='_blank'>Place an Ad Link Here</a>
<a class='tombol-link' href='#' target='_blank'>Place an Ad Link Here</a>
<a class='tombol-link' href='#' target='_blank'>Place an Ad Link Here</a>
</div>
<div class='HyderabadRichestlink-right'>
<a class='tombol-link' href='#' target='_blank'>Place an Ad Link Here</a>
<a class='tombol-link' href='#' target='_blank'>Place an Ad Link Here</a>
<a class='tombol-link' href='#' target='_blank'>Place an Ad Link Here</a>
<a class='tombol-link' href='#' target='_blank'>Place an Ad Link Here</a>
</div>
<a href='#' target='_blank' title='Ad by Hyderabad Richest'>
<div class='label-JagoanRedesignlink'>
<svg x='0px'>
<path d='M7.5,1.5a6,6,0,1,0,0,12a6,6,0,1,0,0,-12m0,1a5,5,0,1,1,0,10a5,5,0,1,1,0,-10ZM6.625,11l1.75,0l0,-4.5l-1.75,0ZM7.5,3.75a1,1,0,1,0,0,2a1,1,0,1,0,0,-2Z'/>
</svg>
Ad by Hyderabad Richest
</div></a>
</div>

Well, that was a tutorial on How to Make Similar Link Ads Like AdSense Link Ads on Blogger, I hope the totorial will be useful for all of you. if there is anything you want to ask please just comment below.

Show Comments
Hide Comments

0 Response to "How to Create Similar Link Ads Like AdSense Link Ads on Blogger"

Post a comment

Top Ad Articles

Top Ad Articles

Top Ad Articles 2

Advertise Articles