WebSnapr for blogger classic and beta

Por | 19 de Novembro de 2006

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

Deixe uma resposta

O seu endereço de email não será publicado. Campos obrigatórios marcados com *