Zotilz

woocommerce theme

• created: 11/01/2014
• latest update: 11/20/2014
• by: SolverCircle Ltd
• email: developers@solvercircle.com

Thank you for purchasing our “Zotilz” WooCommerce theme. If you have any questions that are beyond the scope of this help file, please feel free to email via our user page contact form. Thank you so much!

Zotilz is a clean, flexible, powerful and user friendly responsive Wordpress theme, built for your WooCommerce store. It is highly customizable and multipurpose Wordpress WooCommerce theme with lots of options and more flexibility.

Zotilz has included header logo, slider, featured and popular products, mini shopping cart, custom widgets, background and other color schemes and related products option with flexible admin panel.

Zotilz will be the best choice for you to create a simple or medium ecommerce or business website to fit your demanding needs.

We sincerely hope you will enjoy using this theme and we’re here to help you :)

• Fully Customizable Design
• Responsive Layouts
• Wordpress 4.0 ready
• WooCommerce ready
• Easy Installation and Setup
• Shortcode and Design Elements to work with
• Upload Logo option
• Slider included
• Custom Footers
• Wordpress Multisite Support
• Built with HTML 5 and CSS3 & jQuery
• Three different Template color.
• Custom Backgrounds
• Cross Browser Support
• User friendly Admin Panel
• Clean code. No PHP notices
• Elegant Icons
• SEO Friendly
• Extensive Documentation and Tutorials
• Theme Installation Instructions (step by step)
• Full Support & Updates
• And much more!

• Download the theme.
• Unzip the file “zotilz.zip” and upload the folder to the “/wp-content/ themes /” directory.
• Now go to Appearance > Themes menu in Wordpress Dashboard and Activate the Zotilz theme.
• Go to Appearance > ZOTILZ Options to customize the theme.

ZOTILZ Options > General:

1. Logo: Enter logo URL or upload logo image.
2. Footer Copyright: Enter footer copyright text.
3. Enable/Disable Back to Top: Enable or Disable Back to Top button from here.
4. Select Theme from three different Colors.

ZOTILZ Options > Home Page: Home Page Settings

1. Home Page Slider category: At first add some post with category and select category from here to show to the slider banner in homepage.
2. Number of slides: Insert how many slide you want to show at homepage. (It should be numeric number).

ZOTILZ Options > Home Page:  Home Page Products

1. Featured Products: Insert product category which you want to show as featured products.
2. Popular Products: Insert product category which you want to show as popular products.

ZOTILZ Options > Social: Footer Social

1. Enable/Disable Footer Social Icons: Enable or Disable Footer Social Icons from here.
2. Footer Social Title: Insert footer social title.
3. Enter social url/link in the text field and check the enable button to show the social links in homepage.

ZOTILZ Options > Related Products: WooCommerce related products option

1. Show related Products:  User can Enable or Disable the Slider from this option.
2. Title: User can set the Title of Related Products from this option.
3. Related Option:  Selects Related Products based on Category or Tag.
4. Placement Option: 5 (Five) Placement Option in this plugin. User can choose any of them.
5. Show Products:  Up to 50 Products can be loaded at the frontend.

ZOTILZ Options > Related Products: WooCommerce Related products Slider option

1. Background Color: User can set the Slider Background Color from this option.
2. Product Name Color:  User can set the text color of “Product Name” from this option.
3. Product Price Color: User can set the text color of “Product Price” from this option.
4. Slider Width: User can set the product container width from this panel. Minimum slider width is 120px.
5. Slider Height:  User can set the product container height from this panel. Minimum slider height is 180px.
6. Product Image Height:  User can set the product image height from this panel. Minimum product image height is 180px.
7. Max Slide: Show Number of product inside the Slider.
8. Move Slide: Choose the number of products to move on a Single click.
9. Speed:  Set the scrolling speed.
10. Auto Slide: Enable or disable auto scrolling option.

For more info about WooCommerce Related Products Slider plugin please visit  “WooCommerce Related Products Slider”

The Customizer allows you to preview changes to your site before publishing them. You can also navigate to different pages on your site to preview them.

Colors: “Header Text Color” and “Background Color” can change from here.

Background Image: User can upload sites background image from here.

Navigation: Zotilz theme supports 4 menus. Select which menu appears in each location. User can edit menu content on the Menus screen in the Appearance section. User can assign menu from here and can set “Left Top Bar”, “Right Top Bar”, “Main Menu” and “Mobile” menu from here.

Widgets: There are two footer widgets available here. “Footer Widget Left” and “Footer Widget Right”. User can just drag widgets to this footer container and he can reorder the widgets from here.

Widgets: Footer widgets left: You can Drag widgets to this footer container.

Widgets: Footer widgets right: You can Drag widgets to this footer container.

Widgets: Home Middle widgets: You can Drag widgets to this container.

Widgets: Home Middle widgets: You can Drag widgets to this container.

In the widget section of WordPress Admin, You can design your theme in various ways. You can add shortcode Column or Tab, add products banner, advertisement or something else.

In Home page bottom position there are two sections “Home Middle widgets” and “Home 3 Columns widgets”.

Go to Appearance > Widgets > “Home Middle widgets”

Home Middle Widget is one column widget. You can add multiple column, products image or advertisement here.

Go to Appearance > Widgets > “Home 3 Columns widgets”

“Home 3 Columns widgets” has three column widget. You can arrange this portion by dragging widget or products promotional image link, advertisements, banner or some other things.

Zotilz has “Full Width” and “Sidebar Layout” features for individual page. User can design his every page in four different formats.

1. Default Template
2. Full Width Page
3. Two Columns Left Sidebar
4. Two Columns Right Sidebar

To change template view, Go to Add New / Edit Page > Page Attributes > Template and select anyone from listed.

Column

Code for Single Column
[ztcolumns][ztcols columns='12'] Your Content Goes Here [/ztcols][/ztcolumns]

Code for Two Columns or 1/2 + 1/2 Columns
[ztcolumns][ztcols columns='6'] Your Content Goes Here [/ztcols][ztcols columns='6'] Your Content Goes Here [/ztcols][/ztcolumns]

Code for Two Columns or 3/4 + 1/4 Columns
[ztcolumns][ztcols columns='9'] Your Content Goes Here. [/ztcols][ztcols columns='3'] Your Content Goes Here. [/ztcols][/ztcolumns]

Code for Three Columns or 1/3 + 1/3 + 1/3 Columns
[ztcolumns][ztcols columns='4'] Your Content Goes Here [/ztcols][ztcols columns='4'] Your Content Goes Here [/ztcols][ztcols columns='4'] Your Content Goes Here [/ztcols][/ztcolumns]

Code For Three Columns or 1/2 + 1/4 + 1/4 Columns
[ztcolumns][ztcols columns='6'] Your Content Goes Here. [/ztcols][ztcols columns='3'] Your Content Goes Here. [/ztcols][ztcols columns='3'] Your Content Goes Here. [/ztcols][/ztcolumns]

Code For Three Columns or 1/4 + 1/2 + 1/4 Columns
[ztcolumns][ztcols columns='3'] Your Content Goes Here. [/ztcols][ztcols columns='6'] Your Content Goes Here. [/ztcols][ztcols columns='3'] Your Content Goes Here. [/ztcols][/ztcolumns]

Code for Four Columns or 1/4 + 1/4 + 1/4 Columns
[ztcolumns][ztcols columns='3'] Your Content Goes Here [/ztcols][ztcols columns='3'] Your Content Goes Here [/ztcols][ztcols columns='3'] Your Content Goes Here [/ztcols][ztcols columns='3'] Your Content Goes Here [/ztcols][/ztcolumns]

Code for Five columns or 1/6 + 1/6 + 1/6 + 1/3
[ztcolumns][ztcols columns='2'] Your Content Goes Here [/ztcols][ztcols columns='2'] Your Content Goes Here [/ztcols][ztcols columns='2'] Your Content Goes Here [/ztcols][ztcols columns='2'] Your Content Goes Here [/ztcols][ztcols columns='4'] Your Content Goes Here [/ztcols][/ztcolumns]

Code for Six columns or 1/6 + 1/6 + 1/6 + 1/6 + 1/6 + 1/6
[ztcolumns][ztcols columns='2'] Your Content Goes Here [/ztcols][ztcols columns='2'] Your Content Goes Here [/ztcols][ztcols columns='2'] Your Content Goes Here [/ztcols][ztcols columns='2'] Your Content Goes Here [/ztcols][ztcols columns='2'] Your Content Goes Here [/ztcols][ztcols columns='2'] Your Content Goes Here [/ztcols][/ztcolumns]

You can create more combinations by changing the columns number.

Shortcode for Vertical Tab

[zttabs]
[zttabs_title_section class="vertical"]
[zttab_title id="1" class="active"]Tab 1[/zttab_title]
[zttab_title id="2"]Tab 2[/zttab_title]
[zttab_title id="3"]Tab 3[/zttab_title]
[/zttabs_title_section]
[zttabs_content_section class="vertical"]
[zttab_content id="1" class="active"] First Tab Content [/zttab_content]
[zttab_content id="2"] Second Tab Content [/zttab_content]
[zttab_content id="3"] Third Tab Content [/zttab_content]
[/zttabs_content_section]
[/zttabs]

Shortcode for Horizontal Tab

[zttabs]
[zttabs_title_section class=""]
[zttab_title id="4" class="active"]Tab 1[/zttab_title]
[zttab_title id="5"]Tab 2[/zttab_title]
[zttab_title id="6"]Tab 3[/zttab_title]
[/zttabs_title_section]
[zttabs_content_section class=""]
[zttab_content id="4" class="active"] First Tab Content [/zttab_content]
[zttab_content id="5"] Second Tab Content [/zttab_content]
[zttab_content id="6"] Third Tab Content [/zttab_content]
[/zttabs_content_section]
[/zttabs]

Hook List

What are hooks?

Hooks in WordPress essentially allow you to manipulate code without editing core files. They are used extensively throughout WordPress and WooCommerce and are very useful for developers.

Hooks are provided by WordPress and WooCommerce to allow your plugin or theme to ‘hook into’ the code; that is, to call functions in your plugin at specific times, and thereby set your plugin in motion.

There are two types of hook: actions and filters.

1. Actions: Actions are the hooks that the WordPress core launches at specific points during execution, or when specific events occur.

2. Filters: Filters are the hooks that WordPress launches to modify text of various types before adding it to the database or sending it to the browser screen.

For a more in depth introduction to Hooks and Filters see:

http://docs.woothemes.com/document/introduction-to-hooks-actions-and-filters/
http://docs.woothemes.com/document/hooks/

In this theme we have provided some filters template hooks and list are given below: