Most popular this week: Star ratings rich snippet on Google SERP with Graddit (for Blogger).

Friday, January 25, 2013

Blogspot template with Graddit widgets: mlnpics

Download template

From time to time I'm going to modify and publish free Blogspot templates witn Graddit widgets included. First example mlnpics is based on Queen template from DZignine.
Main page:

Post:

Key features:
  • used widgets: ratings, tops, aggregator;
  • default "Prev" and "Next" links are replaced with posts titles;
  • menu contains links to static pages, those pages display top posts (each page has it's own category). Order of the posts is controlled by graddit widgets and based on average rating. This kind of things are not provided by Blogspot platform by default — something that your visitors may find interesting;
  • users can navigate using Ctrl + left and Ctrl + right arrows, easier navigation = better user experience.

Live demo: http://mlnpics.blogspot.com.
Template source code is not yet published, please write your comments here if you think something should/might be changed. Download links will appear here later.

Important: template does not contain Graddit copyright, but it contains a copyright of the authors of the original template, that should stay untouched, you can not remove it.

Download template


Rate this posting:
{[['']]}

You might like:

12 comments:

  1. hi fruits, just had a look at the demo page
    it looks good, can we have a tutorial on how to do the preview stars on home page please?
    thanks

    ReplyDelete
    Replies
    1. thanks but that tutorial does not work like the template it only shows preview inside post page and not search or home or label pages im afraid, the script you used in this template is diifernet and can u giv the link to download this pre template

      Delete
    2. I have updated the post with Download template link.

      Delete
    3. thanks i have analysed the template it looks like step 3 was missing thats why didnt work

      check http://fruitfulbookmarks-en.blogspot.com/2012/04/how-to-duplicate-rating-information.html

      i updated the code there

      thanks

      Delete
  2. hi fruits

    ok this is working perfectly on my site apart from it delays my search page a very long time because it fetches the raiting info one by one

    have a look? http://www.banglatune.co.uk/search?&max-results=33

    can u please make a non blocking code for this? so it loads up after the page has loaded just like the gradit raiting non block on post pages

    ReplyDelete
    Replies
    1. I don't know why you have old code on search page. Check this: http://fruitfulbookmarks-en.blogspot.com/search?&max-results=10 - non-blocking code is working fine with search on this blog and I didn't do anything additionally to have it working. Possibly you have a separate rule for search page and using old code there, check you template and try to replace the code there. Don't forget to save template before that.

      Delete
    2. I already have the non block code installed for post pages and it working but I need one for the search label pages you see

      Delete
    3. @Evgeny Masibut
      can i see your blog

      basickly i have a different rule setup for my search label page as so i need a non block code for the graddit preview call back code on my search label page
      as i said before i already have the non block code installed and working on post pages

      heres the code that i need to be modified with the non block code, let me know fruits, thanks

      <div expr:id='&quot;graddit_preview_rating_&quot; + data:post.id'/>
      <div class='ffbs_rate' expr:id='data:post.id' style='display: none;'>{[[&quot;&#9734;&quot;,&quot;&#9733;&quot;]]}</div>
      <script expr:src='&quot;http://www.graddit.com/rate/eng/10/&quot; + data:post.id + &quot;?id=&quot; + data:post.id + &quot;&amp;url=&quot; + data:post.url + &quot;&amp;callback=previewRating&amp;stats=&quot;' type='text/javascript'/>

      Delete
    4. This is my blog, I just changed the profile. And I gave you the link - http://fruitfulbookmarks-en.blogspot.com/search?&max-results=10 - there non-blocking code is working fine without any modifications. Copy your template to a test blog and replace old graddit code for search pages with new non-blocking. It's hard to say why it's not working when there's no example.

      Delete
    5. just to clear things up a little

      i am using the exact same method as your minipics custom template all the codes are the same as

      http://mlnpics.blogspot.co.uk/

      and i followed this instructions;

      'How to duplicate rating information using javascript '
      http://fruitfulbookmarks-en.blogspot.co.uk/2012/04/how-to-duplicate-rating-information.html

      so this is how i am showing on my label search page the same as your minipics custom template

      non block code does not work on minipics website?
      it takes a long time to load all the posts one by one this is the same problem im facing too on my homepage and search page,

      so the problem is the gradit preview call back code,
      this code is in the label search page to show only preview screenshot of posts raitings,

      here is the code:

      <div expr:id='&quot;graddit_preview_rating_&quot; + data:post.id'/>
      <div class='ffbs_rate' expr:id='data:post.id' style='display: none;'>{[[&quot;&#9734;&quot;,&quot;&#9733;&quot;]]}</div>
      <script expr:src='&quot;http://www.graddit.com/rate/eng/10/&quot; + data:post.id + &quot;?id=&quot; + data:post.id + &quot;&amp;url=&quot; + data:post.url + &quot;&amp;callback=previewRating&amp;stats=&quot;' type='text/javascript'/>

      fruits you need to modify this code to make this code only load at the end on blogger search label pages just like you did with gradit post pages,

      once you done this it should work

      i hope this makes sense know

      Delete