Crown | Documentation [ Yotemplates.com ]

• Header Logo.
• Menu
• 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

1. On Blogger Dashboard Click Template.
2. Click Edit HTML.
3. Press Crtl+F.
4. And search 'Menu bar'
5. And find This Code:
   
   

3. About Author

1. On Blogger Dashboard Click Layout.
2. Click Add a Gadget.
3. Choose HTML/Javascript.
4. Add the following Code:




<div class="textwidget">
<p style="text-align: center;">
<a href="http://marmalade.pryanik.co/wp-content/uploads/2015/05/about_us.jpg">
<!--Change Image Url Here-->
<img class="alignnone size-medium wp-image-345" src="http://marmalade.pryanik.co/wp-content/uploads/2015/05/about_us-300x225.jpg" alt="about_us" width="300" height="225" /></a>
</p>
<!-- Change Name here -->
<h4 style="text-align: center;">Angella Mark Wilson</h4>

<!-- Add Description About Yourself-->

<p style="text-align: center;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ut dapibus risus. Nunc suscipit convallis rutrum. Cras libero neque, venenatis quis felis.</p>
<p style="text-align: center;"><a target="blanc" href="#" class="btn btn-hover btn-default ">Read More</a></p>
</div>

Now all You Have to do is, Change the Image URLs with Your Desired Image URLs, And Social Links URLs (href=#) with Your Social Sites links

If You Are Still Facing some Problems, Fill Free to ask for the assistance.

4. Popular Post Carousel

1. On Blogger Dashboard Click Layout.
2. Click Add a Gadget.
3. Choose HTML/Javascript.
4. 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.

1. On Blogger Dashboard Click Layout.
2. Click Add a Gadget.
3. Choose HTML/Javascript.
4. 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

1. On Blogger Dashboard Click Layout.
2. Click Add a Gadget.
3. Choose HTML/Javascript.
4. 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.

1. On Blogger Dashboard Click Layout.
2. Click Add a Gadget.
3. Choose HTML/Javascript.
4. 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.

1. On Blogger Dashboard Click Layout.
2. Click Add a Gadget.
3. Choose HTML/Javascript.
4. 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.

1. On Blogger Dashboard Click Layout.
2. Click Add a Gadget.
3. Choose HTML/Javascript.
4. 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.

1. On Blogger Dashboard Click Layout.
2. Click Add a Gadget.
3. Choose HTML/Javascript.
4. 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.

5. Social Icons

     <!-- Edit Your Top Social Icons Here, You just have to change URl with "#" -->
  

<div class='topicon pull-right four'><ul class='sn'><li><a class='fa fa-dribbble' href='#'/></li>
<li><a class='fa fa-facebook' href='#'/></li>

<li><a class='fa fa-instagram' href='#'/></li>
<li><a class='fa fa-pinterest' href='#'/></li>
<li><a class='fa fa-skype' href='#'/></li>

</ul>

6. Grid Gallery

1. On Blogger Dashboard Click layout.
2. And Follow the instructions given the below:

6. Sidebar Socials

1. On Blogger Dashboard Click layout.
2. And Follow the instructions given the below:

    <!Edit Your Social Icons here, You Just have to Change URLs with "#", In case You Want to Change Social icon, Just rename the li-->


<ul class="follow-soc"><li><a class="fa fa-dribbble" href="#"></a></li>
<li><a class="fa fa-facebook" href="#"></a></li>
<li><a class="fa fa-instagram" href="#"></a></li>
<li><a class="fa fa-pinterest" href="#"></a></li>
<li><a class="fa fa-twitter" href="#"></a></li>
</ul>

<!--Still Facing Problem??, Contact Us for help-->

#	Change social links with your links.

Footer Social Links

you have to edit the social links manually.

Demo Slider

1. On Blogger Dashbord Click Template.
2. Click Edit HTML.
3. 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>

4. just replace the # with your social url Save template.
5. 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

Go to jetseotools for to Generate Meta tegs, SEO Analysis, View Your Traffic And Many More Cool Features And Services

Click Here to Visit JET SEO TOOLS