John S

This article contains the configuration details for the John S template. Using these information you can configure your template when you cannot use the Quickstart package. Please remember that some details like the template settings can be imported directly as the JSON file, what is faster than the manual configuration.

Template Settings

IMPORTANT! Remember that you can import/export the template settings using the configuration manager.

File with exported settings for the John template is available here.

1. Advanced
2. Basic
3. Cookielaw
4. Features
5. Fonts
6. Layout
7. Menu
8. Socialapi

Fonts configuration

Body

Type: Google Web Fonts

Value - font-family:

Ubuntu

Value - URL:

http://fonts.googleapis.com/css?family=Ubuntu:400,500,700

Selectors:

h1,h2,h3,h4,h5,h6,
.gkMenu ul li, 
.box.menu,
.breadcrumbs > ul > li,
.itemDate,
.gk-big-btn,
body button, 
.button,
.readon,
input[type="button"],
input[type="submit"],
.gkPriceTable dd.gkPrice,
.gk-header1,
.gk-header2,
.gk-header3,
.gkContactForm address,
.gkNspPM-Portfolio2,
.gkTabsWrap ol li,
.gkSectionNav

---

Headers

Type: Standard fonts

Value:

Arial, Helvetica, sans-serif

Selectors:

body,
html, 
body input, 
body select, 
body textarea,
#gkMainMenu .gkMenu > ul li div.childcontent a

---

Other I - selectors

This font group isn't used.

---

Other II - selectors

This font group isn't used.

---

Available Module Positions

Module positions available in the template.

Available Module Variations

Module variations available in the template.

Module settings

Below you can find list of the module positions available in the John template which contains modules in the demo content configuration:

1. bannertop

   • Module title:

     Banner

     Module position:

     bannertop

     Module suffix:

     -

     Configuration screenshots:

     Module details Module configuration content: view HTML code

2. bottom1

   • Module title:

     Bottom I

     Module position:

     bottom1

     Module suffix:

     -

     Configuration screenshots:

     Module details Module configuration content: view HTML code

   • Module title:

     Bottom II

     Module position:

     bottom1

     Module suffix:

     -

     Configuration screenshots:

     Module details Module configuration content: view HTML code

   • Module title:

     Bottom III

     Module position:

     bottom1

     Module suffix:

     -

     Configuration screenshots:

     Module details Module configuration content: view HTML code

   • Module title:

     Didn't you know?!

     Module position:

     bottom1

     Module suffix:

     big-title icon-color2 dark-bg

     Configuration screenshots:

     Module details Module configuration content: view HTML code

3. bottom2

   • Module title:

     I do my clients

     Module position:

     bottom2

     Module suffix:

     big-title icon-color1

     Configuration screenshots:

     Module details Module configuration content: view HTML code

4. bottom3

   • Module title:

     Suffix "dark-bg"

     Module position:

     bottom3

     Module suffix:

     dark-bg

     Configuration screenshots:

     Module details Module configuration content: view HTML code

   • Module title:

     My[icon-pencil][br]Cozy[br]Blog

     Module position:

     bottom3

     Module suffix:

     big-nav big-title icon-color2 title-right color-bg overlay-1x1

     Configuration screenshots:

     Module details Module configuration

5. bottom4

   • Module title:

     Suffix "color-bg"

     Module position:

     bottom4

     Module suffix:

     color-bg

     Configuration screenshots:

     Module details Module configuration content: view HTML code

   • Module title:

     My[icon-star][br]loyal[br]team

     Module position:

     bottom4

     Module suffix:

     big-title icon-color2

     Configuration screenshots:

     Module details Module configuration content: view HTML code

6. bottom5

   • Module title:

     Bottom I

     Module position:

     bottom5

     Module suffix:

     -

     Configuration screenshots:

     Module details Module configuration content: view HTML code

   • Module title:

     Bottom II

     Module position:

     bottom5

     Module suffix:

     -

     Configuration screenshots:

     Module details Module configuration content: view HTML code

   • Module title:

     Bottom III

     Module position:

     bottom5

     Module suffix:

     -

     Configuration screenshots:

     Module details Module configuration content: view HTML code

   • Module title:

     Don't[br]hesitate to[br]contact[br]me[icon-mail]

     Module position:

     bottom5

     Module suffix:

     big-title title-left icon-color4

     Configuration screenshots:

     Module details Module configuration content: view HTML code

7. footer_nav

   • Module title:

     Footer menu

     Module position:

     footer_nav

     Module suffix:

     -

     Configuration screenshots:

     Module details Module configuration

8. header

   • Module title:

     Header I

     Module position:

     header

     Module suffix:

     gk-header1

     Configuration screenshots:

     Module details Module configuration content: view HTML code

9. login

   • Module title:

     Login

     Module position:

     login

     Module suffix:

     -

     Configuration screenshots:

     Module details Module configuration

10. mainbody

    • Module title:

      Check[br]out my[br]hot[icon-flame][br]works

      Module position:

      mainbody

      Module suffix:

      big-title icon-color1 title-right overlay-2x2

      Configuration screenshots:

      Module details Module configuration

11. mainbody_bottom

    • Module title:

      Suffix "big-title" with icons [icon-heart]

      Module position:

      mainbody_bottom

      Module suffix:

      big-title centered

      Configuration screenshots:

      Module details Module configuration content: view HTML code

    • Module title:

      NSP GK5

      Module position:

      mainbody_bottom

      Module suffix:

      -

      Configuration screenshots:

      Module details Module configuration

12. sidebar

    • Module title:

      Banner module

      Module position:

      sidebar

      Module suffix:

      -

      Configuration screenshots:

      Module details Module configuration

    • Module title:

      Suffix " advertisement"

      Module position:

      sidebar

      Module suffix:

      advertisement

      Configuration screenshots:

      Module details Module configuration content: view HTML code

    • Module title:

      Suffix " dark"

      Module position:

      sidebar

      Module suffix:

      dark

      Configuration screenshots:

      Module details Module configuration content: view HTML code

    • Module title:

      Suffix " light"

      Module position:

      sidebar

      Module suffix:

      light

      Configuration screenshots:

      Module details Module configuration content: view HTML code

    • Module title:

      Suffix " color"

      Module position:

      sidebar

      Module suffix:

      color

      Configuration screenshots:

      Module details Module configuration content: view HTML code

    • Module title:

      About The Blog

      Module position:

      sidebar

      Module suffix:

      -

      Configuration screenshots:

      Module details Module configuration content: view HTML code

    • Module title:

      Categories

      Module position:

      sidebar

      Module suffix:

      menu

      Configuration screenshots:

      Module details Module configuration

    • Module title:

      Tag Cloud

      Module position:

      sidebar

      Module suffix:

      -

      Configuration screenshots:

      Module details Module configuration

    • Module title:

      Menu

      Module position:

      sidebar

      Module suffix:

      menu

      Configuration screenshots:

      Module details Module configuration

    • Module title:

      Tabs GK5

      Module position:

      sidebar

      Module suffix:

      -

      Configuration screenshots:

      Module details Module configuration

13. tab1

    • Module title:

      Tab 1

      Module position:

      tab1

      Module suffix:

      -

      Configuration screenshots:

      Module details Module configuration

14. tab2

    • Module title:

      Comments

      Module position:

      tab2

      Module suffix:

      -

      Configuration screenshots:

      Module details Module configuration

15. top1

    • Module title:

      Top I

      Module position:

      top1

      Module suffix:

      -

      Configuration screenshots:

      Module details Module configuration content: view HTML code

    • Module title:

      Top II

      Module position:

      top1

      Module suffix:

      -

      Configuration screenshots:

      Module details Module configuration content: view HTML code

    • Module title:

      Top III

      Module position:

      top1

      Module suffix:

      -

      Configuration screenshots:

      Module details Module configuration content: view HTML code