Using Bitty Browser to Enhance your Posts

If you reviewing particular Website or blog, you may want to include a fresh “screenshot” from the site’s main page. That will give your visitors a better insight on what you are reviewing, and add credibility to your review.

Here, you can use the free services offered by Bitty Browser. Bitty Browser actually helps you keep track of the foreign Web stuff by enabling navigable windows directly within your own site and your own post — it's like Picture-in-Picture for the Web.

Create the widget is easy: enter the desired URL and the embed code will be created automatically. Below is example of my other blog devoted to the Web Freebies, embedded in the post.

Using the service does not require registration. Start from the main page: http://www.bitty.com/

Linkwithin Related Post Widget Review

As any other blogger, I have explored several ways to install random or relevant articles widgets on this blog, trying to attract the readers not just with the information, they came for through the search engine, but also offering them a chance to stumble on some of my older posts. Until recently, I could not find one, which really made impact on my stats…

Before I installed LinkWithin widget… I tried it on one of the blogs, then on other… The results of the investigation were quite positive. From a technical standpoint, the widgets are working flawlessly on all of blogs, I have embedded them to.  And now I would definitely recommend them for anyone who has been blogging long enough to build a decent collection of articles.

LinkWithin is blog widget that creates 3-5 links to your related older posts from your blog, looking for appropriate titles, keywords, and text, which matches more or less your recent publication. It puts a thumbnail picture under your posts or just plain text links, if the adequate posts with images could not be located on your blog. So by putting LinkWithin in your blog, you encourage your reader to see some of your blog posts, they would most likely miss without this hint. This is the known SEO (Search Engine Optimization) approach of interlinking your posts.

The main features of the LinkWithin widget:

1. It's Free.
2. No Sign-up required.
3. No Advertisement Included.
4. Fast to install (less than 5 minutes)
5. Good SEO tactic.
6. Simple and Elegant Design.
7. Works fine, with no glitches.

The plugin is available for Wordpress, Typepad, and Blogger platforms. The instructions for installing the widget on Blogger were nice and clear. There are also instructions which tailor it to different types of platforms. Note that you are provided clear instructions only when you provide email address and blog web address. You have also options to mark if you have a dark text on light background, or light text on dark background, so that will help to match widget appearance to your blog theme.

Actually, you can see the possible output at the bottom of this and any other posts on this page.

Highly Recommended!

Website: http://www.linkwithin.com/learn

Related Posts Widget for Blogger Blog

If you are using the standard blogger approach, your posts are structured through time related logical way. You post new publications, and they appear in the blog history widget. Only for the explicit cases, when your reader is stunned and mesmerized by the publication he came to see through the referral site or search engine, he will dig more, exploring other publications on your blog. Other than that, he will go further, in the best case, leaving a comment. How can you keep him longer? How can you present other beautiful posts, he might find interesting? In one of the previous posts Rotating Post Widget for Blogger Blog I have already presented a way to show something extra to the reader. However, while doing what it is supposed to do, the presented widget does not show the particular articles that are relevant to the blog post your reader came to see. Therefore, embedding the Relevant Articles Widget for Blogger might represent a better solution.


The relevance of the posts is based on the tags or labels, assigned to each of the posts on your blog.

The Widget can be embedded in 9 steps:
1. Go to Layout >Edit HTML in your Blogger Dashboard.

2. Back up your existing Template before making any changes! Export your template to the safe, easy identifiable location.

3. Check the "Expand Widget Templates" box.

4. Search for the </head> tag.

5. Add the following code just before the </head> tag.

<style>
#related-posts {
float : left;
width : 540px;
margin-top:20px;
margin-left : 5px;
margin-bottom:20px;
font : 11px Verdana;
margin-bottom:10px;
}
#related-posts .widget {
list-style-type : none;
margin : 5px 0 5px 0;
padding : 0;
}
#related-posts .widget h2, #related-posts h2 {
color : #940f04;
font-size : 20px;
font-weight : normal;
margin : 5px 7px 0;
padding : 0 0 5px;
}
#related-posts a {
color : #054474;
font-size : 11px;
text-decoration : none;
}
#related-posts a:hover {
color : #054474;
text-decoration : none;
}
#related-posts ul {
border : medium none;
margin : 10px;
padding : 0;
}
#related-posts ul li {
display : block;
background : url("http://i299.photobucket.com/albums/mm297/zozuglogger/weed-bullet.gif") no-repeat 0 0;
margin : 0;
padding-top : 0;
padding-right : 0;
padding-bottom : 1px;
padding-left : 16px;
margin-bottom : 5px;
line-height : 2em;
border-bottom:1px dotted #cccccc;
}
</style>
<script src='http://torrentmoon.com/javascripts/Related_posts_hack.js' type='text/javascript'/>

6. Now search for <p><data:post.body/></p>

7. Add the following code just beneath the code you just searched for.

<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=5"' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>

8. The default number of the posts is 5 in the code, but at this step you can modify it as per your needs, changing the number in the following line: max-results=5

9. Now Save your Template and you're done!

The credit for the gadget development goes to the Widgets4Free blog.

How to disable text selection on Blogger blog

In one of the previous publications, we presented a way to disable right click on the page of your Blogger blog to decrease the copyright violations from your readers “borrowing” your content for their own purposes. To go further in your content safeguarding efforts, you can make the next step, disabling text selection on your page entirely.

This hack was created by Dynamicdrive as well in the form of Javascript, and is also applicable to those bloggers who don’t like their content copied by others. If this concern is on top of your priorities list, then Copy the following code and Paste it to your blog template:


<script type="text/javascript">

/***********************************************
* Disable Text Selection script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

function disableSelection(target){
if (typeof target.onselectstart!="undefined") //IE route
target.onselectstart=function(){return false}
else if (typeof target.style.MozUserSelect!="undefined") //Firefox route
target.style.MozUserSelect="none"
else //All other route (ie: Opera)
target.onmousedown=function(){return false} How to disable
target.style.cursor = "default"
}

//Sample usages
//disableSelection(document.body) //Disable text selection on entire body
//disableSelection(document.getElementById("mydiv")) //Disable text selection on element with id="mydiv"

</script>

How to include social bookmarking submission after every post?

Every blog owner will benefit from sustaining the readers on the blog content. To reach this goal, it should be offered an easy and convenient way to subscribe to the blog through RSS reader and to allow submitting it to the Social Bookmarking sites. Social Bookmarking is indeed a great way to increase the blog exposure, bringing multiple benefits to the owner. Not just the reader preserves the post for further review and follow-up, but also the bookmark itself starts its own independent way of online existence. It will be indexed by Search Engine spider and will allow one more point of access to the blog content. It is just multiplying your blog exposure legally, with no additional efforts, and with no need to post duplicate your content on multiple sites.

Bloggerplugins offer a nice way to include small buttons after every post, allowing direct submission to the most popular social bookmarking sites with one click, without leaving the blog post.

To enable this option on your blog you should go through several simple steps of blog template code update:

1. Enter Blogger template in Layout section.
2. Choose Edit HTML.
3. Before doing any code modification, backup the entire template to the safe, easy identifiable location on your Hard Drive. If anything goes wrong, you can easily come back to your original template without loosing your blog structure.
4. Expand the widget template.
5. In the template:
a. Locate

<head>

b. Replace with

<head><script src=’http://files.bloggerplugins.org/simpletricks.js’></script>

c. Locate string

<p class=’post-footer-line post-footer-line-3’>

d. Place the following code below that line:

<!-- Social Bookmarking Icons Start www.bloggerplugins.org-->

<style type=’text/css’>

.bookmark img { border: 0;

padding:0px; }

.bookmark a:hover {

position: relative;

top: 1px;

left: 1px; }

</style>

<span class=’bookmark’>

<table align=’left’ border=’0’ cellpadding=’0’ width=’100%’>

<tr>

<td style=’vertical-align:middle’ valign=’middle’ width=’30%’>

<div expr:id=’"sbtxt"+data:post.id’>Bookmark this post<a style="text-decoration:none;" href="http://www.bloggerplugis.org">:</a></div><script type=’text/javascript’>showsbtext(&quot;sbtxt&quot; + &quot;<data:post.id/>&quot;,0)</script>

</td>

<td>

<a rel="nofollow" expr:href=’"http://www.stumbleupon.com/submit?url=" + data:post.url + "&amp;title=" + data:post.title’ expr:onmouseout=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",0);"’ expr:onmouseover=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",19);"’ target=’_blank’><img alt=’StumpleUpon’ src=’http://files.bloggerplugins.org/icon_sb_stumb.gif’/></a> <a rel="nofollow" expr:href=’"http://ma.gnolia.com/bookmarklet/add?url=" + data:post.url + "&amp;title=" + data:post.title’ expr:onmouseout=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",0);"’ expr:onmouseover=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",6);"’ target=’_blank’><img alt=’Ma.gnolia’ border=’0’ src=’http://files.bloggerplugins.org/icon_sb_mag.gif’/></a>

<a rel="nofollow" expr:href=’"http://digg.com/submit?phase=3&amp;url=" + data:post.url’ expr:onmouseout=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",0);"’ expr:onmouseover=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",1);"’ target=’_blank’><img alt=’DiggIt!’ src=’http://files.bloggerplugins.org/icon_sb_dig.gif’/></a> <a rel="nofollow" expr:href=’"http://del.icio.us/post?url=" + data:post.url + "&amp;title=" + data:post.title’ expr:onmouseout=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",0);"’ expr:onmouseover=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",2);"’ target=’_blank’><img alt=’Del.icio.us’ src=’http://files.bloggerplugins.org/icon_sb_del.gif’/></a> <a rel="nofollow" expr:href=’"http://www.blinklist.com/index.php?Action=Blink/addblink.php&amp;Description=&amp;Url=" + data:post.url + "&amp;Title=" + data:post.title’ expr:onmouseout=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",0);"’ expr:onmouseover=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",3);"’ target=’_blank’><img alt=’Blinklist’ src=’http://files.bloggerplugins.org/icon_sb_bli.gif’/></a> <a rel="nofollow" expr:href=’"http://myweb2.search.yahoo.com/myresults/bookmarklet?u=" + data:post.url + "&amp;=" + data:post.title’ expr:onmouseout=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",0);"’ expr:onmouseover=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",4);"’ target=’_blank’><img alt=’Yahoo’ src=’http://files.bloggerplugins.org/icon_sb_yah.gif’/></a> <a rel="nofollow" expr:href=’"http://www.furl.net/storeIt.jsp?u=" + data:post.url + "&amp;t=" + data:post.title’ expr:onmouseout=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",0);"’ expr:onmouseover=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",8);"’ target=’_blank’><img alt=’Furl’ src=’http://files.bloggerplugins.org/icon_sb_fur.gif’/></a> <a rel="nofollow" expr:href=’"http://www.technorati.com/cosmos/search.html?url=" + data:post.url’ expr:onmouseout=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",0);"’ expr:onmouseover=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",9);"’ target=’_blank’><img alt=’Technorati’ src=’http://files.bloggerplugins.org/icon_sb_tec.gif’/></a> <a rel="nofollow" expr:href=’"http://www.simpy.com/simpy/LinkAdd.do?href=" + data:post.url + "&amp;title=" + data:post.title’ expr:onmouseout=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",0);"’ expr:onmouseover=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",10);"’ target=’_blank’><img alt=’Simpy’ src=’http://files.bloggerplugins.org/icon_sb_sim.gif’/></a> <a rel="nofollow" expr:href=’"http://www.spurl.net/spurl.php?url=" + data:post.url + "&amp;title=" + data:post.title’ expr:onmouseout=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",0);"’ expr:onmouseover=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",11);"’ target=’_blank’><img alt=’Spurl’ src=’http://files.bloggerplugins.org/icon_sb_spu.gif’/></a> <a rel="nofollow" expr:href=’"http://reddit.com/submit?url=" + data:post.url + "&amp;title=" + data:post.title’ expr:onmouseout=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",0);"’ expr:onmouseover=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",17);"’ target=’_blank’><img alt=’Reddit’ src=’http://files.bloggerplugins.org/icon_sb_red.gif’/></a> <a rel="nofollow" expr:href=’"http://www.google.com/bookmarks/mark?op=add&amp;bkmk=" + data:post.url + "&amp;title="+data:post.title’ expr:onmouseout=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",0);"’ expr:onmouseover=’"javascript:showsbtext(’"sbtxt" + data:post.id + "’",20);"’ target=’_blank’><img alt=’Google’ src=’http://files.bloggerplugins.org/icon_sb_goo.gif’/></a>

</td>

</tr>

</table><br/>

</span>

<!-- Social Bookmarking Icons End www.bloggerplugins.org-->

6. Save the modified template.
7. If the operation was successful, you should see the line of social bookmarking icons after each post.

Recent Posts Widget on your Blogger Blog

In one of my previous publications, I have offered the opportunity to embed the Blogger pluging to post 10 recent posts summaries on a sidebr of your Blogger Blog. The problem is - the script did not work on Blogger. With my weak programming knowledge, the best thing I could do was to find a valid substitute solution. Here you can access the site, offering to generate such a plugin.

The Recent Posts Widget displays recent posts summaries in your sidebar. You can customize this widget to display the recent posts of any blogger blog that you like, you can customize the number of posts to display, whether or not to display a post summary and the size of this summary (in number of characters). Just Fill Out the Details in the Widget installer, and it will be automatically transferred to your Blogger Blog layout for update.

This time, I personally tested it, and confirmed that the plugin code works fine.