How To ADD FEATURED or NEW Ribbon To Your Latest Blog Post?
- Open Dashboard.
- Click on Template.
- Backup your Templete.
- Choose 'Edit HTML'
- Find ]]></b:skin> in your template. (You can find the code by Ctrl+F)
- Just above it paste the subsequent code and save it.
.wrappera2z { margin: 50px auto; width: auto; height: auto; background: transparent; position: relative; } .ribbona2z { font: bold 20px Sans-Serif; text-align: center; transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); position: relative; padding: 7px 0; left: -25px; top: 7px; width: 160px; background-image: linear-gradient(top, #129, #12f); background-image: -o-linear-gradient(top, #129, #12f); background-image: -ms-linear-gradient(top, #129, #12f); background-image: -moz-linear-gradient(top, #129, #12f); background-image: -webkit-linear-gradient(top, #129, #12f); color: #fff; -o-box-shadow: 0px 0px 3px rgba(0,0,0,0.3); -moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3); -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3); box-shadow: 0px 0px 3px rgba(0,0,0,0.3); } .ribbona2z-wrapper12 { width: 86px; height: 88px; overflow: hidden; position: absolute; top: -4px; right: -4px; }
- Now Find <b:include data='post' name='post'/> in your template.
- Replace the above code with the below code
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:post.isFirstPost == "true"'>
<div class='wrappera2z'>
<div class='ribbona2z-wrapperaz'><div class='ribbona2z'>NEW</div></div>
<div id='first-post'>
<b:include data='post' name='post'/>
</div></div>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
- The word 'NEW' can be replaced with FEATURED there.
- Save the Template and See your Blog :)
I hope this post is helpful to you, please do comment if you liked it or any other suggestions.
Thank you.
Thank you.
Post a Comment Blogger Disqus