Documentation : MetroMag Blogger Template

Hello, Welcome to the documentaion regarding "MetroMag Blogger Template". MetroMag Blogger Template is itself a unique creation and crafted by many experts to deliver a somthing unique. The template has itself a unique grid and simple layout to satisfy your need. The colors in the templates are selected from the various combinations to give you nice asthetics. The template is designed on the basis of kepping all the needs for the user from their inspiration to their revenue. The template is the perfect balance between the SEO and the asthetics. The template takes much less time load.

In this documentaion file you will be guided to easily setup the template on your blog. This documentation will guide you through each necessary thing while installing the template.

The package you have get includes the following files.

In this section we will look on the basic steps for our blog. We are going to intsall it through each of the useful aspect. Before begaining the setup you can make a backup copy of your content.

Your Blogger blog comes with a default template. An official template is awesome but of course not enough features for a profession website, and some time you will need to install a custom Blogger template.

Before We show you some ways to install a customer Blogger template, you must know how to access Blogger Template tab.

First, log into Blogger and from click onto the dropdown option at right top and click on a blog name that you want to install template.

After going to the main dashbord of the selected blog go to its template section from the right sidebar.

In Template tab, click on [Backup / Restore] button.

When the dialog showed, click browse and select the template file "MetroMag [Grid] Blogger Template v1.0.xml" or " MetroMag [Simple] blogger template v1.0.xml" located in the template section of package (See file structure). After selecting the file click on the Upload button just below the brows button.

It will take some time to install the template. And the new preview will also be shown in the preview box.

Some time you can get error when install a template, but dont worry, most of cases that is only wrong error report of Blogger.

If you are using a custom Blogger template, you must enable responsive mode to make your site working well with mobile / tablet devices. To do that, just follow below steps:

Login to your blog dashboard and choose Template. In Template page, click "Gear" button.

In the prompt box select " No. Show desktop template on mobile devices", and click on save.

And now you have totally setup the template for the mobile versions also.

Your blog will be better if it has a logo. That will make your brand in visitor mind. To upload logo for Blogger / Blogspot Website, just follow below steps:

Login to your dashboard and choose Layout. In layout section there will be area named "Header" containing the single widget. Click on the edit link of the header widget.

After clicking on the edit button a prompt will be open having the title of "Configure Header". In the window, opt in From your computer. option and click Choose File button to upload your logo image. After that, opt in Instead of title and description option and then click Save.

Now you have successfully setup your logo for the blog.

Favicon is a small logo that will be shown on tabs of browsers to help users can realize your site tab. To upload favicon for Blogger Blogspot website, just follow below steps:

Login to your dashboard, and choose Layout. In Layout page, you will see "Favicon" widget at the top left corner of layout. Click Edit link on it.

In Configure Favicon window, click Choose File button to upload your favicon image and then click Save.

And here you have succesfully setup the favicon icon for your blog.

Note: For uploading favicon you need to have the icon file with extension of *.ico and it must be of square size. Otherwise blogger will throw a error.

If we show the all posts on a page it will be trouble some if you have more then 100+ posts, as it will slow down the blog. So you need to define the post count to be shown on each page of blog. To setup the post count just follow the following steps:

Login to your dashboard, and choose Settings.In Settings you will see "Posts comments and sharing" option just below the settings options select it.

In the "Posts comments and sharing" tab, there is a "post" part having the setting of "show at most". In this setup the numbers of posts you want to show on each page.

After setiing up the count just save the settings by clicking on the "save settings" button.

To setup the navigation menu for your blog just follow the following steps:

First go to the layout section and from the "navigation menu widget" click on the edit button.

This will open a popup box. In the popup box you can enter the following code. You can customize the code. For customization simply edit the text inside the <a> tag, and set their destination by simply changing the javascript:void(0) with your destination link.

<ul> <li><a href='/'>Home</a></li> <li><a href='javascript:void(0);'>Submenu</a> <ul> <li><a href='javascript:void(0);'>item 1</a></li> <li><a href='javascript:void(0);'>item 2</a></li> <li><a href='javascript:void(0);'>item 3</a></li> <li><a href='javascript:void(0);'>item 4</a></li> <li><a href='javascript:void(0);'>item 5</a></li> </ul> </li> <li><a href='javascript:void(0);'>Typography</a></li> <li><a href='javascript:void(0);'>Static Page</a></li> <li><a href='javascript:void(0);'>Submenu</a> <ul> <li><a href='javascript:void(0);'>item 1</a></li> <li><a href='javascript:void(0);'>item 2</a></li> <li><a href='javascript:void(0);'>item 3</a></li> </ul> </li> <li><a href='/404/'>Error Page</a></li> </ul>

As above code shows the <ul> shows the submenu (Drop Down menu) which is wrapped in the <li> tag. Now place the code in the big area of the popup box.

Save the widget. Now after visiting the blog your navigation menu is setup perfectly.