Adsense Ads On Left Paragraph In Blogger Post- How do i Create it ?

 How to Add Adsense Ads On Left Paragraph In Blogger Post

I see users struggle to find ways to mad Adsense ads show up on the left side of their paragraph inside any of their post on bloggers. This ad placement is best suitable for users that have many words on the blog. This new script I have for you guys is very responsive in a way that when the blog is opened on a smaller screen, the ad position will change to above the paragraph. Because when the ad moves to the left-hand side of the paragraph, it will take up some space and it will make the appearance really bad. The text on the right-hand side will only appear slightly as it is driven by the width. So I'll advise you to reposition it on top only if it's opened on a smaller screen.

But just to let you know, if you are this kind of person that does put images at the top of every post or article like I do always, I love to show images before the whole writing of my articles, then this type of position is not good for you, because it will show up close to your image, which is larger. This is only suitable for blogs who write enough sentences before showing any images, so it better to move your images to the second paragraph before you do this.

So, first, the best ad size to use for this is 336 x 280  or 300 x 250, so it won't interface with the display of the text beside it.

How do I Create Adsense Ads On Left Paragraph In Blogger Post?

Step1) Look for this code <data:post.body/>

If you find more than one of that code, just make sure you choose what's inside the conditional tag of the posting page  <b: if cond=' data:view.isPost'>

Step2) Copy this HTML code below and paste it BEFORE the code mentioned earlier 

<b:if cond='data:view.isPost'<div class="iklankiri"> <!-- ad code here --> </div>

Then the end result will look like this code below

<b:if cond='data:view.isPost'> .... .... <div class="iklankiri"> <!-- ad code here --> </div> <data:post.body/> .... ....

Step3) Add this CSS code so that its position can be on the left while making it responsive as explained earlier. Now save the code Above <s/tyle> or ]]></b:skin> 

.iklankiri {float:left; margin-right:15px; margin-bottom:15px;} @media screen and (max-width:568px){ .iklankiri {float:none; display:block; margin:0px auto 15px; text-align:center;} }

Now save your changes, and hopefully, everything goes well. if it does work for you, don't forget to comment and share it with a friend.
Related Posts

Related Posts

Post a Comment