# Dictate Multipurpose Wordpress Theme

Premium Html5 Templates and WP Themes by webinane.com

## Introduction: A Special Thanks to You for Choosing Our Product

Dictate, the 6-in-one premium Wordpress theme, brings you modern design and neat & clean outlook. Touching the heights of artistic perfection, this multi-purpose web building tool can be used for six different niches, Medical, Fashion, Spa, Saloon, Business and Blog. Nevertheless, it is suitable for every single website, as you can utilize 78+ built-in elements and advanced Visual Composer (save $ 25) page builder to modify it to any required shape and functionality. The greatest appeal lies in its versatility of features and ease of customization, so that you may launch a fully featured website with little or no basic knowledge, effort and time.

Some of the grandiose features of this premium Wordprss template include: 11 Homepage layouts; 4 built-in Sliders, including LayerSlider (save $ 15); 6 Header styles; 13 Custom Post types; 5 Gallery designs; 20 built-in pages; 4 Portfolio styles; advanced Timetable Management System; and so on. In addition, you can further beautify this fully responsive and Retina Ready theme with the multiple color options. The advanced SEO coding techniques, applied in its building, will fetch your website greater traffic on all the famous search engines and promote its popularity.

## How To Install Demo / How to Make the Theme Look Exactly like The Themeforest Demo

Note: There is no need to activate Visual Composer, it is a premium plugin included in your package, it is already activated and the dear users should start using it. Thanks Few steps are involved the installing the Demo data.

Please install the theme first and then install the Demo.xml

1: Click on Plugins >> Add New plugin and search “WordPress Importer” >> Click Install now

2: Click on Tools >> Import >> Click Wordpress Option >> Choose XML File (Data.xml) and click “upload file and import” button option.

3: Go to Theme Options And click “Import Default Setting” Click OK Option You will be easily see the theme as the Demo now.

4. Now for setting the theme Menu Go to Appearace >> Menus >> Click on Manage Locations Tab >> against Main Menu select Top Menu from the drop down.

5. Now Goto Settings >> Reading >> and against "Front Page" select Home as the home page of the website.

Your Demo is Ready now. Please note that the Demo will be without original images as it is the policy of themeforest.net

## Common Problems You May Face

Menu may look owkward

Now for setting the theme Menu Go to Appearace >> Menus >> Click on Manage Locations Tab >> against Main Menu select Top Menu from the drop down.

You may not see any section?

To solve this errors, edit the concerned page, and open the Element in Visual Composer which you can not see. Only click on Save after selecting any category and you will start seeing it.

The Menu Widget in Footer May Not Be Displaying

Goto Appreance >> Widgets >> in Footer Widget Bar Click on Custom Menu Widget, now click Select Menu dropdown and select Footer Menu and click save.

Font Settings (Goto Theme Options >> Font Options >> Heading Font)

In all the Fonty Family select Open Sans which we have applied in every section of the theme.

Description in Service area may not display.

We have given Content Limit option at the bottom of every Single Service Post in Wordpress admin area. You can change the limit to 150 characters or any limit which you want to show in Service area.

You Logo may increase the height of Menu section.

This may be controlled through Logo Margin Top in Theme Options >> Header Styles (here you will see the option of Logo Margin Top at the bottom).

## WooCommerce: Initial Setup

### Installation and Initial Setup

Installation is just as easy as any other WordPress plugin. You have 2 options:

FTP/SFTP Upload

- Visit the WooCommerce Plugin Page on the WordPress.org Plugin Repository and click download. This will download the latest version to your local machine.
- Extract the downloaded zip file using your application of choice.
- Connect to your WordPress site via FTP or SFTP (SFTP FTW!) and navigate to `wp-content/plugins/`.
- Upload the extracted woocommerce folder to `wp-content/plugins/`.

WordPress Dashboard

- Login to your WordPress site Dashboard.
- Navigate to Plugins -> Add New.
- Search for "WooCommerce".
- The top result should be "WooCommerce - excelling eCommerce". Click install now.
- Depending on your setup you may be prompted for your FTP username and password.

Plugin Activation

If you uploaded your plugin via FTP/SFTP you now need to navigate to "Installed Plugins" under your WordPress Dashboard. Find WooCommerce in the list and click on activate.

If you downloaded the plugin via your WordPress Dashboard you should see "Successfully installed the plugin WooCommerce - excelling eCommerce 1.6.6." (The version may be different depending on when you are reading this!), underneath simply click Activate Plugin. (If you have already navigated away from this page you can simply follow the above step, navigating to your Installed Plugins page to activate.)

Pages Setup - You should see a nice magenta banner "Welcome to WooCommerce – You're almost ready to start selling :)". WooCommerce needs some pages to be created for it to function, it can do this automatically for you by simply clicking "Install WooCommerce Pages". (You can change these page names later if you want to).

That's it WooCommerce is installed! You should now be looking at the WooCommerce settings page. This is where you will be configuring your store. Let's go through the initial settings.

### General Settings

The first thing we need to do is setup where we are and our currency. These are simple dropdowns and you also get a third dropdown to allow you to limit which countries you are willing to ship to. You currently can only set one currency, which might be an issue for some international sellers, however there is an extension to show dynamic currency conversions in your store using the Open Source Currency Exchange API. This will only serve as a guide for your visitors as payment will still be taken in the base currency you set under general settings. It is also a paid extension.

Next we get some Checkout and account options. Here you can configure things like enabling guest checkouts (so they don't need to register an account with your site), you can force SSL on checkout pages (particularly useful if your payment gateway requires this), if you want to enable coupons (more on this later). You can also set some account functions like allow user registration without an order, whether to use email addresses for usernames and if you want to hide the WordPress Admin from customers. Most of these are personal preference and you can add and remove these options whenever you like. The default options are a good place to start and I always disallow customer access to the WordPress admin.

Further down we have some options for styling and scripts. You can enable the default WooCommerce CSS and customise it from here or turn it off completely. We'll go into more detail on this later. You also get a couple of UI options including quite a nice Lightbox effect which I usually enable.

Finally on this page we see our digital downloads options. With WooCommerce you can easily sell virtual and downloadable products these options allow you to define how they should be handled and how to grant access. The options are pretty self explanatory as with most of the WooCommerce setup.

### Catalog Settings

Most of the options are easy to understand, one definately worth a look is the "Show subcategories". These three little checkboxes can really affect your look. Check these boxes and your main store page will show your categories instead of products. This is really useful as it gives much more of a e-commerce feel, with lots of products simply having the products shown can make navigating your product categories quite difficult as you have to rely on the WooCommerce widgets.

Product data is also one to watch, it gives you the option to show or hide some fields on your products, it is up to you to decide if you need these fields and to enable/disable according to your needs. Likewise hiding underneath is the ratings options. Again whether or not to allow product reviews is your personal choice, but it is nice that WooCommerce gives you the option to turn it on or off.

Skipping to the bottom we see the Image options. Here you set the image dimensions of your products, these are essentially the image sizes for the Products custom post type WooCommerce creates for you. Catalog images are your archive style pages with single product images and product thumbnails being exactly what they say they are. If you do change the image sizes after adding products you will need to regenerate your images using something like the Regenerate Thumbnails Plugin as like all WordPress media the extra image sizes are created on upload based on these settings.

### Other Settings

I'm going to speed through some of the other settings here as most are fairly self-explanatory. I recommend you setup a local WordPress site and have a play with WooCommerce to check out the different options.

- Pages Settings - Remember during our plugin activation we created some pages? Well it is here you can change them. You can simply update the already created pages (found along with all the other pages you have on your site) or you can create new pages and link them from this page. You can also change your shop permalink structure from here although I have never found the need personally.
- Inventory Settings - Another small and simple page. Basically do you want to enable stock management or not? If you do you get a few options on what to do about low stock etc.
- Tax Settings - From here you can define your tax rules with multiple tax classes and local tax rules. Particularly useful actually especially for international selling. As with all the settings you will either need it or not and switching it off is as simple as a checkbox.

So hopefully we have WooCommerce installed and we've been through our intial setup. There's still a little bit of work to do before we can start adding our products though.

### Setting Up Shipping

Out of the box WooCommerce comes with a range of shipping options and even gives you the option to switch it off completely if you are dealing with downloadable or virtual products. The core shipping options allow you to set fixed rate costs for domestic, international and local delivery and allow you to specify different classes like Next Day, Priority Delivery etc by using what are called shipping classes. You can easily set which countries and areas qualify for your different shipping methods and you should be able to get your store up and running using these basic methods.

Let's setup a shipping method. So for my store I want to charge a flat fee for all deliveries to the UK and then a flat fee for international shipping. From my shipping options I have disabled all but "Flat Rate" and "International Shipping". On my main shipping options page I have ticked "Enable Shipping" and "Hide shipping costs until an address is entered". I don't want the shipping calculator to be shown so have unticked this (this is more for use when you have complicated shipping rules and charges in place). Now I don't mind shipping to a seperate billing address so I'm allowing that, however I am setting the billing address as the default shipping address. You can see my setup below.

So now onto the charges. So firstly my flat rate; I've enabled it and changed the "Method Title" to UK Delivery (this is what is output on the front end). For my method availability I have set it to specific countries and specified United Kingdom in the box below. On people with a shipping address within the United Kingdom will be able to use this shipping method. Next I have set the "Calculation Type" to Per Order and left it as Taxable. My Default cost is set to 4.99 I'm not charging a handling fee.

Now for my International Shipping. I've enabled it, the default name of "International Delivery" makes sense. Now for availablity I've this time set it to "Excluding selected countries" and then entered United Kingdom. Everything else is the same as for UK delivery except the price which I have set to 7.99. Now anybody ordering with delivery to a UK address should see the United Kingdom Delivery price and anybody with a delivery address outside the United Kigdom will see our international price.

This is obviously a very basic shipping setup. You can do much more using premium shipping extensions. You can use the Table Rate Shipping Extension to create complicated shipping rules to calculate shipping based on weight and dimensions of a product or charge a fixed fee for the first item and then a smaller fee for additional items in a cart (This extension is extremely well put together and can give you endless options for your shipping charges). You can also get extensions to hook into popular shipping carriers APIs such as UPS, FedEx and the USPS meaning you can get real-time and correct shipping pricing from your carrier. Now you pay for the extra shipping methods but the small cost involved should be well inline without whatever profits your store is generating with the average shipping extension coming in at around $49.

### Setting Up Your Payment Gateways

Okay, initial setup is done. We have our shipping methods setup. Now we need to actually get some money from our users! As with the shipping methods you get a few basic payment gateway options out of the box. Most of them completely pointless for most e-commerce stores, things like Direct Bank Transfer, Cheque, Cash On Delivery. What you do get is PayPal which should be fine for most people starting out and Mijireh Checkout. Mijireh is payment processor that has partnered with WooCommerce hence why it is included for free. Mijireh Checkout provides a fully PCI Compliant, secure way to collect and transmit credit card data to your payment gateway while keeping you in control of the design of your site. Mijireh supports a wide variety of payment gateways: Stripe, Authorize.net, PayPal, eWay, SagePay, Braintree, PayLeap, and more. Obviously you need an account with one of the supported payment gateways and as well as the charges you will incur from your gateway you will also have to pay a $0.50 transaction fee to Mijireh. I've not used this myself as with the shipping extensions you can purchase additional payment gateway modules and prefer a small one of cost rather than a recuring charge. The choice is yours.

For our tutorial let's start with PayPal setup. No surprise it is simple to setup! Enable it enter your PayPal email address and you done. You get a few other options you can tweak like invoice prefixing for PayPal and you can specify your PayPal page style. You can also enable or disable PayPal sandbox mode (it is enabled by default) brilliant for testing your store beofre you go live! That's it Payment gateway is probably the easiest bit of the whole setup.

### Conclusion

So we have WooCommerce installed and our initial setup is complete, that wasn't too painful now was it? We've setup our shipping methods and also setup our payment gateways all with very little time or effort. In our second article we will go through adding some products and talk about the different product types WooCommerce offers, we'll have a look at how to style and theme WooCommerce and discuss next steps for extending WooCommerce.

## Theme Options:

### General Settings:

- Change Color Scheme using Color Bar or predefined Color Schemes dropdown.
- Set Twitter API Key, Twitter Secret Key, Twitter Token and Twitter Security Token.

### Font Options:

- Set Font Size, Font Family, Font Style, Line Height and Font Color of Heading Fonts Like H1, H2, H3, H4, H5, H6
- Set Font Styles for Body, Grey Area and Footer

### Donation Settings:

- Switch Donation Status on/off
- Select which version Of PayPal you are using through dropdown.
- Set the title, currency symbol, how much you raised, and how much the target is
- Put your PayPal Username, PayPal API Username, PayPal API Password, PayPal API Signature
- Also you can put a note on the donation bar.

### Slider Settings:

- Set options for Camera, Parallax and Slice Box Slider

### Sidebar Creator:

- Create as many sidebars as you want

### Page Settings:

- Set 404 Page Heading, Sub Heading, Page Content, Grey Main Title, Colored Main Title, Page Sub Title.
- Set page sidebar position and switch page comments On/Off

### Blog Settings

- Customize Blog or Archive page setting

### Layout Settings:

- Switch On/Off Responsive Design
- Switch on/Off Boxed Layout for Home and other pages.
- Select width for Boxed Layout
- Set and upload Pattern Background Image

### Coming Soon:

- Switch on/off Coming Soon option

### Social Network Settings:

- Put Social Network urls of Facebook, Twitter, Google Plus, LinkedIn, Skype, Flickr, Xing and Pinterest

### Portfolio Settings:

- Set Portfolio Columns via dropdown

## Data Setting

### Adding Team Member

Go To Teams > New Member

Add Title (Name) for the Team Member

Add Description (biodata) for the Team Member

Select a Department from the right side in Departments Section

Customize Settings like Designation, Experience, Social Media Links

### Adding Timetables

Go To Timetable

Click On Add New Record

Add Start Time, End Time

Choose Memeber from dropdown

Add Duty, Place and click on Save Changes button.

You can add as many team members as you want.

Similarly, add timetables for other days by clicking on the required day option, like Monday, Tuesday, etc.

In first section, the Timetable is for Sunday.

### Adding Events

Go To Events

Click on New Event and add Title for the Event, and Description of the Event

Add Start Date, End Date and other Info regarding Event in Event Settings

Choose Featured Image for the Event by clicking on Set Featured Image on the right side.

After completing, click on the Publish button on the right side.

### Add Services

To add services, go to Services > New Service

Add a Title for the Service

Add some Description for the Service

Select Department from the right side

You can add departments by clicking on Add New Department on right hand side.

You can also add a department in the Departments section by going to Services > Departments

Add Featured Image by clicking on Set Featured Image on right hand side

You can add One or more services in Service Settings at the bottom

Choose Font Awesome Icon for the Service through dropdown

You can also choose the color of icon through Font Awesome Color

Note: The Icons through Font Awesome will be used for shortcodes of Services 4, 5 and 6

### Adding Gallery

To add galleries, go to Galleries > New Gallery

Add Title for your Gallery

In Gallery Settings add Sub-Title for the Gallery, select sidebar position

Choose which sidebar you want to use for this gallery through the sidebar dropdown selection menu

Select how many columns you want to display for your Gallery

Add gallery images in Gallery through Add Media button and choose or upload images for your Gallery

You can also make a Video Gallery by clicking on Add More in front of Videos

### Adding FAQs

To add FAQs, simply go to FAQs and click on New FAQ

Add Title and Description for the FAQ

You can choose icon in FAQs Settings via Font Awesome dropdown selection menu or you may use no icon

### Adding Partners

To add the partners, go to Partners in Admin Panel and click on New Partner

Add title (Company Name) of your Partner

Choose Display Logo for the Partner by clicking on Set Featured Image on right hand side

Put the Partner Link in the Partner Settings

### Adding Testimonials

To add Testimonials go to Testimonials in WP Admin Panel

Click on New Testimonial

Enter Title, some Description for the Testimonial

Set a Featured Image and customize Testimonial Settings in the bottom

### Adding Portfolios

To add Portfolio, go to Portfolios in WP Admin Panel,

Click on New Portfolio

Add Title, Little Description and Featured Image

Add Name and Portfolio Link in Portfolio Settings at the bottom

Select or add Category for the Portfolio from Category section on the right sidebar

## Visual Composer Usage

Go to pages > Add New and click on Visual Composer to start Visual Composer. see image below.

Now you can see visual composer interface like the image below,

From here click on Add Row, You can add as many rows as you want. Here you will see an icon with single column layout. Bring the cursor over it and other layouts will also appear with different column options. (See in image below)

From click on “+” and start adding elements. (see image below) For each element there are settings there. Do settings of your liking and save the elements options.

## Visual Composer Row Settings

You can pass extra style class to row and set container on/off.

- To set an extra class for a row, press the pencil icon on row (see image below), there you can give that row extra class and you can also set container on/off.

## Creating a Homepage:

To create a homepage go to Pages > Add New

Click on Visual Composer to Start Visual Composer

Select Page Type from drop down as Home in Page Settings. (See Image Below)

Now You Can Build a Homepage using different style elements of Visual Composer, or simply choose a predefined homepage templates from page builder (See Images below).

After adding your required short codes, Update the page.

Now go to Settings > Reading check A Static Page and select your homepage as your front page.

## Home Page

### Medical Homepage 1 | ### Medical Homepage 2 | ### Medical Homepage 3
### Spa Homepage 1 | ### Spa Homepage 2 | ### Spa Homepage 3
### Business Homepage 1 | ### Business Homepage 2 | ### Business Homepage 3
### Fashion Homepage 1 | ### Fashion Homepage 2 |

## Page Templates

There are different page templates for creating pages like Contact Page, Events, FAQs, Frontpage, Descriptive and Modern Portfolio, Services and Team.

Creating a page, say we are going to create a Contact Page

- To create a contact page, go to Pages > New Page and select Contact Page as a Template from Attributes section in right sidebar of wp admin panel.
- You may select other settings like No Sidebar or any sidebar you create or default sidebar, page with title, or page with a header image in the Page Settings at bottom.
- After all these settings simply Update or Publish the page.
- This page will extract values from Contact Page settings in Theme Options.
- Other page templates like Events from Events panel, similarly all other templates from their respective panels in wp admin left sidebar.

## Important Points while using our theme

There are some css classes that you have to pass for our elements to display correctly.

- A “cols” class is used for top spacing of row, also “H2″ tags pick styling from this class
- A “pricing” class is used to apply styling of price tables
- A “boxes” class applies spacing from both top and bottom