Embeding URL, HTML, Forum Links Code in Blogger Posts

Tag
Diposkan oleh Unknown on Saturday, January 1, 2011 di Saturday, January 01, 2011

How to create a widget Embeding URL, HTML, Forum Links Code in Blogger Posts, for your visitors to link back to your article/blogger post. This widget will show 3 codes (Blog Post URL, HTML code to embed your post to a website, Forum Link to embed your post to a forum) below your blogger post. The steps given below.

1. Login to your blogger dashboard--> layout- -> Edit HTML

2. Find code : </head> tag.

3. Copy below code and paste it just before the </head> tag.

<style type='text/css'>
.about-article{
background-color:#cccccc;
padding-bottom:5px;
padding-left:5px;
padding-right:auto;
font-size:12px;
}
.about-article input{
background-color:#ffffff;
}
</style>

4. Now find below code : <data:post.body/>

5. Copy below code and paste it after the <data:post.body/> 


<b:if cond='data:blog.pageType == &quot;item&quot;'>
&lt;div class=&quot;about-article&quot;&gt;<p>If you find this article useful, please feel free to link to this page from your website or blog.</p>&lt;p class=&quot;noborder&quot;&gt;&lt;label for=&quot;aa-url&quot;&gt;URL:&lt;/label&gt;&lt;br /&gt;&lt;input size=&quot;80&quot; readonly=&quot;readonly&quot; onclick=&quot;this.focus();this.select();&quot; type=&quot;text&quot; id=&quot;aa-url&quot; value=&quot;<data:post.url/>&quot; /&gt;&lt;/p&gt;&lt;p&gt;&lt;label for=&quot;aa-forum&quot;&gt;HTML Link:&lt;/label&gt;&lt;br /&gt;&lt;input size=&quot;80&quot; readonly=&quot;readonly&quot; onclick=&quot;this.focus();this.select();&quot; type=&quot;text&quot; id=&quot;aa-forum&quot; value=&quot;&lt;a href=&amp;quot;<data:post.url/>&amp;quot;&gt;<data:post.title/>&lt;/a&gt;&quot; /&gt;&lt;/p&gt;&lt;p&gt;
&lt;label for=&quot;aa-forum&quot;&gt;Forum Link:&lt;/label&gt;&lt;br /&gt;
&lt;input size=&quot;80&quot; readonly=&quot;readonly&quot; onclick=&quot;this.focus();this.select();&quot; type=&quot;text&quot; id=&quot;aa-forum&quot; value=&quot;[url=<data:post.url/>]/<data:post.title/>[/url]&quot; /&gt;&lt;/p&gt;
<p align='center'></p>
&lt;/div&gt;<br/>
</b:if>

6. Save your template and you are done.