Home
Contact Me
Twitter
Mobile
My Facebook
Style your Post page with two column under post
Tips and Tricks by
Thangaraju at Wednesday, April 21, 2010
|
Share this post:
|
|
2 Comments
How To add a Two Columns Widget Under every Posts
The example of CSS code is supposed enough, so let’s move to HTML Code to define or call the function of the CSS code we have discussed.
Let’s see the simple example on how to implement the above code in your template:
Login to blogger
Click Layout
Click Edit HTML
Please backup your template first before you edit it by clicking “Download full template”
Check the small box next to “Expand Widget Templates”
Find the code ]]></b:skin>, then copy and paste the code below, exactly above the code ]]></b:skin>:
underpostcolumn {
margin:15px 0px 10px 0px;
padding:5px 0;
clear:both;
}
.underleftcolumn{
float:left;
width:265px;
margin-right:15px;
}
.underrightcolumn {
float:right;
width:265px;
}
* Find this code:
<data:post.body/>
* Copy and paste the code below, exactly under the code:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='underpostcolumn'>
<div class='underleftcolumn'>
Left column ads code here
</div>
<div class='underrightcolumn'>
Right column ads code here
</div>
</div>
</b:if>
Replace with your code in red lined place
Click SAVE TEMPLATE.
/
Click to View Blog Start Help