In this tutorial I will show you how easy it is to add a screenshot to each submission just like Digg.
There are only 2 files to edit for this hack, link_summary.tpl and style.css.
Open link_summary.tpl and find:
{checkActionsTpl location="tpl_link_summary_pre_story_content"}
{if $pagename eq "story"}{checkActionsTpl location="tpl_pligg_story_body_start_full"}{else}{checkActionsTpl location="tpl_pligg_story_body_start"}{/if}
{if $viewtype neq "short"}
<span class="news-body-text">
<span id="ls_contents-{$link_shakebox_index}">
</span></span></div>
change it to:
{checkActionsTpl location="tpl_link_summary_pre_story_content"}
{if $pagename eq "story"}{checkActionsTpl location="tpl_pligg_story_body_start_full"}{else}{checkActionsTpl location="tpl_pligg_story_body_start"}{/if}
{if $viewtype neq "short"}
<span class="news-body-text">
<img src="http://images.websnapr.com/?url={$url_short}&size=T" class="storythumb"/>
<span id="ls_contents-{$link_shakebox_index}">
</span></span></div>
Save.
Open style.css and add anywhere:
.storythumb {
float:right;
border: 1px solid #b7cce0;
padding: 3px;
}
That’s it, I have websnapr as default screenshot supplier, though I always recommend using Shrink the Web.
You can see a demo over at Web Link Depot.
As always, post your thoughts and questions below.
You can also follow me on Twitter, where I will always help one on one.






