9gag Clone Blogger Template

9gag Clone Blogger Template

FEATURES OF 9GAG BLOGGER THEME

• 3 different Header styles
• Automatic Featured Posts
• Automatic Featured Posts
• Widget ready sidebars
• Automatic thumbnail creator
• Read More hack
• Page Navigation Widget
• Subscription box
• Favicon Included
• Comment form enabled
• Author comments new style
• Gravatar ready – Author
• Advertisement Ready

RELATED POSTS WITH AD

We have implemented a better way to display the related posts widget along with ad. To insert your Ad code, Go to EDIT HTML page of your template and click “Expand widgets” check box.

Then search for the following code :

<img style="background: none; border: none;" src="http://smashingtips.com/wp-content/uploads/2012/06/300x300.gif" alt="" />

Replace this code with either encoded adsense code or Banner image.

POST TITLE WITH SOCIAL MEDIA ICONS

POST THUMBNAIL SIZE MANAGEMENT

By default, I have set the image size used in 9gag site. But if you want to use this template for a tech blog and want to customize the image size width. Then you can do that by editing the following code in your template.

Go to EDIT HTML page of the template. And look for the following code.

<script type="text/javascript">// <![CDATA[

var thumbnail_mode = &quot;float&quot;;
summary_noimg = 500;
summary_img = 250;
img_thumb_height = 340;
img_thumb_width =460;
// ]]></script>
<script type="text/javascript" src="http://smashingtips.com/blogger/readmore.js">// <![CDATA[

There you can find the image width and height parameters img_thumb_height = 340; and img_thumb_width =460; . Change the width and height to suit your template.

WIDGETIZED SIDEBAR

I have made widgets to show recent posts with thumbnail and without thumbnail, Posts from any particular category with/without thumbnail, two columns category list and Scrolling followers box.

To include the widgets in your template, Please follow the steps mentioned here.

Let us take a look at the code for showing recent posts :

<script style='text/javascript' src='http://smashingtips.com/blogger/recent.js'>
// ]]></script><script type="text/javascript">// <![CDATA[
var numposts = 5;
var showpostthumbnails = true;
var displayseparator = true;
var showcommentnum = true;
var showpostdate = true;
// ]]></script>
<script type="text/javascript" src="http://domain.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=recent"></script>

In this change , domain name to your blog domain name.

<script type="text/javascript" src="http://smashingtips.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=recent"></script>

For showing posts from particular category :

Change the last line in the code to this.

<script type="text/javascript" src="http://domain.blogspot.com/feeds/posts/default/-/featured?orderby=published&alt=json-in-script&callback=recent"></script>

Here change the domain name and “featured” to the label name.

(DL#0182)

If All Links are not working / broken / deleted, Please Inform Us by Copying the DL# and Paste / Post / Message it to our Official Facebook Page. Simple as that. thanks for helping us!)