General Setting Blogger Template from Main-Blogger.Com

When you download Axorys Blogger template or Oslanis Blogger template, you will see a documentation of How to Setting The Template. The documentation are General Setting (upload template, template designer, add logo blog, setting meta tags, etc) and features/widget setting.

This post is about General setting our template. It's a basic setting. Basically, this is not only for templates from us but for other too but please read carefully. Maybe you found a different setting with others.

Install Template

---

Before install template, recommended to backup your template. Basically, we can use 2 methods to install the template.

1. Upload Blogger Template

• Go to your dashboard blog
• Click Template
• Click Backup / Restore
  
• You will see a pop-up dialog. Find the template file, click Upload

2. Copy And Paste Code Template

• Go to your dashboard blog
• Click Template
• Click Edit HTML
  
• Open the template file with NotePad++, Sublime Text, WordPad, Text Editor, etc*
• Copy all codes and paste into field code
• Click Save Template

Note :

• NotePad++ : http://notepad-plus-plus.org
• SublimeText : http://www.sublimetext.com/

General Setting

---

Table of content General setting :

1. Template Designer
2. Add logo blog
3. Add favicon
4. Setting mobile template
5. Setting meta tags for Search Description
6. Setting Opengraph Metadata
7. Setting time stamp
8. Setting error page / 404 page
9. Setting share button
10. Setting profile

1. Template Designer

Axorys Blogger template support Template Designer for background color and background image.

• Go to your dashboard blog
• Click Template > Customise
  
  
  Note :
  

  • Usually, our Blogger template support Template Designer for background image and background color. Additional variables supported Template Designer, in a post.
  • If you want to change background image, click Background menu.
  • If you want to change background color and others (if available), click Advanced menu.
• Click Apply to Blog after finished the editing

2. Logo Blog

To add a logo blog, follow these steps :

• Go to your dashboard blog
• Click Layout
• Click "Edit" on Header widget
• Upload your logo
• Save

Note :
Basically, logo blog is auto resize.

3. Favicon

To add a favicon, follow these steps :

• Go to your dashboard blog
• Click Layout
• Click "Edit" on Favicon widget
• Upload your favicon
• Save

4. Setting Mobile Template

To setting mobile template, follow these steps :

• Go to your dashboard blog
• Click Template
• Click in Gear icon
  
• Choose No. Show desktop template on mobile devices.
  
• Save

Note :
Except Premium version and Axorys Blogger template, we dont set a Custom mobile template. Any changes about this setting, in a post.

5. Setting Meta Tags For Search Description

This setting for search engine result description.

• Go to your dashboard blog
• Click Setting > Site preferences
• In Meta tags > Description > click Edit > choose Yes
• Put a short description about your blog
  
• Save

After activated, you will see a Search Description in post section. You can add a short description of your post. For old post without Search Description, you can edit one by one but if want not, do not worry. Please check in setting no 6 (Setting Opengraph Metadata).

6. Setting Opengraph Metadata

Basically, according setting no 5 above, we already add a meta description. But maybe we need additional code for OpenGraph metadata. OpenGraph metadata is a code to control a content object in a social graph. We do not add this code in template. This is optional code. If you want to add it, follow these steps :

• Go to your dashboard blog
• Click Template > Edit HTML and find this code <b:skin><![CDATA[/*
• Copy and paste this code below before that code :
  

  <!-- OPENGRAPH METADATA -->
  <meta expr:content='data:blog.canonicalUrl' property='og:url'/>
  <b:if cond='data:blog.pageType == &quot;item&quot;'>
  <meta content='article' property='og:type'/>
  <meta expr:content='data:blog.pageName' property='og:title'/>
      <b:else/>
  <meta content='Blog' property='og:type'/>
  <meta expr:content='data:blog.title' property='og:title'/>
  </b:if>
  <meta expr:content='data:blog.title' property='og:site_name'/>
  <b:if cond='data:blog.postImageUrl'>
  <meta expr:content='data:blog.postImageUrl' itemprop='image'/>
  <meta expr:content='data:blog.postImageUrl' property='og:image'/>
  <meta expr:content='data:blog.postImageUrl' name='twitter:image'/>
      <b:else/>
  <meta content='DEFAULT_IMAGE_HERE' itemprop='image'/>
  <meta content='DEFAULT_IMAGE_HERE' property='og:image'/>
  <meta content='DEFAULT_IMAGE_HERE' name='twitter:image'/>
  </b:if>
  <b:if cond='data:blog.metaDescription'>
  <meta expr:content='data:blog.metaDescription' name='description'/>
  <meta expr:content='data:blog.metaDescription' property='og:description'/>
      <meta expr:content='data:blog.metaDescription' name='twitter:description'/>
      <b:else/>
  <meta content='DEFAULT_SHORT_DESCRIPTION_HERE' name='description'/>
  <meta content='DEFAULT_SHORT_DESCRIPTION_HERE' property='og:description'/>
  <meta content='DEFAULT_SHORT_DESCRIPTION_HERE' name='twitter:description'/>
  </b:if>
  <meta content='summary' name='twitter:card'/>
  <meta content='@TWITTER_ACCOUNT' name='twitter:site'/>
  <meta content='@TWITTER_ACCOUNT' name='twitter:creator'/>
  <meta expr:content='data:blog.canonicalUrl' name='twitter:url'/>
  <meta content='YOUR_URL_BLOG' name='twitter:domain'/>

  Note :
  

  • YOUR_URL_BLOG : Address your blog
  • DEFAULT_IMAGE_HERE : URL image as default image if your post doesn't have an image
  • DEFAULT_SHORT_DESCRIPTION_HERE : Default short description for default description
  • @TWITTER_ACCOUNT : Twitter account
• Save

7. Setting Time Stamp

This setting for timestamp. To get a best result (no error at Google Snippet), make sure format time stamp like image below.

Note :
If support custom date header/time stamp, i will add in a post.

8. Setting Error Page

This setting for post that has been removed.

• Go to your dashboard blog
• Click Setting > Site preferences
• In Errors and redirections > Custom Page Not Found > click Edit
• Put a short description, search code, or image for error page
  
  You can add a text, image ,or search form code at there. If you want to add a search form code, copy and paste this code below :
  

  <h3>No content here</h3>
  Back to <a href='/'>Home</a> or try to search
  <form action='/search' class='searchform' method='get'>
  <input id='s' name='q' onblur='if (this.value == "") {this.value = "Search";}' onfocus='if (this.value == "Search") {this.value = ""}' type='text' value='Search'/>
  <button class='searchsubmit'><i class='fa fa-search'></i></button>
  </form>

9. Setting Share Button

Except Axorys Blogger template, we will use default share button. To activate, go to Layout > click 'Edit' on Blog Post gadget.

Checklist Show Share Buttons, then click Save.

Note :
If the template support custom share button, we will add in a post.

10. Setting Profile

We also use a default profile. To activate, go to Layout > click 'Edit' on Blog Post gadget.

Checklist Show Author Profile below post, then click Save.

Note :
If the template support custom author profile box, we will add in a post.

That's it general setting Blogger template from Main-Blogger.com. Setting for features such as recent posts, recent comments, custom search form, banner ads 125*125px, or featured posts, posted in a post itself.