ADD ANYTHING HERE OR JUST REMOVE IT...

Sunday 30 December 2012

Diffuser Magazine Blogger Template

Posted by on 11:10
Diffuser Magazine Blogger Template
Template Name: Diffuser Magazine Blogger Template
Platform: Blogger / Blogspot
Release date : 25, December 2012
Author : www.templateism.com
License : Creative Commons Attribution 3.0

Download Preview


Diffuser is a fully mobile responsive Template for Blogger Enabled Websites, which is ready with the latest CSS3 effects and suites perfectly on Magazine, Business, Blogs and Corporate Websites. It is compatible with all browsers and works perfectly on Internet Explorer too. High Speed Google fonts are consumed which would surely magnetize the eyes of your visitors. It is fully compatible with portable devices i.e. iPhone, iPad, Android and etc. In short, It is fully compatible with mobile devices.

Diffuser Magazine Blogger Template

Features of Diffuser eMag Blogger Template: 

  1. Adapted From WordPress: The elements which have used in this Blogger template are adapted from WordPress. We are sure that there is no Blogger Template, which could match the features of this Theme.

  2. Thumbnail Related Posts: In this theme, we have added a Thumbnail Related post widget which would work on automation. The Thumbnails are of normal size so it could easily be seen by the readers. 

  3. Responsive Image Slider:  To promote your featured articles, we have included a Responsive image slider that would help a person in promotion. It could give extra limelight to a certain article. 

  4. SEO Friendly: This Blogger Template is SEO-friendly because it is pre-optimized for Search engines. According to Google Page speed it has obtained 92 score out of 100 which is indeed overwhelming for SEO. 

  5. Four Columns Footer: Unlike, other blogger themes, we have experimented with 4 columns widget in the Footer. It would allow users to add up to 4 Gadgets without facing any problem whatsoever.

  6. Static Home Page: This Theme also has Static Homepage, which shows Latest articles in different styles on homepage. However, on post pages it would continue to show articles in a well-organized manner.

  7. Auto Read More With Thumbnail: There is no need to use Read more page break tool in this template because it would automatically create summary with 1 Thumbnail, and would display them on the Home page.
More Features: 1 Sidebar, 2 columns Blog Layout,  Fixed Width, Dark Grayish Color Scheme, threaded commenting system and much more.

Customizing The Navigation Menu: 

To customize the navigation menu of this Blogger Template follow the following instructions correctly. Go To Blogger.com >> Template >> Edit Html >> Search for the following code and customize it according to your desired needs. However, if you get stuck in the middle feel free to leave your comment below.
<div id='main_container'>
<nav class='main'>
<div class='menu-header-container'><ul class='menu' id='menu-header'>
<li class='menu-item'><a href='#' title='Diffuser'><span class='nav_item'>Home</span></a></li>
<li class='menu-item'><a href='#' title='Music News'><span class='nav_item'>News</span></a></li>
<li class='menu-item'><a href='#' title='Top 10 Lists and More'><span class='nav_item'>Features</span></a></li>
<li class='menu-item'><a href='#' title='Songs'><span class='nav_item'>Songs</span></a></li>
<li class='menu-item'><a href='#' title='Videos'><span class='nav_item'>Videos</span></a></li>
<li class='menu-item'><a href='#' title='Free Music Downloads'><span class='nav_item'>Free Music Downloads</span></a></li>
<li class='menu-item'><a href='#' title='Interviews'><span class='nav_item'>Q+A</span></a></li>
</ul></div>

<div class='social_icons size_24'>
<a class='share_link facebook' href='https://www.facebook.com/templateism' target='_blank' title='Follow on facebook'><span class='social_icon'>follow on facebook</span></a>
<a class='share_link twitter' href='http://twitter.com/templateism' target='_blank' title='Follow on Twitter'><span class='social_icon'>follow on Twitter</span></a>
<a class='tip-us' href='mailto:staff@gigi.com'>Tip Us</a>
</div>
</nav>

<div class='horizontal_navigation clearfix alt_link_color' id='promo_links'>
<div class='menu-promo-links-container'><ul class='menu' id='menu-promo-links'><li class='menu-item'><a>Trending:</a></li>
<li class='menu-item'><a href='#' title=' 2012 Music Awards'> 2012 Music Awards</a></li>
<li class='menu-item'><a href='#' title='Remembering Joe Strummer'>Remembering Joe Strummer</a></li>
<li class='menu-item'><a href='#' title='Best Albums 2012'>Best Albums 2012</a></li>
<li class='menu-item'><a href='#' title='Shocking 2012 Moments'>Shocking 2012 Moments</a></li>
<li class='menu-item'><a href='#' title='Best Radiohead Songs'>Best Radiohead Songs</a></li>
</ul>
</div>

Adding Widgets Below/Above Posts:

Sometime, users desire to add Widgets either above or below the post pages. Therefore, we have made tried our best to make things easier for everyone. To Add a Gadget only on Post Pages either above or below post follow the following instructions.

Go To Blogger.com >> Template >> Edit HTML >> Proceed and Search for the Following coding.

To Show Below Post Title:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!--Google Adsense Ad Code (Below Post Title)-->
</b:if>
To Show at The end of Posts:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!--Google Adsense Ad Code (At the End of Posts)-->
 </b:if>
Replace <!--Google Adsense Ad Code (Below Post Title)--> or <!--Google Adsense Ad Code (At the End of Posts)--> with your Widget coding according to your desire needs.

From The Designer's Desk:

This Theme is ideal for Multimedia and Entertainment based Blogs and website because it has all the sparks which are required to run a Successful entertainment website. What are your thoughts about this Theme? any Errors or bugs that we forgot to remove? Suggestions are more then welcomed. 

The Designer Team of Templateism consists of a group of Professional Designers and Web Developers, led by .

20 comments:

  1. gru5 January 2013 at 23:42

    Hi Faizan,

    I have just come across to this website of yours.The font and design is somehow similar to a famous wordpress resource wpbeginner.com.

    This is what I had been searching for.Would you mind explain how you have managed to use this kid of font in blogger blog?

    Secondly which tools you use for blogger templates, widgets etc?

    ReplyDelete
  2. Movie Kang8 January 2013 at 16:54

    I love this template, and i've been hunting for something just like this for MONTHS.

    Im trying to customise the template However, I utilize bloggers mobile site a LOT. I've followed the the embedding code under post instructions so I can use the Disqus.com plugin, but I cant seem to get to enable the code so show on the mobile site using the " mobile='yes' " code, but this seems to only work if im using a widget from the layout section on blogger.

    HELP

    ReplyDelete
    Replies
    1. Movie Kangz8 January 2013 at 18:03

      Thanks for getting back..

      For some reason I cant move my widgets around as im getting the error message on the layout page "error while saving, refresh and try again"

      This error is making it impossible to simply INSTALL the code right from Disqus. So im having to generate the code and pasting it into the templates html as your instructions say.

      IM BAFFLED

      www.moviekangz.com

      Delete
  3. Movie Kangz8 January 2013 at 18:22

    Ive was using disqus for mobile as you can choose what widgets you want to run from the html code.

    As for the moving widget around in the layout theres still no joy

    ReplyDelete
    Replies
    1. Syed Faizan Ali9 January 2013 at 05:55

      I Have Rechecked the Layout and its working fine at my end. Can't understand why you are seeing errors.

      I Think you should go with Custom Commenting system for mobiles

      Delete
  4. Movie Kangz12 January 2013 at 16:32

    Hey Syed,

    I want to add my own background but im not sure what sizes i have to use, and there seems to be a white strip behind the header i want to remove..

    Help

    ReplyDelete
    Replies
    1. Syed Faizan Ali13 January 2013 at 02:41

      Look For Fixed Website Backgrounds. Here is a Example of it.

      http://2.bp.blogspot.com/-37u9x0TOE-4/UN9yQMwhuYI/AAAAAAAAAPM/ufutP8KJWAk/s1600/home-bg.jpg

      Delete
    2. Movie Kangz13 January 2013 at 16:12

      No i want to use my own.. but what size do i use, and I also dont what the background to scroll...

      Delete
    3. Syed Faizan Ali13 January 2013 at 23:21

      I have told you the Method. You can create a Background image by checking the Widget/Height of the image that i have given above.

      Yes, It would not scroll!

      Delete
  5. Movie Kangz8 February 2013 at 17:45

    Hey Syed,....... Is there any way we could get a label script to generate the feature slider pics??? instead of having to change this manually??

    Thanks

    ReplyDelete
    Replies
    1. Syed Faizan Ali9 February 2013 at 00:00

      Yeah there are some scripts that does the work automatically. We will soon integrate it on our Themes. Thanks for suggestion.

      Delete
    2. Movie Kangz9 February 2013 at 03:09

      Ok. Cool..

      Let us know

      Delete
  6. Movie Kangz27 February 2013 at 11:04

    I want to change the amount of posts shown on first page from 7 to 10? where do I change this in the code?

    Thanks

    ReplyDelete
    Replies
    1. Syed Faizan Ali28 February 2013 at 02:27

      You can Change them From Blogger >> Settings >> Posts and comments >> Show at most >> Enter 7 and Save.

      Delete
    2. Movie Kangz28 February 2013 at 02:47

      But I want to show 10 posts... not 7... ive tried changing in settings but it still only shows 7

      Delete
  7. Syed Faizan Ali7 April 2013 at 10:27

    This is the code which is used to display Dates <data:post.timestamp/>

    For resizing Images you can use this CSS

    .post-body img { width:500px; height:300px; }

    ReplyDelete
  8. Nessa16 April 2013 at 19:39

    For the post tile black label, how do I make it fixed position so that that it won't move each time when i use a portrait photo?

    ReplyDelete
  9. Nessie16 April 2013 at 19:40

    How do I make the post title fixed position so the alignment wont be off each time i use a portrait photo?

    ReplyDelete
  10. Nessa17 April 2013 at 02:02

    This comment has been removed by the author.

    ReplyDelete
  11. Syed Faizan Ali21 April 2013 at 00:42

    Just below the </head> tag paste this code.

    <b:if cond='data:blog.pageType == "index"'>
    <style>.post-body img { width: 600px!important; } .post h2 { margin-left: 20px!important; } </style>
    </b:if>

    ReplyDelete

Subscribe to: Post Comments (Atom)

Renovate Your Blogger Blog with Awesomness