Saved Templates

Your saved templates are stored in this browser.

Select the heart on a template to save it here.

Search Templates & Articles

Type at least 2 characters to search.

Hermes Mag

Hermes Mag is Simple, Minimalist Blogger Template for any Blogger blog. Hermes Mag Blogger Template has Features like Slider, Navigation Menus, Social Buttons and 3 Columns Footer.

How To Add Links to Top Navigation Menu

Find this in “Edit HTML”:

<div class='menu'>
<ul id='menu-primary-items'>

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

<li><a href='#'>Business</a>
<ul class='sub-menu'>
<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='sub-menu'>
<li><a href='#'>Dvd</a></li>
<li><a href='#'>Games</a></li>
<li><a href='#'>Software</a>
<ul class='sub-menu'>
<li><a href='#'>Office</a>
</li>
</ul>
</li>
</ul>
</li>

<li><a href='#'>Parent Category</a>
<ul class='sub-menu'>
<li><a href='#'>Child Category 1</a>
<ul class='sub-menu'>
<li><a href='#'>Sub Child Category 1</a></li>
<li><a href='#'>Sub Child Category 2</a></li>
<li><a href='#'>Sub Child Category 3</a></li>
</ul>
</li>
<li><a href='#'>Child Category 2</a></li>
<li><a href='#'>Child Category 3</a></li>
<li><a href='#'>Child Category 4</a></li>
</ul>
</li>

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

<li><a href='#'>Health</a>
<ul class='sub-menu'>
<li><a href='#'>Childcare</a></li>
<li><a href='#'>Doctors</a></li>
</ul>
</li>

<li><a href='#'>Uncategorized</a></li>
		
</ul>
</div>

Replace “#” marks with real URLs and change anchor texts as you like.

How To Configure Featured Content Slider:

Find this in “Edit HTML”:

<div class='slides_container'>

   <!-- slide 1 code start -->
   <div class='slide'>
      <a href='ENTER-SLIDE-1-LINK-HERE'><img height='490' src='http://2.bp.blogspot.com/-XprtQ9SXWI8/UtS5c7pJO6I/AAAAAAAAKRo/aSFfec4uSh4/s1600/slide-image-1.jpg' width='1000'/></a>
      <div class='caption' style='bottom:0'>
         <p>Enter Slide 1 Title Here</p>
      </div>
   </div>
   <!-- slide 1 code end -->
   
   <!-- slide 2 code start -->
   <div class='slide'>
      <a href='ENTER-SLIDE-2-LINK-HERE'><img height='490' src='http://4.bp.blogspot.com/-CjlT3qX36fg/UtS5gb1kh-I/AAAAAAAAKR0/RkR1Myx7AN8/s1600/slide-image-2.jpg' width='1000'/></a>
      <div class='caption' style='bottom:0'>
         <p>Enter Slide 2 Title Here</p>
      </div>
   </div>
   <!-- slide 2 code end -->
   
   <!-- slide 3 code start -->
   <div class='slide'>
      <a href='ENTER-SLIDE-3-LINK-HERE'><img height='490' src='http://2.bp.blogspot.com/-QzwsaHw58oI/UtS5gj8mxXI/AAAAAAAAKR4/uSK6FOKa0zo/s1600/slide-image-3.jpg' width='1000'/></a>
      <div class='caption' style='bottom:0'>
         <p>Enter Slide 3 Title Here</p>
      </div>
   </div>
   <!-- slide 3 code end -->
   
</div>

There are 3 slides in the slider. You can add or remove more slides if you want.

Now replace,
“ENTER-SLIDE-X-LINK-HERE”s with your real slide link,
“Enter Slide X Title Here” with your real slide title,
Slide image URL,
for each slide. (X = 1 or X = 2 or X = 3)

How To Configure Social Buttons

Find this in “Edit HTML”:

<ul id='social'>
   <li><a href='#' id='twitter' title='Twitter'/></li>
   <li><a href='#' id='facebook' title='Facebook'/></li>
   <li><a href='#' id='rss' title='RSS'/></li>
   <li><a href='#' id='youtube' title='Youtube Channel'/></li>
   <li><a href='#' id='googleplus' title='Google+ Profile'/></li>
   <li><a href='#' id='linkedin' title='Linkedin'/></li>
   <li><a href='#' id='pinterest' title='Pinterest'/></li>
   <li><a href='#' id='flickr' title='Flickr Profile'/></li>
</ul>

Add your own social links replacing “#” marks.

Need Help With Setup?

Follow the installation guide or contact us with your template name and blog URL.

Installation guide →Ask a question →

Related Blogger Templates

Browse All Templates

The conversation

14 thoughts on “Hermes Mag Blogger Template”

  1. First I just want to say, thanks for the free template! I just had a quick question (maybe it’s not so quick): How do I make my new header logo be a link back to the home page? I disabled the default text header so it wouldn’t show. Here is the code I’m using to make my logo the header:

    #headerbwrap .wrap {
    width: 1000px;
    height: 700px;
    margin: 0 auto;
    background: url(http://i168.photobucket.com/albums/u178/gerin13/RomanyWolfLogo-1.png) no-repeat scroll center;
    }

    Is this correct or should I place my header in another part of the code? I’m not sure which part of the code I can place my image to be able to create a link back. Any help would be much appreciated! Thanks!

  2. Hello,

    I love this template, thank you!
    In regards to the social media bar, how can I get rid of this? I only have twitter so it seems pointless having all the links.

    Please help 🙂

  3. Hallo,

    I love this template, but the timestamp only shows the time a post was written, not the date. Please help.

    Thank you.

  4. Hi, there's a way to configure the slide to change the images automatcally? Cause I'd like to shows the newest posts on the slide. Thanks!

Leave a Reply

Your email address will not be published. Required fields are marked *

 

This site uses Akismet to reduce spam. Learn how your comment data is processed.