Nanopress Blogger Template Documentation – Full version

By | September 26, 2016

Nanopress Blogger Template Installation Documentation, a step to step guide to help you out to set up your blog easy way. First of all, Thank you for Downloading our template if you haven’t done yet you can get it from here : Nanopress Blogger Template . You check the live demo through the button below and also Please Read this documentation carefully in order to set up your blog and please note that there’s no support for free users. We also Provide Blogger Template Installation Service. Our Installation service gives you a simple, quick and secure way of getting your template setup without hassle. We have created a service package that gives you everything you need to have your theme and your content setup in no time.

Live Demo Installation service

Blogger Template Installation Steps:-

1. Backup & Uploading

  1. Unzip the Template.zip file.
  2. On Blogger Dashboard Click Template.
  3. Click on Download Full Template to keep your old template.
  4. Click Browse… button. Find where the “olivia-full-version.xml” file location.
  5. Then Click Upload.
  6. Edit mobile Preview. (follow images)

1-768x404

2. Blog Setting

After installing the theme, there are minimum settings to make all widgets work fine in this template.

  1. On Blogger Dashboard Click Settings.
  2. Click Other.
  3. In Site Feed > Allow Blog Feed Choose Full.
  4. Then Click Save settings.

4-768x481

3. Logo Setup

1. In your dashboard Select “Layout”. 2. Upload Your Logo Header : In You Blog (Header), Click on “Edit” and applicate all settings below : 10

4. Navigation Menu

4.1 Main Menu/DropDown

screenshot_1

 

  • On Blogger Dashboard Click Layout.
  • Click Edit on Main Menu Widget.
  • Change it according to your needs. Add name of the link Name and link url then click add Link
  • Click Save.
  • To Add sub menu Item. You have to add “_”(underscore without quotes) before Menu item Link (example :  _Left Sidebar)
  • Change the location of menu item using arrow down and arrow up Icon
  • For More Information- Watch Video Below

6

5. Social Top / Social Footer

Access your blog Layout > click Edit link on Social Top Follow Us (Sidebar)Social Footer widget.
Social Names:   facebook, twitter, gplus, bloglovin, rss, youtube, skype, stumbleupon, tumblr, vine, stack-overflow, linkedin, dribbble, soundcloud, behance, digg, instagram, pinterest, delicious, codepen 

7    Example:  For Example if you have to add “facebook” icon then just add facebook in name of New site name section and below add url of that particular site. social-link-widget

5. Slider/blog_featured_posts

Access your blog Layout > click Add a Gadget > HTML/JavaScript on blog_featured_posts section OR if already there is widget then press edit.

After Clicking “Edit” then you have three options to enter in the content box:

no: If you don’t want the Slider to show on your website, all you have to do is to enter “no” in the content box (take a look at the picture below).

screenshot_3
[recent]: The Slider will show the most recent posts (take a look at the picture below).

screenshot_4
Label name: The Slider will show the most recent posts of this specific label name (Note: keep in mind that label names are case sensitive. So for example “tech” is not the same as “Tech” or “TECH”). Take a look at the picture below:
screenshot_5

 

6. Featured Posts

screenshot_2

Access your blog Layout > click Add a Gadget > HTML/JavaScript on Featured Posts section,and add the desired category/label name.

Example:

11

Now enter single label as shown in the below image. Make sure you have entered the label correctly as Labels are case-sensitive.
12
Enter the label that you’ve used in the posts as shown below:
13

7. Widget

7.1 Follow Us (Sidebar)


1. Go to Blogger Dashboard > Layout > Sidebar – >add widget

2. Now copy the below mention code and paste into widget.

3. Change the social url with numbers of counts

4. Save It

<div class="socials"><a target="_blank" href="https://www.facebook.com/envato" class="social-facebook"><span class="social-count">187,255</span><span class="social-text">Follow us on <strong>Facebook</strong></span></a><a target="_blank" href="https://twitter.com/envato" class="social-twitter"><span class="social-count">60,968</span><span class="social-text">Follow us on <strong>Twitter</strong></span></a><a target="_blank" href="https://www.youtube.com/envato" class="social-subscribe"><span class="social-count">11,695</span><span class="social-text">Subscribe us on <strong>YouTube</strong></span></a>
<div class="clear"></div>
</div>

 7.2 Weather widget

screenshot_6

 

1. Go to Blogger Dashboard > Layout >Top – >weather -> edit

2. Now enter  state , country  into widget.

3. Example: London , united kingdom

4. Save It

 

7.3 Recent Post widget

Access your blog Layout > click Add a Gadget > HTML/JavaScript on Sidebar or Footer section, you must place the following names highlighted in blue below. Now add this code : 3/recentposts you can increase / decrease this value 3 – its defines how many posts. Image Example: 25

 

Same as:

 

1 – Random Posts: 4/randomposts

2 – Widget for specfic label : Number of Results /  Label / Widget Type   Example:  4/Sports/custom-widget

3 – Recent Comments: 3/recentcomments

you can increase or decrease these numbers as number post you want.

 

8.Comments System

Access your blog Layout > click Edit link on Comments system widget.
You can trigger the provisions below.
Only Blogger add: [blogger] and click save!
Only Disqus add: [disqus] and click save!
Only Facebook add: [facebook] and click save!
More:[facebook][disqusss] [blogger][facebook] [facebook][blogger] [disqus][facebook][blogger] [blogger][disqus][facebook] [disqus][blogger][facebook]
NOTE: The display of all is only available in that provision.
NOTE 02: To view the system Disqus comments, you need to follow the steps below.

Disqus Shortname

Access your blog Layout > click Edit link on Disqus Shortname widget.
  • What you have to do is just add the shortname

22

9. Page Layout / No Sidebar / Left Sidebar

To add these options just add the codes below in the composition of the post!

Codes:  [no-sidebar]
               [left-sidebar]

  Image Example:

23

10. Setup date

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

21

 

11. Theme Customization

Access your blog Template > click Customize.Here you can change the background, and apply pre-defined colors
Clicking Advanced You will see the official option to change the Main Color

GCeJQD2

Leave a Reply

Your email address will not be published. Required fields are marked *