Minute Responsive Blogger Template

1. Backup & Uploading

Unzip the Template.zip file.
On Blogger Dashboard Click Template.
Click on Download Full Template to keep your old template.
Click Browse... button. Find where the “Minute-premium.xml” file location.
Then Click Upload.
Edit mobile Preveiw. (follow images).

After installing the theme, there are minimun settings to make all widgets work fine in this template.

2. Blog Feed

On Blogger Dashboard Click Settings.
Click Other.
In Site Feed > Allow Blog Feed Choose Full.
Then Click Save settings.

Now you can Edit the meta tag Keywords of your blog. follow this steps

On Blogger Dashbord Click Template.
Click Edit HTML.
Click Ctrl + F and Search for the following Code:

<meta content='Keywords_Here' name='keywords'/>

Change Keywords_Here with your blog keywords you want to use.
Click Save template.

Header Logo.
Navigation Menu
Featured Slider
Popular Post

1. Setting Main Blog Part

On Blogger Dashboard Click Layout.

Click Edit on Blog Posts Widget.

Change it to look like that image.

Click Save.

2. Navigation Menu

On Blogger Dashboard Click Layout.
Click Add a Gadget.
Choose HTML/Javascript.
Copy the following Code:

<div class="menu-container" id="sticky"> 
                     
                            <div class="sixteen columns"> 
                     
                                <!-- Navigation List --> 
                                <div class="table"> 
                                    <nav id="primary_nav_wrap"><ul class="bt-nav"> 
                                        <li class="submenu-link"><a class="arrow" href="http://grace-bthemez.blogspot.com/">Home</a> 
                                            <!-- Submenu--> 
                                            <ul> 
                                                <li><a href="#">Submenu</a></li>                                            </ul> 
                                        </li>                    <li class="submenu-link"><a class="arrow" href="#">Premium Themes</a> 
                                            <!-- Submenu--> 
                                            <ul> 
                                                <li><a href="#">Default</a></li> 
                                                <li><a href="#">Sidebar</a></li> 
                                                <li><a href="#">Fullscreen Parallax</a></li> 
                                                <li><a href="#">Video Post</a></li> 
                                                <li><a href="#">Gallery Post</a></li> 
                                        </ul> 
                                        </li> 
                                        <li class="submenu-link"><a class="arrow" href="#">Features</a> 
                                            <!-- Submenu--> 
                                            <ul> 
                                                <li><a href="#">Grid</a></li> 
                                                <li><a href="#">Allure Theme</a></li> 
                                                <li><a href="#">Splendid</a></li> 
                                            </ul> 
                                        </li> 
                                        <li><a href="#">About</a></li> 
                                        <li><a href="#">Cooking</a></li> 
                                     
                                        <li><a href="#">Contact</a></li> 
                                    </ul> 
</nav> 
                                </div> 

                            </div> 
                     
                    </div>

Change	Please Change the links according to your need,For links Just replace the # with url and Change the Name of the link

3. Animated Text

Either You can Use it ( Modify it) or Delete animated Header Text
To Modify it Follow the steps Below

To Modify It all you have to do is just change the text, GO to the very last of the template you'll find code something like this.

<script> 
 $(".element").typed({ 
        strings: ["Hey I'm Minute. A Personal Blogger Portfolio and Blog Theme For Awesome Creative Folk Around The World. Handcrafted Responsively By Bthemez"], 
        typeSpeed: 0 
      }); 

</script>

Just Change the text with your text.

You;ll find more information here Click Me

Delete the Animated Header

You can Delete animated header text as well

Go to the template and try to find below code.

Just Delete the Entire Block From animated starts to ends.

5. Footer Widgets

By default Footer Widgets are hidden, but you can enable it easily.

Go to Blogger Dashboard and Template and try to find "#footer" (without quotes). you'll see code something like below

#footer { 
     
position:relative; 
    padding: 20px 0; 
  margin-right: auto; 
  margin-left: auto; 
display:none; 

margin-bottom:30px; 


}

Just change delete the display:none; line

Footer Social
facebook

On Blogger Dashboard Click Template.
Scroll Down in footer section and try to find
try to find "Footer Starts" (without quotes) and then change the social links
Change the # value with your social link

Links Url	Change the # value with your social link

On Blogger Dashboard Click Layout.
Click Add a Gadget.
Choose HTML/Javascript.
Copy the following Code:

<script type="text/javascript">
var nopost = 10;
</script>
<script src="/feeds/posts/default/-/LABEL_NAME?alt=json-in-script&amp;callback=galposts"></script>

LABEL_NAME	Change it with the label name of posts to be shown.
numpostsq	Number of posts to be shown. It must be lower or equal to the number of posts that have the label name.

On Blogger Dashboard Click Layout.
Click Add a Gadget.
Choose HTML/Javascript.
Copy the following Code:

Go to this url Facebook Like Box

Facebook Page Url	Add Your FB Url in box
Color Scheme	Choose light color scheme

On Blogger Dashboard Click Layout.
Click Add a Gadget.
Choose HTML/Javascript.
Copy the following Code:

<script type="text/javascript">
var nopostb = 5;
</script>
<script src="/feeds/posts/default/-/LABEL_NAME?alt=json-in-script&amp;callback=blockposts"></script>

LABEL_NAME	Change it with the label name of posts to be shown.
nopostb	Number of posts to be shown. It must be lower or equal to the number of posts that have the label name.

On Blogger Dashboard Click Layout.
Click Add a Gadget.
Choose HTML/Javascript.
Copy the following Code:

<script type="text/javascript">
var nopostr = 5;
</script>
<script src="/feeds/posts/default?alt=json-in-script&amp;callback=recentposts"></script>

nopostr	Number of posts to be shown. It must be lower or equal to the number of posts in your blog.

On Blogger Dashboard Click Layout.
Click Add a Gadget.
Choose HTML/Javascript.
Copy the following Code:

<div id="random-posts">

<script style="text/javascript">
 var numposts_gal = 4;
</script>

<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showgalleryposts&max-results=99"></script>
</div>

numposts_gal	Number of posts to be shown.

On Blogger Dashboard Click Layout.
Click Add a Gadget.
Choose HTML/Javascript.
Copy the following Code:

<div id="comments-container"></div>
<script>
var cm_config = {
ct_id: "comments-container",
max_result: 5
};
</script>

max_result	Number of recent comments to be shown.

On Blogger Dashboard Click Layout.
Click Add a Gadget.
Choose HTML/Javascript.
Copy the following Code:

<script type="text/javascript">
var numpostso = 4;
var classo = "gallery_widget gallery_widget_posts owl-carousel owl-theme";
var ido = "footer_carousel";
</script>
<script src='/feeds/posts/default/-/slideshow?alt=json-in-script&amp;callback=ocarousel' type='text/javascript'/></script>

slideshow	Add This label name to posts you want them to be shown.
numpostso	Number of posts to be shown. It must be lower or equal to the number of posts that have the label name `slideshow`.

Footer Social Links

you have to edit the social links manually.

Demo Slider

On Blogger Dashbord Click Template.
Click Edit HTML.
Click Ctrl + F and Search for the following Code in the bottom

<ul class='contact-social'> 
<li><a href='#'><i class='fa fa-facebook'/> Facebook</a></li> 
<li><a href='#'><i class='fa fa-twitter'/> Twitter</a></li> 
<li><a href='#'><i class='fa fa-google-plus'/> Google+</a></li> 
<li><a href='#'><i class='fa fa-dribbble'/> Dribbble</a></li> 
<li><a href='#'><i class='fa fa-linkedin'/> Linkedin</a></li> 
<li><a href='#'><i class='fa fa-instagram'/> Instagram</a></li> 
</ul>

just replace the # with your social url Save template.
And delete the whole li which you don't want to use. Save template.

You can change the only color of the template using blogger template designer.

Go to Blogger Dashboard -> Template -> Customize and then advance

Change the color value here and link color can also be change

Minute | Documentation [ Bthemez.com ]