Created: 07/14/2015
Latest update: 07/14/2015
By: ThimPress
Thank you for purchasing my theme. If you have any questions that are beyond the scope of this
documentation, please feel free to request support at our Support Forum. Thanks so much!
Get the Theme installation package from your account download page and save it to your desktop.
Since required & recommended plugins are already packed in the download file, you won’t need to go download them individually.
You can upload the Theme file in two ways:
(SKIP THIS STEP if you have already successfully uploaded theme via WordPress) – Now you will learn how to upload your files using the Filezilla client.
It is recommended using those limits to a minimum as follows in order for free-trouble while installing demo or saving customize.
max_execution_time 3000
memory_limit 256M
post_max_size 64M
upload_max_filesize 64M
1. Open the WordPress Dashboard.
2. Go to Appearance > Themes.
3. Click activate Theme.
A notice will appear asking you to install some required plugins after Active Theme.
1. Click on “Begin installing plugins” link.
2. Click on the box beside “Plugin” label to select all plugins in the list, choose “Install” from the drop-down list at the top and then click “Apply”.
When the notice “All installations have been completed” appears, click on Return to Required Plugins Installer link under it to turn back to the plugin list.
3. Click on the box beside “Plugin” label to select all plugins in the list, choose “Activate” from the drop-down list at the top and then click “Apply”.
The installing process status will be shown in your browser. It may takes a few minutes, so please be patient.
After completing the activation and no bug occurred, you will see status of all plugins is activated.
This is priority to use for importing fully demo content.
The progressing will display on import status bars so you will know when it is finished and your data is ready.
This is video tutorial installation by one-click way.
NOTES: IMPORT DEMO DATA BY ONE-CLICK WAY WILL NOT INCLUDE IMAGES FROM OUR DEMO SITE. ALL IMAGES WILL BE REPLACED BY SAMPLE IMAGES.
1. Import .xml file:
Where is file .xml to import?
There are 9 demo style file placed in folder adot\inc\admin\data and each style file contains “demodata.xml” file. Just click on one demo file then find file “demodata.xml” to import demo. If you choose any demo type then after importation process, your site will be styled accordingly.
Following these steps to import demo data via .xml file:
2. Set Up Front Page:
– Go to Setting >> Reading.
– select a static page (select below) >> Choose Front page is Home
page.
3. Import Revolution Slider:
The download package contains the exported slider (Revolution Slider) that can be used as your slider template. Please follow the steps below to import it.
How to Edit a Revolution Slider When you can’t import image correctly?
You need to Edit revolution Slider.
You’re still on the main page of Revolution Slider, click Edit Slides.
Please note that these steps are to set up slider for homepage the same as in live demo. If you want to make your own slider, please follow the official Slider Revolution document.
4. Import Widget:
– Install and Active Widget Importer Plugin.
– Go to Tool >> Widget Setting Imports >> Select a
file >> Choose
file themes\adot\inc\admin\data\widget\widget_data.json >> Click on
“Show Widget Settings” >> Select all active widget >>
Click on “Import Widget Setting“.
5. Import Setting:
Go to Appearance >> Customize >> Import/ Export Setting >> Import Setting >> choose file theme/inc/admin/data/setting.js >> click “Save & Publish” button.
6. Configure Menu:
Go to Appearance >> Menu >> select “Main Menu” >> choose “Primary Menu” >> click “Save Menu“.
This is video tutorial installation via xml file.
By clicking on the “Customize” menu under “Appearance”, you’ll be able to change all specific template settings.
There will appear:
Please note that, after configuring something in customize, you need to click blue button <<Save & Publish>> to apply changes.
This is the section for you to set a Logo as your website identity. You can upload this Logo on your server, or just paste an URL into the Logo box.
The Logo will be displayed like this on your Header and will be sticky with menu when scrolling down your site:
The size of your Logo Section on Header Menu could be set with Width Logo option. Since the layout is built using Bootstrap Grid system for a responsive design, the width of your Header Menu is also divided into 12 sections. We recommend using value 2 or 3 (corresponding with 16.67% or 25%) to menu will be shown in a line. You can set logo size as you want then your site will automatically thumbnail size depending on the value of “logo width” to logo displayed balance with menu.
Favicon:
Similarly, the image indicated by the Favicon box will be your site logo favicon, which will appear on the status bar of the browser.
The favicon should be in one of the following formats: .ico, .png, .gif. Usually we should use .ico.
It will be shown in frontend:
Note that you need to Add a Widget to show Offcanvas Sidebar. The guideline to Add a Widget will be expressed in the Widget Section bellow.
There are options to control Drawer that can be used to insert widgets at the top of your page. Note that you need to Add a Widget to show Drawer. The guideline to Add a Widget will be expressed in the Widget Section bellow.
– You can choose to Show or Hide Drawer.
– Or select a Drawer Background color.
– Drawer Text Color: The text color in Drawer.
– Drawer Style: Currently there are 2 styles of Drawer Style for
you to choose.
– Select a Layout: there are 2 style for header main menu.
– Header Position: select type Header Position for main menu.
– Background color: select color for background main menu.
– Text color: select color for text of main menu.
– Text Hover color: select color for text when hover over main menu.
– Font Size: select font size for text main menu.
– Font Weight: select font weight for main menu text.
– Color Border Top: select color for border top of sub menu.
– Background Color: select color for background of sub menu.
– Color Border Bottom: select color for border bottom of sub menu.
– Text color: select color for text of sub menu.
– Text color hover: select color when hover over text sub menu.
– Config Sticky Menu: you can choose “custom” or let it “same with main menu” when sticky menu.
– Sticky Background color: If custom sticky menu, select background color for main menu when sticky.
– Text color: If custom sticky menu, select text color for main menu when sticky.
– Text Hover color: If custom sticky menu, select text hover color for main menu when sticky.
This option allows you to configure to see main menu in mobile.
– Background color: select background color for main menu when view on mobile.
– Text color: select text color for main menu when view on mobile.
– Text Hover color: select text hover color for main menu when view on mobile.
Note that you need to Add a Widget to show Offcanvas Sidebar. The guideline to Add a Widget will be expressed in the Widget Section bellow.
There are options help control every element on Offcanvas Sidebar:
– Show or hide: Choose to show or hide Offcanvas Sidebar.
– Background color: Select Background Color for Offcanvas Sidebar.
– Text color: Text Color in offcanvas Sidebar.
– Link color: Color for link on offcanvas Sidebar.
– Icon: enter icon name.
Like the name indicated, it is the section to control the Footer part of your site.
– Background footer image: upload background image for footer.
– Text Color: select color for text in footer.
– Background Color: select background color for footer.
– Text Color: Select color for text in copyright.
– Copyright Text: allow you to input content for the tagline in your footer.
Select a layout: choose to display your site in full width, or in a boxed zone.
– Background Pattern: checking the box under this option title and you will be able to select one of ours.
– Upload Background: select background to upload to use as your Background Pattern.
– Background Repeat: to repeat the image in your background.
– Background Position: to set the starting position of a background image.
– Background Attachment: to set whether a background image is fixed/scroll/local/ initial or inherit with the rest of the page.
– Background Size: to specify the size of the background images.
: this option should only be used with the Boxed Layout. You can select a solid color for the background of your page.
: Each of our theme will have one major color called “Theme primary color”. The elements of the primary color are included with: Hover Text color of “Book a Table”, color of “View Detail” button, color of text “Book Menu” button, hover social link icon… If you configure any color, it also will be applied similarly to these elements.
– Front Page Layout
This is the place for you to select an alignment for your frontpages, which is the first display page in your site. You can choose whether or not to use the sidebar, as well as positioning it in a layout with 1 or 2 columns.
1 – No side bar at all
2 – One sidebar, located on the left
3 – One sidebar, located on the right
– Top Image: upload top image for front page.
:
-Custom Title
– Select Layout Default:
– Custom Title: enter name of Tittle front page. If leave blank field, system will automatically display name of front page.
– Background Heading: Select Background Heading color for front page.
– Select Style Default: select style default for front page.
– Select Columns: This configuration just works for style grid layout, select number columns displayed in front page.
– Text Color Heading: text color heading in Front page.
– Height Heading: adjust height heading of front page.
-Archive Layout
-Top Image
–
–
-Excerpt Length
-Single & Page Layout
-Top Image
–
–
chú thích
-Archive Layout
-Top Image
–
–
-Select Layout Default
-Top Image
–
–
-Column
-Number of Products per Page
ảnh minh họa
-Front page displays
-Front page
-Posts page
To configure options under Customize section.
If you want to have a new site with similar settings as your created site. Use this function to export a file js in created site and import this file js into the new site.
Inside this panel you will find all core WooCommerce settings such as: catalog settings, pages, payment gateways, shipping methods and tax rates which are accessible via the tabs at the top of the screen.
To configure your shop go to “WooCommerce > Settings”, then browse through the tabs below to get more information on the WooCommerce Options and then click Save changes.
For more details, please follow the official docs.
Product Thumbnail Settings
The Product thumbnail size is decided by Product Image settings in WooCommerce. To customize, open WooCommerce Settings menu, then switch to the “Products” >> “Display” >> “Product Image Sizes”
If you change these options after the images are set for your product, please re-generate your thumbnails to match the new settings by accessing the Tools >> Regen. Thumbnails menu and click on the <<Regenerate All Thumbnails>> button.
1. Go to Appearance >> Menu
2. Select a menu to edit or click create a new menu.
Note: when you import our demo content, it will automatically create a Main menu for you, so select “Main Menu” if you want to have same menu as in preview.
3. Select pages or categories or links… from the left meta box and click Add to Menu
On the right, feel free to drag and drop menu items to organize them.
4. Check Primary Menu for theme locations at the bottom of the page.
5. Click “save menu” button.
Go to Setting >> Reading
Siteorigin is the fantastic plugin, that adds a drag & drop page builder to your WordPress theme. It gives you the tools you need to be able to create complex page layouts without touching a single line of code. Read more at here
When editing a widget, on the right of the interface always shows a Widget Styles column consisting of Attributes, Layout, Design to help you configure for this widget.
When editing a widget, on the right of the interface always shows a Widget Styles column consisting of Attributes, Layout, Design to help you configure for this widget.
Widget Class: a CSS class.
CSS Styles: CSS Styles, given as one per row.
Padding: Padding around the entire row.
Background Color: select Background color of the row.
Background Image: select Background image of the row.
Background Image Display: how the background image is displayed.
Border Color: Border color of the row.
Font Color: Color of text inside this widget.
Asides from the default elements that Siteorigin provides, we also offer some special elements that are designed especially for WordPress shops built with Thimpress.