WELCOME TO EHOST.COM.NP

Tuesday, December 6, 2016

Customizable Related Posts Widget for Blogger

ads space

We already posted a few tutorials on how to add related posts widget with thumbnails in Blogger with summaries or only titles, which can be compiled into a single All-In-One Widget with powerful options. This new customizable related posts widget for Blogger integrates all the features we’ve seen before and more, such as thumbnails (square or round), post dates, excerpts, display only titles / thumbnails.

Now let’s see what this related posts blogger widget has to offer.


related posts widget, blogger widget

Related Posts Widget Features:


  • 9 attractive styles to match your needs

  • Show Title, excerpt & thumbnails

  • Display simple related posts with titles / summaries / post date

  • Choose whether to display the post thumbnails or not

  • Ability to control the thumbnail image size

  • Option to choose square or round thumbnails

  • Show post text excerpts

  • Control the length of the post excerpt / title

  • Determine the number of related posts to display

Requirements:


  1. The related posts widget recognizes post thumbnails uploaded through Blogger itself (or Picasa Web Albums), other images from Photobucket, Flickr, or other non-Blogger hosts will not be supported.
  2. This widget is compatible with the standard desktop Blogger templates except Dynamic Views, which does not accept customization.
  3. The script does not work on private blogs, so your blog / site must be open to the public in order to show.

Adding Customizable Related Posts Widget in Blogger


Log into your Blogger dashboard, go to ‘Template’ and open template editor by clicking the ‘Edit HTML’ button below ‘Live On Blog’ preview.

Next, we’re going to use the template search feature, be sure to follow these directions exactly:


1. Place your cursor on the template code.
2. Click once.
3. Press CTRL and F at the same time (PC) or Command and F (Mac).


The search box will open in the upper right corner of the template editor.



Type in the search box, then press ENTER. This will take you to the tag in your template and highlight it in yellow.

Select and copy the entire CSS style below and paste it directly ABOVE the tag:



ads space
ADS SPACE

0 comments:

Post a Comment

Categories

Article How-to All Posts WordPress Android Web design Blogger Plugins CSS Google JQuery Plugins Programming Reviews Web Hosting Blogger Blogging Blogging Tips Tricks Web Development Facebook Git Internet Make Money Online Social Plugins Tips Tips and Tricks Tools Tutorials Windows WordPress Plugins Blogging Tips and Tricks Freebies GSM Google Analytics HTML How To's JavaScript Plugin Development S.E.O SEO SMS SmartPhone Social Media Tips amp; Tricks Top-Most Updates Webmaster Tools Whatsapp Applications Apps Blogger Basics Documentary Downloads Entertainment Gadgets Games Gmail Google AdSense Guest Post IPhone Make Money Blogging SVN Security Softwares Web Hosting Tips and Tricks Wordpress Tips Wordpress Tips and Tricks hostgator iOS Advertising Networks Advertising Technology Affiliates Antivirus Audience amp; Traffic Biography Blog post Blog post Blogger Blogger Errors Blogger Tips Blogger Tools Blogger Widget Blogosphere Bogger Widgets CSS selectors CSS symbols CSS3 Computer amp; Internet Content Writing Coupon Codes Data amp; Analytics Deleted blog Design DoubleClick for Publishers Email and newsletter marketting Email marketing Excel Tips Excel Tips and Tricks Facebook Tricks Feed Feedburner Feedburner subscribers Font Fun GitHub Giveaways Gmail primary inbox Gmail tabs Google sign-in Guides HTML amp; CSS HTML5 Infographics Inspirational Instagram Internet Marketing Internet Tips amp; Tricks Job Listings Knowledge Life Hacks Lists Make-Money Monetization amp; Conversion Monetize Navigation Online Marketing Other PHP Tutorials Passport Publishing amp; Content Quotes RSS Sidebar Smartphones Social Networking Status Tech Tech Blog Technology Telegram Themes UI / UX User Psychology amp; Research VB.Net Web Tools Web browser Widget Windows Tips Windows-10 ad viewability admin notice blogging tools bluehost cherry-pick clone cors custom scrollbar customizer dismissible notices duplicate post feed title git branch git clone gpg gpg2 hybridauth iPad icon font notice responsive wordpress theme same origin policy scrollbar signed git commit smartsvn theme customizer vcs wordpress theme wordpress themes

Blog Archive