You are on page 1of 6

TEMPLATEZY

Documentation
Authorism Responsive Blogger Template

How To Edit Responsive Menu?


To Customize the Top Navigation Menu Follow These
Steps:
Go to blogger dashboard.
Click on template tab and then click on EDIT HTML
button.
Now Using CTRL + F find <!--Top Responsive Menu-->
And then customize the code according to your
need.
Replace all # tags with your own like logo, themes,
tools, inspiration etc.

<!--Top Responsive Menu-->


<nav id='nav-main'>
<ul>
<li><a href='#'>Home</a></li>
<li><a href='#'>About</a></li>
<li><a href='#'>Gallery</a></li>
<li><a href='#'>Tutorials</a></li>
<li><a href='#'>Contact</a></li>
</ul>
</nav>

How To Edit Top Author Slideshow?


To Customize the Top Slideshow Follow These
Steps:
Go to blogger dashboard.
Click on template tab and then click on EDIT HTML
button.
Now Using CTRL + F find <!--Top Author Slideshow-->
And then customize the code according to your
need.
Replace all red links with your own author image, photos.
.
<!--Top Author Slideshow-->
<div class='slideshow'>
<div class='slide active'>
<img alt='' class='horizontal' src='http://1.bp.blogspot.com/vMhNtPXHcPw/VInHMvutSMI/AAAAAAAAD8s/Lzkrgmwz5jU/s1600/Profile-pic-01.png'/>
</div>
<div class='slide'>
<img alt='' class='vertical' src='http://2.bp.blogspot.com/3P3NNiffAOE/VInHVbHvpzI/AAAAAAAAD80/e6YbzjdjGsM/s1600/Profile-pic-02.png'/>
</div>
<div class='slide'>
<img alt='' class='horizontal' src='http://2.bp.blogspot.com/lkirK0J7ReQ/VInHd_0Cv_I/AAAAAAAAD88/0CeTjkktkDg/s1600/Profile-pic-03.png'/>
</div>
<div class='slide last'>
<img alt='' class='vertical' src='http://2.bp.blogspot.com/Zuwj1xHhaaY/VInHlchAl7I/AAAAAAAAD9I/NR_qHuwBfXs/s1600/Profile-pic-04.png'/>
</div>
<div class='templatezy templatezy-shadow'/>
<div class='templatezy templatezy-highlight'/>
</div>
<div class='templatezy-slider'>
</div>
<div class='slideshow-nav'>
<a class='nav-link previous' href='#'/><a class='nav-link next' href='#'/></div>

<div class='slideshow' style='width:100%;border:none;'>


<div class='slide active' style='border: medium none;width: 100%;border-radius:0px;'>
<div class='desc'><h1>Lora Lossy</h1><p>Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
enim incididunt ut labore, nostrud exercitation ullamco laboris.!</p></div>
</div>
<div class='slide' style='border: medium none;width: 100%;border-radius:0px;'>
<div class='desc'><h1>Angela Johny</h1><p>Yorem delly dolor sit amet, consectetur
adipisicing elit, incididunt ut labore incididunt ut labore et dolore magna aliqua.!</p></div>
</div>
<div class='slide' style='border: medium none;width: 100%;border-radius:0px;'>
<div class='desc'><h1>Mark Clerk</h1><p>Woram Losy dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
incididunt ut labore, quis nostrud exercitation ullamco laboris.!</p></div>
</div>
<div class='slide last' style='border: medium none;width: 100%;border-radius:0px;'>
<div class='desc'><h1>Alex Damn</h1><p>Palorm Roelm dolor sit amet, consectetur
adipisicing elit, incididunt ut labore sed do eiusmod tempor et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud exercitation ullamco laboris.!</p></div>
</div>
</div>

How To Edit Top Social Icons?


To Customize the Top Slideshow Follow These
Steps:
Go to blogger dashboard.
Click on template tab and then click on EDIT HTML
button.
Now Using CTRL + F find <!--Social Icons Header-->
And then customize the code according to your
need.
Replace all # tags with your own links, like facebook,
googleplus, twitter and much mores.

<div class='social_icon container' style='visibility: visible; margin-bottom:


21px;'>
<div class='head_social_title'>CONNECT</div>
<ul class='clearfix' style='margin-top: 21px;text-align:center;'>
<li class='fb-icon'><a href='#' style='font-size: 11px; line-height: 13px;
width: 13px; height: 13px;' target='_blank'><span class='fa fa-facebook'
title='Facebook'/></a></li>
<li class='tw-icon'><a href='#' style='font-size: 11px; line-height: 13px;
width: 13px; height: 13px;' target='_blank'><span class='fa fa-twitter'
title='Twitter'/></a></li>
<li class='gplus-icon'><a href='#' style='font-size: 11px; line-height: 13px;
width: 13px; height: 13px;' target='_blank'><span class='fa fa-google-plus'
title='Google Plus'/></a></li>
<li class='pinterest-icon'><a href='#' style='font-size: 11px; line-height:
13px; width: 13px; height: 13px;' target='_blank'><span class='fa fa-pinterest'
title='Pinterest'/></a></li>
<li class='linkedin-icon'><a href='#' style='font-size: 11px; line-height:
13px; width: 13px; height: 13px;' target='_blank'><span class='fa fa-linkedin'
title='Linkedin'/></a></li>
<li class='foursquare-icon'><a href='#' style='font-size: 11px; line-height:
13px; width: 13px; height: 13px;' target='_blank'><span class='fa fa-foursquare'
title='Foursquare'/></a></li>
<li class='flickr-icon'><a href='#' style='font-size: 11px; line-height: 13px;
width: 13px; height: 13px;' target='_blank'><span class='fa fa-flickr'
title='Flickr'/></a></li>
<li class='youtube-icon'><a href='#' style='font-size: 11px; line-height: 13px;
width: 13px; height: 13px;' target='_blank'><span class='fa fa-youtube-play'
title='Youtube'/></a></li>
</ul>
</div>

How To Edit Bottom Author Slider ?


To Customize the Top Slideshow Follow These
Steps:
Go to blogger dashboard.
Click on template tab and then click on EDIT HTML
button.
Now Using CTRL + F find <!--Bottom Author Slider-->
And then customize the code according to your
need.
Replace all red links with your own author image, photos.
Replace all the text h1 to your own and bio texts.
<!--Bottom Author Slider-->

<div class='slideshow'>
<div class='slide active'>
<img alt='' class='horizontal' src='http://4.bp.blogspot.com/a6i0uOxwq8A/VInHxV2LbKI/AAAAAAAAD9M/R2c9BDrH0UQ/s1600/Profile-pic-01.png'/>
</div>
<div class='slide'>
<img alt='' class='vertical' src='http://3.bp.blogspot.com/ZefRKVdrgXA/VInH4d5KxuI/AAAAAAAAD9U/QTN2RvQ3aas/s1600/Profile-pic-02.png'/>
</div>
<div class='slide'>
<img alt='' class='horizontal' src='http://3.bp.blogspot.com/6TYABm2aVYE/VInIAB1T6UI/AAAAAAAAD9c/wI5qqlllrNI/s1600/Profile-Pic-03.png'/>
</div>
<div class='slide last'>
<img alt='' class='vertical' src='http://1.bp.blogspot.com/RsBo3FYbppo/VInIF2OkapI/AAAAAAAAD9k/0Ysw2_xksac/s1600/Profile-Pic-04.png'/>
</div>
<div class='templatezy templatezy-shadow'/>
<div class='templatezy templatezy-highlight'/>
</div>
<div class='templatezy-slider'>
</div>
<div class='slideshow-nav'>
<a class='nav-link previous' href='#'/>
<a class='nav-link next' href='#'/>
</div>
<div class='slideshow' style='width:100%;border:none;'>
<div class='slide active' style='border: medium none;width: 100%;border-radius:0px;'>
<div class='desc'><h1>Bob Olright</h1><p>Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
aliqua.!</p></div>
</div>
<div class='slide' style='border: medium none;width: 100%;border-radius:0px;'>
<div class='desc'><h1>Karen Smith</h1><p>Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
aliqua.!</p></div>
</div>
<div class='slide' style='border: medium none;width: 100%;border-radius:0px;'>
<div class='desc'><h1>Jessica Bankers</h1><p>Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat.!</p></div>
</div>
<div class='slide last' style='border: medium none;width: 100%;border-radius:0px;'>

<div class='desc'><h1>Johny Lora</h1><p>4th one time fitness expert, wellness writer,


personal trainer, group ex health coach. I am advocates of everything good in the fitness
industry and of the people who make it great!</p></div>
</div>
</div>

Need More Help ?


Visit: http://www.templatezy.com
Email at: templatezy.info@gmail.com

Join

Us

Facebook

http://facebook.com/templatezy

GooglePlus

https://plus.google.com/b/templatezy