Contact the Support

Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

General

Thank you for choosing SKT Themes. Built by the latest version of WordPress and used with WordPress only as well as using the powerful page builder plugin Gutenberg.

Requirements for Theme

Make sure that you’re running the latest version of WordPress, PHP version 5.6 or higher and MySQL version 5.6 or higher.

Recommended PHP configuration limits

One of the issues you may run into is importing demo data fails. The first solution is to increase PHP limits. You can do this by yourself or contact your server provider to ask for the help to increase following PHP limits in php.ini

  • max_execution_time 300
  • memory_limit 512M
  • post_max_size 100M
  • upload_max_filesize 64M
  • upload_max_size = 64M
  • max_input_time = 1000

Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Theme Installation Through Dashboard

  • Log in to the WordPress Dashboard.
  • Go to WordPress Dashboard -> Appearance -> Themes.
  • Click on Add New Theme.
  • Click on Upload Theme button.
  • Click on Choose File button and select theme like skt-gb-extreme.zip or skt-gb-spa.zip etc then click on Install Now button and wait for the install to complete.
  • After the theme installed successfully, click on Activate button.
  • After active the theme, you will see notice!. "Kindly click on Get Started button below to get them installed." Get started with SKT Elements, move to importing demo data process.

Manual Theme Installation using FTP

  • Unzip skt-gb-extreme.zip or skt-gb-spa.zip etc to your Desktop.
  • Use an FTP client to access your host web server. Go to /wp-content/themes/
  • Upload theme to /wp-content/themes/.
  • Go to WordPress Dashboard -> Appearance -> Themes and activate theme from Dashboard.
  • After active the theme, you will see notice!. "Kindly click on Get Started button below to get them installed." Get started with SKT Elements, move to importing demo data process.

Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Home Page Setup

If you have followed the above video then your home page might have got created automatically. In case you want to setup manually and don't want demo content then follow the steps below:

How to set up Home Page?

  • Go to WordPress Dashboard -> Appearance -> Customize -> Front Page -> Homepage Settings.
  • Click on "A static page" and select Home from the dropdown.

Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

How to Manage Slider?

  • Go to WordPress Dashboard -> Appearance -> Customize -> Front Page -> Slider

    Slider Type:
  • In this dropdown you will get three options:
    1. Default Slider
    2. Custom Slider
    3. Disable Slider



  • Default Slider
  • The default slider is inbuilt slider of the theme and it comes with several options like Slider Effect, Slider Navigation and Slider Font Typography & Colors.
  • Slider Effect: You can choose different types of slide changing effects from here like Fade, Fold, Random etc. Under this you can also set animation speed and slide pause time.
  • Slider Navigation: You can enable or disable slider navigation from here.
  • Slider Pagination: You can enable or disable slider pagination from here.
  • Slider Font Typography & Colors: Under this you can set font family, font size and colors of the slider elements.




  • Custom Slider
  • Custom Slider: If you want use any other slider instead of default one you can place that custom slider's shortcode here.
  • Here is the list of our recommended slider plugins starting from free to pro:
  • Master Slider
  • Smart Slider 3
  • Slider Revolution
  • Layer Slider



  • Disable Slider
  • If you do not want to use any slider you can use this option.



Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

How to manage Home Sections ?

  • Note: Home page is based on Gutenberg Editor and SKT Blocks Plugin. Click here to check SKT Blocks Plugin Documentation.
  • Go to WordPress Dashboard -> Pages.
  • Open Home page (Front Page)



  • Click on any section, Here options are available to edit this section


  • Click on content area to edit or add new content
  • Click on Typography tab in right side to change content styling, color, font size, font family etc.

  • How to change section image and add alt tag

  • Click on Spacing tab to manage content spacing


  • How to set sections up and down possion
  • Click on up arrow to move up this section
  • Click on down arrow to move down this section


  • Click on plus icon to add new block


  • Select required blocks from given options.


  • Same method follow in all sections as given above to edit or add content and change styling.



How to reuse Home Sections


  • Click +, scroll and go to Reusable. Select the reusable block from given options or you can simply copy/paste a block from one page to another.




  • All the reusable blocks can be find here.




Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

How to set up Navigation?

  • Go to WordPress Dashboard -> Appearance -> Menus.
  • Now create a menu and set display location to Header Navigation as seen in below screenshot.



How to set fixed or sticky Header Navigation?

How to show Navigation Items with Icon?

How to Show Menu With Mega Menu?

Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

How to make translate ready ?

  • Here is the list of best free translation plugin that works with Gutenberg:
  • 1. Polylang
  • 2. TranslatePress

  • 1. Polylang





    2. TranslatePress






Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Customize Basic Options

  • Kindly go to Appearance > Customize > Basic.

  • BASIC



  • SITE LAYOUT
  • Boxed
  • Full Width



  • COLORS OPTIONS
  • Site Background Color
  • Site Background Image
  • Site content Text Color
  • Other Elements Background
  • Other Elements Text Color
  • Default Anchor Color
  • Default Anchor Hover Color
  • H1, H2, H3, H4, H5, H6 Color
  • H1, H2, H3, H4, H5, H6 Hover Color
  • Team Box Background Color
  • Social Icon Bgcolor
  • Social Icon Hover Bgcolor
  • Testimonial Box Bgcolor
  • Testimonial Pager Color
  • Testimonial Active Pager Color
  • Gallery Active Filter Bgcolor
  • Skills Bar Background Color
  • Skills Bar Text Color
  • Post Title Color
  • Sidebar Widgets Background Color
  • Sidebar Widget Title Color
  • Sidebar Widget Text Color
  • Sidebar Widget Link Color



  • FONTS TYPOGRAPHY
  • Site Content Font [family, subsets, size]
  • H1, H2, H3, H4, H5, H6 [family, subsets, size]
  • Turn All Headings to Uppercase



  • CUSTOM CSS



  • SITE IDENTITY


Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Customize Header Options

  • Kindly go to Appearance > Customize > Header.



  • HEADER



  • We can also use widget for top right and top left instead of header option.



  • SITE TITLE & LOGO




  • HEADER LAYOUT


Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Inner Page & Posts Header

    First you have to enable custom fields, please follow the instructions given below:

  • 1. Add/Edit any page in WordPress admin.
  • 2. Click on three dots given at the top-right corner of the screen.
  • 3. Click on Preferences (all the way at the bottom) there which will open a pop-up.
  • 4. Click on Panels tab.
  • 5. Turn on custom field support under Additional > Custom Fields.
  • 6. Click Enable & Reload.





  • After the page reloads, you should now see a new section for custom fields below the main content area of the block editor. Here you can create new custom fields attached to the page or post.

  • By using custom fields you can embeded HTML, map, shortcode, video code etc in place of feauted image.
  • 1. Give the custom field "headercode" name.
  • 2. Add HTML, map, shortcode, video code etc as the field value.
  • 3. Click Add Custom Field to save it to your database.



  • Custom Fields in Classic Editor




Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Customize Footer Options

  • Kindly go to Appearance > Customize > Footer.



  • FOOTER STYLE



  • FOOTER COLUMNS



  • We can also use widget for each footer columns instead of footer columns options.



  • FOOTER INFO BOX



  • COPYRIGHT AREA


Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Customize Post & Page Options

  • Kindly go to Appearance > Customize > Post & Page.



  • POSTS SETTINGS



  • SINGLE POST LAYOUT



  • WOOCOMMERCE SHOP PAGE LAYOUT



  • WOOCOMMERCE SINGLE PRODUCT LAYOUT



  • PAGE HEADER SETTINGS
  • Page Header With Featured Image




  • If page does not assigned featured image. Then set background color or background image for header from page header settings in customizer. Also there is hide page header option to hide the header.



  • BLOG PAGE SETTINGS



  • CONTACT PAGE SETTINGS


Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Customize Section Buttons

  • Kindly go to Appearance > Customize > Sections Buttons.



  • SECTION BLOCKS BUTTON


Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Page Templates

  • Default Template
  • Helps in setting up the content on any page with right sidebar.

  • Page Left Sidebar
  • Helps in setting up the content on any page with left sidebar.

  • Page No Sidebar
  • Helps in setting up the content on any page with no sidebar.

  • Page Full Width
  • Helps in setting up the content on any page in full width.

  • Contact Layout1 & Contact Layout2
  • Select page template to set contact page layouts.

  • Testimonials
  • Select testimonials template to show all testimonials.


Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Set up Testimonials page

  • Set up by using page template:



Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

How To Manage Our Team Section




  • Our Team Shortcodes: [ourteam col="4" show="4" excerptlength="10"]
  • Paste this shortcodes where you want show team members.



  • How to add team members?
  • Kindly go to Dashboard > Our Team.
  • Click on add new button, enter team member name(title), description and set featured image for thumbnail.
  • For more details you watch below video.


Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

How To Manage Photo Gallery Section




  • Photo Gallery Shortcodes1: [photogallery filter="true"]
  • Paste this shortcode where you want gallery section.



  • Photo Gallery Shortcodes2: [gallery-carousel]
  • Paste this shortcode where you want gallery section.



  • How to add gallery images?
  • Kindly go to Dashboard > Photo Gallery.
  • Click on add new button (Image / Video), enter title, Video URL and set featured images for thumbnail.
  • For more details you watch below video.


Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Set up contact page

  • Set up by using Page Template:



Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Set up Blog page

  • Set up by using Page Template Blog on any page to show blog posts
  • Blog Full Width, Blog Left Sidebar, Blog No Sidebar, Blog Right Sidebar page templates


Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Set up Sidebar

  • Go to Appearance -> Widgets -> Page Sidebar
  • Go to Appearance -> Widgets -> Blog Sidebar
  • Drag and Drop any widgets you want. For eg. drag and drop text widget, then write the content you want to display on frontend.


Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Disable Page Comments

  • All you need to do is go to that page after Log into WordPress dashboard. Scroll down and check the section: Discussion (if not able to see check above Screen Options to show Comments).
  • Uncheck the box: Allow Comments and click on Update.
  • If you want to remove comments sidewide on Pages use this plugin: “Disable Comments” https://wordpress.org/plugins/disable-comments/

Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Setting up Shop

  • Go to Plugins -> Add New in the WordPress Admin panel
  • Type WooCommerce is search box and click on search button
  • Install and then Activate the plugin.
  • It will ask whether to set up default pages. Kindly click on setting up default pages of the WooCommerce.
  • That’s it now you can go to shop page and check the default product.

Documentation For All Gutenberg Themes

By SKT Themes - www.sktthemes.org

Shortcodes

  • Testimonial Rotator:
  • [testimonials-rotator show="3"]



  • Testimonial Box:
  • [testimonials-box col="3" show="3"]



  • Our Team:
  • [ourteam col="4" show="4" excerptlength="10"]
  • [ourteam col="3" show="3" excerptlength="10"]
  • [ourteam col="2" show="2" excerptlength="10"]
  • [ourteam col="1" show="1" excerptlength="10"]

  • col="4" means four columns in a single row and show="3" means number of team member show.



  • [ourteam col="3" show="3" excerptlength="10"]



  • [ourteam col="2" show="2" excerptlength="10"]



  • [ourteam col="1" show="1" excerptlength="10"]



  • Services:
  • [service pattern="boxpattern-1" icon="image.jpg" title="Title" go="fa-angle-right" url="#"]Description[/service]



  • [service pattern="boxpattern-2" icon="image.jpg" title="Title" go="fa-angle-right" url="#"]Description[/service]



  • [service pattern="boxpattern-3" icon="image.jpg" title="Title" go="fa-angle-right" url="#"]Description[/service]



  • [service pattern="boxpattern-4" icon="image.jpg" title="Title" go="fa-angle-right" url="#"]Description[/service]



  • Clear:
  • [clear]


  • Photo Gallery:
  • [photogallery filter="true"]



  • Show Without Filters Use Shortcode : [photogallery filter="false"]

  • Photo Gallery Carousel:
  • [gallery-carousel]



  • Recent Posts:
  • [posts-style1 show="4" cat="1" excerptlength="24"]
  • [posts-style2 show="2" cat="1" excerptlength="24"]
  • Above listed two types of posts style shortcode.

  • [posts-style1 show="4" cat="1" excerptlength="24"] "show=4" means display four posts if you want to display 6 or 8 or etc. so just change show=6 or show=8. and "excerptlength=24" set box character length. and "cat=1" ID of display posts category



  • [posts-style2 show="2" cat="1" excerptlength="24"] "show=2" means display two posts if you want to display 4 or 6 or etc. so just change show=4 or show=6. and "excerptlength=24" set box character length. and "cat=1" ID of display posts category



  • Post Timeline:
  • [posts-timeline show="4" cat="1" excerptlength="24"]



  • Post Grid:
  • [posts-grid show="4" cat="1" excerptlength="24"]



  • Skill:
  • [skill title="HTML" percent="80" bgcolor="#a0ce4e"][skill title="Wordpress" percent="99" bgcolor="#a0ce4e"][skill title="Web Design" percent="90" bgcolor="#a0ce4e"][skill title="Web Development" percent="95" bgcolor="#a0ce4e"][skill title="Responsive" percent="85" bgcolor="#a0ce4e"]



  • Clients
  • [client url="#" image="image url"]



  • Social Icons
  • [social_area] [social icon="facebook" link="#"] [social icon="twitter" link="#"] [social icon="google-plus" link="#"] [social icon="linkedin" link="#"] [social icon="pinterest" link="#"] [/social_area]



  • Flip Box
  • Horizontal Flip:
    [flipbox fliptype="h" frontimage="http://www.yoursite.com/wp-content/themes/skt-ele-spa/images/model-429733_640.jpg" fronttitle="The Front Title" frontdescription="Some Lorem Content Description Goes Here" backtitle="The Back Title" backdescription="This is the back description for testing purpose will added some dummy description text. This is the back description for testing purpose will added some dummy description text.This is the back description for testing purpose will added some dummy description text." backurl="#" backbutton="Read More"]



  • Vertical Flip:
    [flipbox fliptype="v" frontimage="http://www.yoursite.com/wp-content/themes/skt-ele-spa/images/person-822552_1280.jpg" fronttitle="The Front Title" frontdescription="Some Lorem Content Description Goes Here" backtitle="The Back Title" backdescription="This is the back description for testing purpose will added some dummy description text. This is the back description for testing purpose will added some dummy description text.This is the back description for testing purpose will added some dummy description text." backurl="#" backbutton="Read Now"]


  • Dividers:
  • [divider style="divider1"]



  • [divider style="divider2"]



  • [divider style="divider3"]



  • [divider style="divider4"]



  • [divider style="divider5"]



  • [divider style="divider6"]



  • [headingdivider text="Heading Title"]



  • Promotion Box:
  • [promobox1 bgcolor="#f7f7f7" topbordercolor="#a0ce4e" otherbordercolor="#e8e6e6"]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.[/promobox1]



  • [promobox2 bgcolor="#f7f7f7" leftbordercolor="#a0ce4e" button="Hello Text" url="#"]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.[/promobox2]



  • [promobox3 bgcolor="#f7f7f7" bottombordercolor="#a0ce4e" button="Hello Text" url="#"]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.[/promobox3]



  • [promobox4 bgcolor="#f7f7f7" bordercolor="#a0ce4e"]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.[/promobox4]



  • [squarebox image="image" title="title" url="#" target="blank"]



  • [ourteamexpanded show="4"]



  • [skt-ele-spabox image="image" title="title" description="description" url="#" target="blank"]



  • [blockbox url="url" image="image" title="title" titlecolor="titlecolor" target="self"]



  • [centertitle text="text" titlecolor="#000000" seperatorcolor="#000000"]



  • [headingseperator text="text"]



  • [boxthumb name="name" url="#" image="image" target="blank"]


Theme Forms

By SKT Themes - www.sktthemes.org

How to setup forms?

  • We use Contact Form 7 to make all types of form. Eg: Appointment Forms, Booking Forms and Normal Contact Forms.
  • In below video you can learn how to use and setup Contact Form 7 plugin.



How to setup GB IT Company Theme Leave a Message Form?

  • Kindly go to Dashboard -> Contact.



  • Edit or add form fields, and copy contact form shortcode




  • Add form shrotcode in home page block




  • Leave a Message Form Code
  •                             
    [text* text-922 placeholder "Full Name"] [email* email-221 placeholder "Email Address"]
    [tel tel-900 placeholder "Phone Number"] [text* text-383 placeholder "Zip Code"]
    [select menu-744 class:contact-sevices "Select Service" "Service 1" "Service 2" "Service 3"]
    [textarea textarea-756 "Write Message"]
    [submit "Send a Message"]                            
                                

GB Shopping

By SKT Themes - www.sktthemes.org

How to set product category image?

  • Go to Products -> Categories -> Click and edit a category -> Scroll down to bottom and set Thumbnail image there.





How to set SUBSCRIBE NEWSLETTERS Form

  • Kindly go to Dashboard -> Contact -> Newsletter Form



  • Edit or add form fields, and copy contact form shortcode.




  • Add form shrotcode in home page block.




  • SUBSCRIBE NEWSLETTERS Form Code
  •                             
    <div class="newletter-form">
    [email* email-312 placeholder "Enter Your Email :"]
    [submit "Subscribe Now"]
    </div>                           
                                

How to set Deal of tha day Time Counter



GB Doctor

By SKT Themes - www.sktthemes.org

How to set Appointment Form?

  • Kindly go to Dashboard -> Contact -> Appointment Form.



  • Add or edit form fields.



  • Appointment Form Code
  • [text* your-name placeholder "Patient Name"]
    
    [text* your-name placeholder "Phone Number"]
    
    [email* your-email placeholder "Email"]
    
    [select* department "Select Department" "Cardiology" "Oncology" "Dental Care" "Eye Care"]
    
    [select* department "Choose Doctor by Name" "John Doe" "Alex Doe" "Chris Doe"]
    
    [date* date placeholder "Choose Date"]
    
    [submit "MAKE AN APPOINTMENT"]
    


  • Add form shrotcode in home page block



  • Frontend view of home page block



GB Podcast

By SKT Themes - www.sktthemes.org

How to set Looking For Help? Contact Us Form?

  • Kindly go to Dashboard -> Contact -> Appointment Form.



  • Add or edit form fields.



  • Looking For Help? Contact Us Form Code
  • [text* text-339 placeholder "First Name"] [text* text-934 placeholder "Last Name"]
    [email* email-829 placeholder "Email"]
    [text* text-295 placeholder "Subject"]
    [textarea* textarea-801 placeholder "Message"]
    [submit "SUBMIT"]
    


  • Add form shrotcode in home page block



  • Frontend view of home page block



How to edit music player?

  • Click on Edit URL icon




  • Enter your music player url from media library, We can also embed online url