Do you want to show scrennshots along with your blog/posts links? Websnapr comes to help.
A-How to install websnapr on your blogger classic template
1-Download and upload the previewbubble.zip file onto your server. Edit previewbubble.js file and make sure the correct location of the bg.png file is plcaced. For example:
var bubbleImagePath = 'http:\\.......\bg.png';
2-Include previewbubble.js in your blogger header.
<script type="text/javascript" src="previewbubble.js"></script>
3-Add class="previewlink" attribute to the links you wish to bind the preview event to. For example:
<a class="previewlink" href="http://ricardouk.blogspot.com">Ricardo Santos</a>
B-How to install websnapr on your blogger beta template
1-Download and upload the previewbubble.zip file onto your server. Edit previewbubble.js file and make sure the correct location of the bg.png file is plcaced. For example:
var bubbleImagePath = 'http:\\.......\bg.png';
2-Include previewbubble.js in your blogger header.
<script src='previewbubble.js' type='text/javascript'/>
3-Add class="previewlink" attribute to the links you wish to bind the preview event to. For example:
<a class="previewlink" href="http://ricardouk.blogspot.com">Ricardo Santos</a>
4- to install the screenshot function to the Linklist on Blogger beta:
Go to your blog template and click on " Expand Widget Templates" and locate the following piece of code:
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<ul>
<div id='link'>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target' target='_blank'><data:link.name/></a></li>
</b:loop>
and add/edit like shown in the following piece of code:
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<ul>
<div id='link'>
<b:loop values='data:links' var='link'>
<li><a class='previewlink' expr:href='data:link.target' target='_blank'><data:link.name/></a></li>
</b:loop>
Check it in action in my sidebar
Enviar um comentário