Travel is my dream

Spa changes everything

Capture the moment




Summery


  1. Installing Template
  2. Setting up custom layout
  3. Setting up custom color combination
  4. Customized Header Style
  5. Setting Top Navigation Menu
  6. Setting Top Social Icons & Author Links
  7. Navigation Menu & Mega Menu
  8. Featured Post Widget
  9. Customized Widgets
  10. Customized Post Layout
  11. Page Navigation Type
  12. Author Description
  13. Uploading Custom Logo

1. Installing Template


  1. Extract the obtained zip file and look for Kitsune Blogger Template.xml
  2. Go to your blogger dashboard and inside the template tab click on Backup/Restore option located at top right corner.

  3. Now click on the browse button and select the extracted template file,Kitsune Blogger Template.xml.
  4. Now click on the upload button.

  5. After installing click on the "gear icon" in the theme section and select "No. Show desktop theme on mobile devices. " and click on save.

2. Custom Layout


  1. Kitsune Theme comes with various page layout option. To Setup the layout you wan't Login to Blogger account and go to template tab.
  2. Now click on the customize option.
  3. Now for the left sidebar area go to the layout tab.
  4. Now select the layout you want for content as well as footer.
  5. Now click on Apply to blog button at top right corner.

3. Custom Color Combinations


  1. Kitsune Theme comes with the custom color option to setup Login to Blogger account and go to template tab.
  2. Now click on the customize option.
  3. Now for the left sidebar area go to the Advanced tab.
  4. Inside the kitsune theme options you can select your own color combinations.
  5. Now click on Apply to blog button at top right corner.

4. Customized Header Style


  1. Kitsune Theme comes with 5 diffrent header options as shown below in the table.
    HeaderName
    regular
    full-logo
    center-full
    compact
    modern
  2. Now go to blogger layout tab and look for the Header Layout Widget and click on edit.
  3. In the content area type the name of header you want and click on save and also save the layout.

5. Setting Top Navigation Menu


  1. Login to your blogger account and go to "Layout" tab.
  2. In the layout tab, look for the "Top Left Navigation" widget and click on "Edit".
  3. In the input for "New site name" type the name of your link.
  4. In the input for "New site url" type the location of your link.
  5. Click on "add link" button as show in in image.
  6. Arrange the links as per your need by the up-down arrows. Click on save button.

6. Setting Top Social Icons & Author Links


  1. Login to your blogger account and go to "Layout" tab.
  2. In the layout tab, look for the "Top Social Icons" and "Author Social Links" widget and click on "Edit".
  3. Now in another window open http://fontawesome.io/icons/ and search for the social media icon you want and click on it.
  4. In the new window copy the code shown in the image below.
  5. Now go back to the window open earlier by clicking on edit button. In the input for "New site name" place the code we just copied.
  6. In the input for the "New site url" place the location/profile url for the respected icon and click on Add Link.
  7. Arrange the links as per your need by the up-down arrows. Click on save button.

  1. Login to your blogger account and go to "Layout" tab.
  2. In the layout tab, look for the "Navigation Menu" widget and click on "Edit".
  3. In the text input of new site name enter your Link name.
  4. In the text input for new site url, provide your link url.
  5. Now click on the add link button.

  6. For the SubMenu add "_" (One underscore) before the name of the link. For the Sub Sub menu add "__" (Double underscore) before the name of link.
  7. For setting up the Mega Menu in the input for new site name insert the label name for which you want to show the mega menu and in the input for url add "[Mega Menu]" as shown in image below.
  8. Click on the save button and save arrangement button.

8. Featured Post Widget


  1. Kitsune theme comes with inbuilt featured post widget with 3 diffrent layouts as shown in the table below.
    Widget LayoutCode
    <object class="kitsune_widget" data-label="YOUR LABEL NAME" data-type="grid-1"></object>
    <object class="kitsune_widget" data-label="YOUR LABEL NAME" data-type="grid-2"></object>
    <object class="kitsune_widget" data-label="YOUR LABEL NAME" data-type="grid-3"></object>
  2. To setup go to the layout tab and look for the "Fetured Widget" and click on edit.
  3. Now copy the code next to layout and change the green text with your label name.

    The name of labels are in case sensitive. Make sure the capitals of the labels.

  4. Paste the edited code in the content area of the Featured Widget and save the widget.

9. Customized Widget


  1. Kitsune theme comes with inbuilt 3 diffrent customized widgets as shown in the table below.
    Widget LayoutCode
    <object class="kitsune-plugin" data-label="YOUR LABEL NAME" data-type="block-widget"></object>
    <object class="kitsune-plugin" data-label="YOUR LABEL NAME" data-type="grid-widget"></object>
    <object class="kitsune-plugin" data-label="YOUR LABEL NAME" data-type="list-widget"></object>
  2. To setup go to the layout tab and in the section of "Customized Widgets" add the new "HTML/JavaScript Widget".
  3. Now copy the code next to layout and change the green text with your label name.

    The name of labels are in case sensitive. Make sure the capitals of the labels.

  4. Paste the edited code in the content area of the HTML Widget and save the widget.

10. Customized Post Layout


  1. Kitsune theme comes with inbuilt 3 diffrent post layouts as shown in the table below.
    Widget LayoutCode
    default
    big-post
    grid-post
  2. To setup go to the layout tab and in the "Post Layout" widget and click on edit button.
  3. Now copy the code for the post type and paste in the content area.
  4. click on save the widget and also save the layout.

11. Page Navigation Type


  1. Kitsune theme comes with inbuilt 3 diffrent navigation types as shown in the table below.
    Navigation TypeCode
    arrow
    number
    infinite
  2. To setup go to the layout tab and in the "Pagination Type" widget and click on edit button.
  3. Now copy the code for the post type and paste in the content area.
  4. click on save the widget and also save the layout.

12. Author Description


  1. To setup author description go to layout tab and look for "About Author Description" widget and click on edit button.
  2. Now enter the description you want to show in content area.
  3. click on save the widget and also save the layout.

13. Uploading Custom Logo


  1. To setup Custom Logo go to layout tab and look for "Header" widget and click on edit button.
  2. Now upload the image and select your suitable options about the logo alignment.
  3. click on save the widget and also save the layout.

2 comments: