Red Hood

Love this
107
  • Layout
  • 2 Column with Right Sidebar, 1 Column
  • Colors
  • Red Hood template color schemes:
About this template
  • Date Released:   Nov, 2013
  • Designer:   Templateism
  • Price:   FREE
License
  • Creative Commons Attribution: You are free to use for personal/commercial use. But, you must attribute the work to the author. Should not remove credit links.
Statistics
  • Downloads:   15282
  • Demo views:   12279
  • 107 people love this template
Shortlist this Blogger template
Lovely Template Editor's Choice award winning template
Design Features
  • Responsive design
  • Designed to provide optimal viewing experience across wide range of devices from Desktop to mobile phones
  • Flat Design
  • Red Hood template has Flat Design. Flat design is a new trend in Web design that works without embellishment – drop shadows, bevels, embossing, gradients etc.,
  • Slide Show
  • Red Hood template has slide show (slider) in home page. Show your featured content in an easy to use slider
  • Post Thumbnails
  • Show a thumbnail image (small image) for every post using this template
  • Good Typography
  • Red Hood template has beautiful Typography (font styles). Your website will look beautiful and readable
  • Featured Post
  • Show featured posts in home page using this template. Engage your users by showing your top content in home page
  • Custom web fonts
  • Red Hood template uses Web fonts like Google Fonts. Improve your website typography by using custom fonts
Customization Features
  • HTML Menu
  • Navigation menu for this template is customizable in HTML. Edit the HTML to add your menu links
  • Widget Ready
  • Red Hood template comes with many widgetized area. Add your widgets easily using this template
  • Footer Widgets
  • Red Hood template comes with footer widgets. Use your footer area effectively for engaging your users
More Features
  • SEO Ready
  • Red Hood template is optimized for Search engines like Google. This template helps your website to rank higher in search engines
  • Ad Ready
  • Use this template to show Banner advertisement or Google ads easily. Make money using your site
  • Social Buttons
  • This template comes with social buttons like facebook, twitter etc., Let your users share your content easily
  • Search box
  • Red Hood template has search box in it. Search box helps your user to find the content easily on your site
  • Author Widget
  • Red Hood template comes with Author widget. Use this widget in post footer. Useful if your blog has multiple authors
  • Pagination
  • Pagination links helps users to navigate easily to your older posts. Users can click easy to use buttons to go to Page 2, Page 3 etc.,
Set up TopNavigation Menu

After installing this template, go to Template -- Edit HTML and find following code. Update the link url and Link names to your needs.

<!-- MENU [start] -->
<div class='menu-secondary-container'>

<ul class='menus menu-secondary'>

<li class='curent'><a expr:href='data:blog.homepageUrl'>Home</a></li>

<li><a href='#'>Business</a>
<ul class='children'>
<li><a href='#'>Internet</a></li>
<li><a href='#'>Market</a></li>
<li><a href='#'>Stock</a></li>
</ul>
</li>

<li><a href='#'>Downloads</a>
<ul class='children'>
<li><a href='#'>Dvd</a></li>
<li><a href='#'>Games</a></li>
<li><a href='#'>Software</a>
<ul class='children'>
<li><a href='#'>Office</a>
</li>
</ul>
</li>
</ul>
</li>

<li><a href='#'>Featured</a></li>

</ul>
</div>
<!-- MENU [end] -->

Set up Recent Posts Widget

Go to Layout page and click Edit in Recent posts widget. Then, paste the following code in the content box. Make sure to change <<your blog url>> to your blog website URL in the below code. You must upload 1 image in your posts by yourself otherwise it will not display it properly.

<script type='text/javascript'>
var numposts = 2;
var showpostthumbnails = true;
var displaymore = true;
var displayseparator = false;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 150;</script>
<script type="text/javascript" src="<<your blog url here>>/feeds/posts/default?max-results=5&orderby=published&alt=json-in-script&callback=labelthumbs"></script>

Set up Featured Post (TOP) Widget

Set up Featured Post (TOP) widget to show 4 featured post in the home page (below the slider). Go to Layout and click Edit on Featured Post (TOP) widget. Then, paste the following code in the content box. Make sure to replace "<<your-label-here" in the code to your featured label.

<div style='clear:both;'></div>
<script type='text/javascript'>
var numposts = 4;
var showpostthumbnails = true;
var displaymore = true;
var displayseparator = false;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 100;</script>
<script type="text/javascript" src="/feeds/posts/default/-/<<your-label-here>>?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>

Auto Logo generator

These template comes out of the box with automatic Logo generator using CSS. For this to work, you have to choose a two word Blog title like "REDHOOD PORTFOLIO".

Logo Slider

Update Logo Slider to feature your clients. Look for the following code in HTML and change it to your needs.

<!-- slider -->
<div class='slider-container'>

<ul id='slider'>
<li><a href='#'><img src='http://www.webdesignandsuch.com/posts/jquery-logo-slider-ticker/logos/1.jpg'/></a></li>
<li><a href='#'><img src='http://www.webdesignandsuch.com/posts/jquery-logo-slider-ticker/logos/2.jpg'/></a></li>
<li><a href='#'><img src='http://www.webdesignandsuch.com/posts/jquery-logo-slider-ticker/logos/3.jpg'/></a></li>
<li><a href='#'><img src='http://www.webdesignandsuch.com/posts/jquery-logo-slider-ticker/logos/4.jpg'/></a></li>
<li><a href='#'><img src='http://www.webdesignandsuch.com/posts/jquery-logo-slider-ticker/logos/5.jpg'/></a></li>
<li><a href='#'><img src='http://www.webdesignandsuch.com/posts/jquery-logo-slider-ticker/logos/6.jpg'/></a></li>
<li><a href='#'><img src='http://www.webdesignandsuch.com/posts/jquery-logo-slider-ticker/logos/7.jpg'/></a></li>
<li><a href='#'><img src='http://www.webdesignandsuch.com/posts/jquery-logo-slider-ticker/logos/8.jpg'/></a></li>
</ul>

</div><!-- /slider -->

Layout for Red Hood Blogger Template

  • Patrycja Długoń

    Hallo! I’d love to use your template but I have a problem with a slider – how to connect it with links to certain featured content (without photo size changes – that happened when I tried to make it with this code:

    .

    I will really appreciate your help!!! Thank you in advance! pd

  • Ciit Cluster

    the slider is not sliding automatically. can you tell me that what to do????

  • http://www.lipstickstainculture.blogspot.com morganmaypashen

    Your code for Featured Post (TOP) and Recent Posts does not seem to work. Can you assist?