Created: 10/12/2015
Thank you for Downloading my theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my contact page. Thanks so much!
If you have any problem about this template then please visit ThemeXpose.com
Note : Premium and lifetime support only delivered to Full version buyers.
But this is only free version (Free Template Will Contain Non Removable Credits and limited features).
It is forbidden to remove the credit link due to the elimination of the credit links will make your blog to redirect ThemeXpose Official site. For those who want to remove can pay $ 6.95.
Buy our Full Version and get:
1.Remove Footer credits
2.One time payment
3.For Unlimited Domains
4.Lifetime Premium Support
5.No Encrypted Scripts
6.Lifetime Template Updates
7.And Much More....
Buy now from ThemeXpose.com
Blogus is a clean and responsive Blogger template with Responsive layout and suited for all blog. It's design with minimalist and simple color combination, clean and modern look, SEO Optimized, and has been built by using some of the most popular current design trends.
When you are ready to install a theme, you must first upload the theme file. The theme files can be uploaded in two ways:
Now click on "Browse" and select from your drive Blogus-Blogger-Template.xml
After click on "Upload" and wait to finish upload.
Or click on "Edit HTML"
And open .xml file by Notepad and select all "Ctrl+A", and copy entire text and paste it here :
To these phase we will customize the template and install some widgets and add some Html.
In your dashboard Select "Layout".
Upload Your Logo Header : In You Blog (Header), Click on "Edit" and applicate all settings below :
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='nav' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement'>
<div class='conty'>
<ul class='nav menubar2' id='menu-main'>
<li>
<a class='active' href='/' itemprop='url'>
<span itemprop='name'> Home</span>
</a>
</li>
<li>
<a href='#'>
<span> Business</span>
</a>
<ul>
<li>
<a href='#' itemprop='url'>
<span itemprop='name'>Fashion</span>
</a>
</li>
<li>
<a href='#' itemprop='url'>
<span itemprop='name'>Fashion1</span>
</a>
</li>
<li>
<a href='#' itemprop='url'>
<span itemprop='name'>Fashion2</span>
</a>
</li>
</ul>
</li>
<li>
<a href='#'>
<span>Fashion</span>
</a>
<ul>
<li>
<a href='#' itemprop='url'>
<span itemprop='name'>Sub Menu 1</span>
</a>
</li>
<li>
<a href='#' itemprop='url'>
<span itemprop='name'>Sub Menu 2</span>
</a>
</li>
<li>
<a href='#' itemprop='url'>
<span itemprop='name'>Sub Menu 3</span>
</a>
</li>
</ul>
</li>
<li>
<a href='#' itemprop='url'>
<span itemprop='name'> Sports</span>
</a>
</li>
<li>
<a href='#' itemprop='url'>
<span itemprop='name'> Games</span>
</a>
</li>
<li>
<a href='#' itemprop='url'>
<span itemprop='name'> Download This Template</span>
</a>
</li>
</ul>
</div>
</nav>
Go to Blogger Dashboard > Template > "Edit HTML"
Now Search the below mention code ( ctrl + f ), then replace the perpage=6;(Post Per page) and numpages=3;( No. of pages in page navigation)
<script type='text/javascript'>
var pageNaviConf = {
perPage: 6,
numPages: 3,
firstText: "First",
lastText: "Last",
nextText: "Next",
prevText: "Prev"
}
</script>
Go to Blogger Dashboard > Settings > Language and Formatting > Formatting > Timestamp Format > set it to date instead of time
Save it
How to Setup The Featured Image gallery section
To Setup Slider section you need to add "featured" Tag/Label into your Blogger Post.
Note : only use "featured" not "Featured".Its Case sensitive.
Example :
But you need to make sure few things :
1. Your Blog Must be public from settings
2. Your Blog Feed Set to be full from settings -> other -> blog feed.
3. Your blog post has at least One label in you latest (5) posts.
1. Go to Blogger Dashboard > Layout > About me widget > click on edit button > Edit Html
2. Now copy the below mention code and paste into widget.
3. Change the image url with author image url, description
4. Save It
<div class="about-widget">
<div class="about-widget-img">
<img alt="" src="http://wp.wwwebinvader.com/Yeah/wp-content/uploads/2015/10/girl-732319_1920-400x400.jpg" width="400" height="400" />
</div>
<h4>Alise Winslow</h4>
<p>
Ut id nisl quis enim dignissim sagittis. Etiam sollicitudin, ipsum eu pulvinar rutrum, tellus ipsum laoreet.
</p>
<div class="about-widget-social">
<a href="https://www.facebook.com/" target="_blank">
<i class="fa fa-facebook"></i>
<span>Facebook</span>
</a>
<a href="https://twitter.com/" target="_blank">
<i class="fa fa-twitter"></i>
<span>Twitter</span>
</a>
<a href="https://instagram.com/" target="_blank">
<i class="fa fa-instagram"></i>
<span>Instagram</span>
</a>
<a href="https://plus.google.com/" target="_blank">
<i class="fa fa-google-plus"></i>
<span>Google Plus</span>
</a>
<a href="https://vk.com/" target="_blank">
<i class="fa fa-vk"></i>
<span>Vkontakte</span>
</a>
</div>
</div>
Add your social media name and link >> ADD LINK >> Once you added all the links SAVE.
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
You Can See that header area have Social Icons Collection. To Edit Social Icon in this theme you can follow this step:
1. Go to -> Blogger Dashboard- >layout -> top social- > press edit button.
2. NOw copy and paste of below mention code, replace the "#" with your link to your social network accounts.
<div class='clearfix' id='footer-socials'>
<div class='containz'>
<div class='col-md-6 col-sm-12 socialicons'>
<h3>Stay contected with us</h3>
<ul class='clearfix'>
<li>
<a class='fa fa-rss tooltipstered' href='#' target='_blank'/>
</li>
<li>
<a class='fa fa-facebook tooltipstered' href='#' target='_blank'/>
</li>
<li>
<a class='fa fa-twitter tooltipstered' href='#' target='_blank'/>
</li>
<li>
<a class='fa fa-youtube-play tooltipstered' href='#' target='_blank'/>
</li>
<li>
<a class='fa fa-google-plus tooltipstered' href='#' target='_blank'/>
</li>
<li>
<a class='fa fa-dribbble tooltipstered' href='#' target='_blank'/>
</li>
</ul>
</div>
1. Go to -> Blogger Dashboard- >layout -> Subscribe- > press edit button.
Copy paste the below mention code and save it <div class='col-md-6 col-sm-12 ftnewsletter'>
<h3>Subscribe to our newsletter</h3>
<div class='widget_wysija_cont shortcode_wysija'>
<div class='wysija-msg ajax' id='msg-form-wysija-shortcode566351c69f875-1'/>
<form action='http://feedburner.google.com/fb/a/mailverify' class='widget_wysija shortcode_wysija' method='post' onsubmit='window.open("http://feedburner.google.com/fb/a/mailverify?uri=feedburner_id", "popupwindow", "scrollbars=yes,width=550,height=520"); return true' target='popupwindow'>
<p class='wysija-paragraph'>
<input class='wysija-input validate[required,custom[email]]' name='email' placeholder='Email' title='Email' type='text' value=''/>
</p>
<input class='wysija-submit wysija-submit-field' type='submit' value='Subscribe!'/>
<input name='uri' type='hidden' value='feedburner_id"'/>
<input name='loc' type='hidden' value='en_US'/>
</form>
</div>
4. Change '
/*----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>
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 default, Blogger will use its own template for you 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.
In Choose mobile template window, check "No. Show desktop template on mobile devices." option, then click Save button.
Check out these Free SEO tool service and get more traffic on your website - click here
