AllBlogTools.com | Blogger Templates and Tricks

AllBlogTools.com | Blogger Templates and Tricks

Link to Blogger Templates, Tutorials, Tools | WordPress Themes | Allblogtools.com

Customizing Blogger’s Jump Break

Posted: 30 May 2012 07:09 PM PDT


This image has no alt text

A jump break is basically a Blogger feature allows you to show the reader a snippet of your post on your blog’s index page by inserting a “Read more” link to the full post page where your readers can keep reading. But some Blogger users want to change the phrase "Read more" with something of their own (e.g. Continue reading, Click for more), hence this TUTORIAL.

Be sure to back up your template first just to be safe.

  1. On your dashboard, go to 'Template' then 'Edit HTML'
  2. Check the 'Expand Widget Templates'
  3. Look for the following code (using Ctrl + F)
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/></a>

4. And just replace <data:post.jumpText/> with whatever you prefer (e.g. Continue reading). It should then look something like this:

<a expr:href='data:post.url + "#more"' expr:title='data:post.title'>Continue reading</a>

And that's all there is to it!

Subscribe Widget V2 with CSS3

Posted: 30 May 2012 05:53 PM PDT


This image has no alt text

One of the coolest gadgets that you can use to enhance your blog is the Subscribe widget. Fahad has created a new version of his previous work and this one has the most common social media platforms like Twitter, Feedburner, and Facebook.

The Subscribe Widget V2 with CSS3 is similar in nature as version 1, with the same classic look but with upgrades like CSS3 transitions and box shadows. The latest color combination also makes it more professional and fits automatically on your site's sidebar no matter what the size the latter is.

Adding it to your blog is pretty simple:

  1. Go to Blogger Dashboard > Layout
  2. Add a Gadget
  3. Select HTML/Javascript and copy and paste the code below

 

<style>
/* ---------My Blogger Tips Classic Subscribe Widget V2----------- */
.social-connect-widget{background:#D7D7D7;border:1px solid #E7E6DE;padding:10px; border-radius:5px; -moz-border-radius:5px;
-webkit-transition:all .6s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .6s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;
}
.social-connect-widget:hover{border:1px solid #CBCBC2;background:#FFFEF9;
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, .3);
box-shadow: 0px 0px 10px rgba(0, 0, 0, .3);
}
.social-connect-widget a{text-decoration:none;font-weight:bold;font-size:14px;font-family:Arial,Helvetica,Sans-serif;color:#4B4D4E}
.social-connect-widget a:hover{text-decoration:underline;color:#F77C04}
.social-connect-widget img{vertical-align:middle;margin-right:5px;height:32px;width:32;}
</style>
<!-- Start My Blogger Tips Classic Subscribe Widget V2 - http://www.mybloggertips.com -->
<div class='social-connect-widget' style='margin-top:0px;margin-bottom:10px;'>
<a href='http://feeds.feedburner.com/USERNAME'><img alt='RSS Feed' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUIndNnMQvgXbPxE9ft0UF6o70nidFQr6wDpts21ZSrXiYgHzrc6dH_WE0fBVrBUmsTLSwESDyYrbEmOhP0C1DzsgBS3BqiCAVnX1cNW2RigCNQh1FVbCneYn9nn9TLfcyqlJI2H4LnEFu/s1600/rss.png"/></a><a href='http://feeds.feedburner.com/USERNAME'>Subscribe to our RSS Feeds!</a>
</div>
<div class='social-connect-widget' style='margin-bottom:10px;'>
<a href='http://twitter.com/USERNAME'><img alt='Follow Us on Twitter!' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzWMvKq0zFwHNw8cLGEQx5Bd-b55Qs-zOG-n9NIkBMwj_oz0-Oq8qQ3Qj6Ahmx9Tf00cLkbXinO5P-wPPG7nZZHJ-Z_GSPm51Xf4ty9aDJ-rl9jGvzKnaRSs24QcBdJqKV5kua6Yt_Y7Bl/s1600/twitter.png" title='Follow Us on Twitter!'/></a><a href='http://twitter.com/USERNAME'>Follow Us on Twitter!</a>
</div>
<div class='social-connect-widget' style='margin-bottom:10px;'>
<a href='http://facebook.com/USERNAME'><img alt='Be Our Fan!' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPy7BpDjvvLkzFeP1__0qMb8X9Vb_OEGvxDp0zWcR62cfpz4GAR4shMBgtSaKIUWPi-7wP2g4cDVMhqITTf4i1KOI3xlpKeCJ4lpghMU7mTRXV9bdd6WPdHjTVnSh3v_iBShP0K-X-YYCM/s1600/facebook.png' title='Be Our Fan"/></a><a href='http://facebook.com/USERNAME'>Follow us on Facebook!</a>
</div>
<!-- End My Blogger Tips Classic Subscribe Widget V2 - http://www.mybloggertips.com -->

4. Replace the following with your own

http://feeds.feedburner.com/USERNAME with your own Feedburner id.
http://twitter.com/USERNAME with your own Twitter id.
http://facebook.com/USERNAME with your own Facebook fan page link.

 

5. Save.

 

Check out the LIVE DEMO.

 

TechMatrix

Posted: 30 May 2012 11:12 AM PDT


This image has no alt text

Note: There is a file embedded within this post, please visit this post to download the file.

  • Tech WordPress theme, Tech WordPress template.
  • 2 column, right sidebar, Ads banners ready, 3 Column footer.
  • Fixed width, top Slider, blue, white colors, free Premium.
  • TechMatrix is a free WordPress theme for tech blogs.

Hiç yorum yok:

Yorum Gönder