10/20/2018

2016 Responsive Blogger Template 2019 Free Download Blogger Templates Responsive Blogger Template

2016 Responsive Blogger
2016 Responsive Blogger Template 2019
Author:- Themexpose
Designer:- Themexpose
2016 Responsive Blogger Template 2019 feature
2016 Responsive Blogger Template 2019 best for fashion, tech, the lifestyle website. Responsive, SEO, Dynamic Heading, 2 Column Style, Clean Typography, Minimalist, Homepage Share Button, Responsive Dropdown Navigation, Light Base Theme Color, Breadcrumbs, Related Posts with Thumb, Search Box, Social Share Button, Numbered Page Navigation, Custom 404 Page, Smooth Scroll Back To Top, Custom Subscribe Box Widget, Multi-Author Box.
2016 Responsive Blogger Template 2019 Documentation

1.Installation
When you are ready to install a theme, you must first upload the theme file. The theme files can be uploaded in two ways:

  • Blogger Upload: Go to your dashboard > Template > Backup / Restore > Upload the .xml.
  • Copy And Paste: By open your template by Notepad and copy the entire text and paste it into Template in your dashboard.
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation

Now click on "Browse" and select from your drive 2016-Blogger-Template.xml
After click on "Upload" and wait to finish the upload.
Or click on "Edit HTML"
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation

And open .xml file by Notepad and select all "Ctrl+A", and copy entire text and paste it here :
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation

1.Logo Settings :
In your dashboard Select "Layout".
Upload Your Logo Header: In You Blog (Header), Click on "Edit" and applicate all settings below :
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation

2.Settings Your Blog Posts :
In Blog Posts, Click on "Edit" and applicate all settings below :
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation

2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation
3.Navigation
Go to Blogger Dashboard > Template > "Edit HTML"
Now Search the below mention code ( ctrl + f ), then replace the # with your navigation urls.

  • Main Navigation

<nav id='menu'>
<ul class='sf-menu superfish' id='nav'>
<li><a href=''>Home</a>
</li>
<li class='menu-item-has-children'><a href=''>About</a>
<ul class='sub-menu'>
<li><a href=''>Category</a></li>
<li><a href=''>Category</a></li>
<li><a href=''>Category</a></li>
<li><a href=''>Category</a></li>
<li><a href=''>Category</a></li>
</ul>
</li>
<li class='menu-item'><a href=''>Contact</a></li>
<li class='menu-item-has-children'><a href=''>Shop</a></li>
<li class='menu-item-has-children'><a href=''>Advertise</a></li>
</ul>
</nav>


  • Page Navigation 
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation


Go to Blogger Dashboard > Template > "Edit HTML"
Now Search the below mention code ( ctrl + f ), then replace the perpage=7;(Post Per page) and numpages=7;( No. of pages in page navigation)
<script type='text/javascript'>
var pageNaviConf = {
perPage: 7,
numPages: 7,
firstText: "",
lastText: "",
nextText: "Next",
prevText: "Previous"
}
</script>

4.Post Page
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation
Go to Blogger Dashboard > Settings > Language and Formatting > Formatting > Timestamp Format > set it to date instead of time
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation
5.Widget

  • About Me
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation

  • Go to Blogger Dashboard > Layout > About me widget > click on the edit button
  • Now copy the below mention code and paste into the widget.
  • Change the image URL with author image URL, description, # with social URL
  • Save It

<div class="author-widget custom-widget clearfix"><br />
<div class="author-cover-background clearfix" style="background-size: cover; background: url('http://1.bp.blogspot.com/-DUHZAs8zw0Q/VoBn9IG3WcI/AAAAAAAAHas/eSwwAvm_1aQ/s1600/cvr-back.jpg');"><br />
<div class="author-avatar clearfix"><br />
<img alt="" class="img-circle" height="80" src="http://3.bp.blogspot.com/-QrjcLlVhqcg/VoBn9PjyswI/AAAAAAAAHao/qci7Zu7jGXo/s1600/avatar.jpg" width="80" / /><br />
</div><br />
</div><br />
<div class="author-info pos-center clearfix"><br />
<h2><a href="#">John Doe</a></h2>
<br /> <p>Curabitur blandit tempus porttitor. Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</p>
</div><br /></div>

  • Instagram Widget
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation

Go to Blogger Dashboard > Layout > Instagram widget > click on edit button > Edit Html
Now copy the below mention code and paste into the widget.
<div id='instafeed'/>
<script type='text/javascript'>//<![CDATA[
var feed = new Instafeed({
get: 'user',
userId: 10008029,
limit:16,
sortBy:'random',
accessToken: '1531863919.1677ed0.23d238bc564249e799095d060c750218',
template: '<li><a href="{{link}}" target="_blank"><img src="{{image}}" /><div
class="insta-likes"><div style="display: table; vertical-align: middle; height: 100%; width: 100%;"><span
style="display: table-cell; vertical-align: middle; height: 100%; width: 100%;">{{likes}} <i class="fa fa-
heart"></i><br/>{{comments}} <i class="fa fa-comment"></i></span></div></div></a></li>',
resolution: 'standard_resolution'
});
feed.run();
//]]>
</script></div>


  • Generate Access Token

Sign In and Follow the steps
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation

you need the access token for an Instagram widget to work Go to this url-> http://instagram.pixelunion.net/ Generate access token

Then You'll be given an access token like this 1531863919.1677ed0.23d238bc564249e799095d060c750218

Follow The next step

Add Instagram User ID:

2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation


2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation

  • Sidebar Social widget
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation

To Edit Sidebar Social icons in this theme you can follow these steps:

  1. On the Blogger Dashboard Click Layout
  2. Sidebar Social Widget Click Edit button
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation
Add your social media name and link >> ADD LINK >> Once you added all the links SAVE.
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation
Use http:// or https:// where applicable.

AVAILABLE ICONS: Behance Facebook Twitter Bloglovin Dribbble Flickr GooglePlus Instagram Linkedin Pinterest Vimeo Youtube Vine Soundcloud Goodreads Deviantart Foursquare Reddit Tumblr Spotify Twitch Vk Mailto shop Rss Etsy

6. ShortCodes
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation

/*----success message----*/
<div class="alert-message success">
success message : You successfully read this important message. <i class="fa fa-check-circle"></i>
</div>
/*----Alert message-----*/
<div class="alert-message alert">
Alert message : This alert needs your attention. <i class="fa fa-info-circle"></i>
</div>
/*----Warning message-----*/
<div class="alert-message warning">
Warning message : Warning! Best check yo self. <i class="fa fa-exclamation-triangle"></i>
</div>
/*----Error message-----*/
<div class="alert-message error">
Error message : Oh snap! Change a few things up. <i class="fa fa-exclamation-circle"></i>
</div>

7.Mobile Version ( Responsive Design Option )
After you apply mobile version for this template, Color changing option will not work. This is official bug of Blogger. So, please make sure, you used Color changing option before do this step.
As the default, Blogger will use its own template for your blog on mobile. So if you want to use Fashion template on mobile devices, please enable it first.
Access your Template menu and click on Gear button of Mobile template.
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation
In Choose mobile template window, check "No. Show desktop template on mobile devices." option, then click the Save button.
2016 Blogger Template 2019 Documentation,Blogger Template 2018 Documentation



XEM THÊM

2016 Responsive Blogger Template 2019 Free Download Blogger Templates
4/ 5
Oleh

1 comments:

Tulis comments
avatar
14 May 2019 at 03:26

Thanks for the useful information, give more updates like First time I visit your site really nice, here after a daily visit.
ecommerce website development company in chennai

Reply