# Beauty Blogger Template

# The Main Features Of SmartBlog

- Nice and Clean Design
- Responsive Theme Layout
- Elegant look
- SEO Optimized
- Unique Widgets
- Fast loading Theme
- Responsive Navigation Menu
- Page navigation Widget
- And Much More....

# Navigation

1. Go to Blogger Dashboard >> Layout >> Main Menu >> click on edit button

Normal Link:- Test Sub Link:- _Test

2. Click On Save.

# Instagram Widget

1. Go to Blogger.com > Your Blog > Template > Edit HTML and find the following text:- <!-- Instagram Widget -->

2. Now Change The User ID And The Access Token.

To Generate Access Token for instagram widget to work Go to this url-> http://instagram.pixelunion.net/ Generate access token

Sign In and Follow the steps

Then You'll be given an access token like this 2332485555.1654d0c.55a6e4f951de429f89d5edc21b3c689b

Follow The next step

Add Instagram Access Token:

Add Instagram User ID:

# How to Set Date On Post

Go to Blogger Dashboard > Settings > Language and Formatting > Formatting > Timestamp Format > set it to date instead of time.

Now Click On Save

# About Us Widget

1. Go to Blogger Dashboard > Layout > About 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 And Social Links
4. Save It

    <div class='widget widget_simpleimage widget_beautiful widget_circle_style circle_style4 widget_count_3' id='simpleimage-8' style='opacity: 1;'>
       <div class='widget_header'/>
       <div class='widget_content' style='height: 235px;'>
          <p class='simple-image'>
    <!-- Image -->
    <img class='attachment-square-big size-square-big' height='640' sizes='(max-width: 960px) 100vw, 960px' src='https://2.bp.blogspot.com/-9D1BPNy0_pM/Vs8l0UPsB2I/AAAAAAAAAss/MTPvZouxziQ/s320/fashion.jpg' width='960'/>
          </p>
       </div>
    </div>

    <!-- Bio -->
    <div class='textwidget' style='font-size: 14px;'><p>We sell creative goods all over the internet. Welcome to our website, we hope you enjoy our products.</p>
    </div>

    <!-- Social Links -->
    <p class='widget_contact_us_widget widget_contact_us_widget_size_small'>
        <a class='fa fa-facebook' href='//www.fb/templateclue' target='_blank' title='Find us on facebook'/>
        <a class='fa fa-twitter' href='#templateclue' target='_blank' title='Find us on twitter'/>
        <a class='fa fa-pinterest' href='#templateclue' target='_blank' title='Find us on pinterest'/>
        <a class='fa fa-tumblr' href='#templateclue' target='_blank' title='Find us on tumblr'/>
        <a class='fa fa-youtube' href='#templateclue' target='_blank' title='Find us on youtube'/>
    </p>

# Add Button

1. In the Post section, click on edit post or create a new post
2. Click on HTML
3. A code is written below use that code to display that Button link

Code For Pink Button

    <a class="btn_tc pink_tc" href="Your Link" target="_blank">Your Text Here</a></div>

Code For Blue Button

    <a class="btn_tc blue_tc" href="Your Link" target="_blank">Your Text Here</a></div>

Code For Red Button

    <a class="btn_tc red_tc" href="Your Link" target="_blank">Your Text Here</a></div>

Code For Green Button

    <a class="btn_tc green_tc" href="Your Link" target="_blank">Your Text Here</a></div>

Code For Black Button

    <a class="btn_tc black_tc" href="Your Link" target="_blank">Your Text Here</a></div>

Code For Yellow Button

    <a class="btn_tc yellow_tc" href="Your Link" target="_blank">Your Text Here</a></div>

4. save your Post and check.

# Blockquote (How To Add)

1. In the Post section, click on edit post or create a new post
2.Now whenever you want to add blockquote style in your blog post just copy that text which you want to appear as a blockquote and hit icon as shown in below screenshot:

4. save your Post and check.

# ShortCodes

1. In the Post section, click on edit post or create a new post
2. Click on HTML
3. A code is written below use that code to display that Different Boxes.

Code For Information Box

    <div class="information post_message_tc">
      <h2>Information</h2>
     <p>This is an 'information message' div. It helps people get to know the site a little better. </p>
    </div>

Code For Announcement Box

    <div class="announcement post_message_tc">
      <h2>Announcement</h2>
     <p>This is an 'announcement message' div! It is loud and proud to say things that you want people to hear first!</p>
    </div>

Code For Success Box

    <div class="success post_message_tc">
      <h2>Success</h2>
     <p>This is a 'success message' div. It is shown if a goal is reached or something is accomplished.</p>
    </div>

Code For Warning Box

    <div class="warning post_message_tc">
      <h2>Warning</h2>
     <p>This is a 'warning message' div. It warns the users that to expect some changes or limitations.</p>
    </div>

Code For Error Box

    <div class="error post_message_tc">
      <h2>Error</h2>
     <p>This is an 'error message' div. It stresses that there is an immediate problem. this should be used sparingly.</p>
    </div>

4. Change The Heading And The Text.

5. save your Post and check.

Thanks For Downloading ❤
Buy A Premium Version.❤
Copyright © 2015. Templateclue