Transcript
Page 1: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

1

Meraki Theme Documentation

Thank You for Purchasing Meraki

Premium WordPress Theme.

First of all a huge THANK YOU for purchasing Meraki. If you have any questions

that are beyond the scope of this help file, please don't hesitate to contact me.

You can also follow me on Themeforest to keep track of all my theme updates

and upcoming themes.

Thanks so much!

CONTACT US

Mail : [email protected]

Website : www.store.multidots.com

Page 2: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

01. First Steps

Before you start playing around with the theme, let's check what you've downloaded so far:

Documentation - That's where you are right now.

SampleData - Import Data to get the exact Site as the Preview Page

Theme - Upload in your project

02. Installation of WordPress

First of all if you are all new to WordPress, I would recommend to learn a little bit about it

before you get started. Here are some nice Resources on how to get started with WordPress.

First Steps With WordPress

FAQ New To WordPress

03. Theme Installation WordPress

1. DOWNLOAD THEME PACKAGE

When purchasing successfully our theme from Themeforest, you will need to download

theme package for your use. To download the package, please login to your Themeforest

account, navigate to "Downloads", click the "Download" button in the left of the theme,

choose "All files & documentation" to download our theme package to your computer

The Full Package includes these following files and folders:

Page 3: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

Documentation folder - Contain this document and other materials

Installation Files folder - Contain all installable files, including theme & plugins

o themes/meraki.zip- WordPress Theme Installation file.

o themes/meraki-child.zip- WordPress Theme Installation file and active it.

Sample Data folder - Contain sample data files

Advanced Custom Fields PRO is required for the theme to work properly

Note: Meraki theme support only "Advanced Custom Fields PRO" because this plugin is

support to "Flexible Content, Repeater" and "Advanced Custom Fields" Free version is not

support meraki theme.

Go to Plugins > Add New to install and activate plugins.

2. INSTALL THEME

Step 1: Use your FTP software to browse to wp-content/themes folder to install

theme or wp-content/plugins folder to install plugins

Step 2: Extract the installation files to their corresponding folders, for example

Meraki.zip and Meraki-child.zip extract and upload to server

Step 3:Theme would be to directly upload the Meraki.zip and Meraki-child.zip file

via WordPress Theme Uploader. browse to Appearance > Themes or Plugins > Installed

Plugins

1. Log into your Word Press backend

2. Navigate to Appearance > Themes

3. Click Install Themes

4. Click Upload

Now you just need to find the “Meraki.zip” and “Meraki-child.zip” in the Upload

folder and hit Install now.

Page 4: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

If you are experiencing any issues during the installation I would recommend to

check out this Screencast by Envato

Step 4: Click the Activate link in Meraki-child

3. INSTALL PLUGINS

Step 1: Install required plugin and active it. in Admin menu Appearance > Install plugins

Step 2:Go to the Installation Files > plugins in folder and copy all plugins.

Step 3: Paste in wp-content > plugins and extract all plugins.

Step 4: Click the Active link ( acf pro, contact form 7, Wordpress Importer, Meraki post types )

Page 5: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

4. INSTALL SAMPLE DATA

Alternatively, you can use traditional way to import data. In /Sample Data/ folder, you can

find there are:

acf-export.json Advance custom fields Settings. Example (Import : Go to the Custom Fields >

Tools )

meraki_dummy_data.xml All Data.

Import Advance custom fields (acf-export.json)

1. Make sure you have installed theme and all recommended plugins

2. Go to Custom Fields > Tools.

3. Upload JSON File for and click Browse... in Import Field Groups section.

4. After Click on Import button

Import all dummy data (meraki_dummy_data.xml)

1. Make sure you have installed theme and all recommended plugins

2. Go to Tools > Import, then click on Wordpress

3. If it is not yet installed before, you have to install it. On the popup window, click on "Install Now"

4. After installed successfully, click Activate Plugin & Run Importer

5. Browse for and click Upload File and Import.

6. After uploaded, the confirmation page appears. Check the Download and import file

attachments option and click Submit

7. When you see message "All done. Have fun!", you will know that the import is done. Note: you

may need to re-import the second time if the data is large. Back to Step 1. until you see the

message below

8. Go to Settings > Reading, set Front page displays to A Static page. Choose Meraki Home page as

Front page

9. Go to Appearance > Menus, choose Header menu as Primary Menu ( Header menu )

Be aware that downloading Dummy Content may take a while, depending on the speed of your internet

connection!

Page 6: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

5. Assign Home page

To assign Home page, please follow these steps:

1. Navigate to Settings--> Reading.

2. Select Front page displays: A static page then chooses Front page from down list page.

3. Click Save to save configuration.

04. Setting up new Pages

Your new Theme comes with some awesome custom page layouts. These layouts can be

used on any page you create to give them some special functionalities. To set up a custom

page layout go to your WordPress Admin Area and navigate to Pages > Add New. Now you

can choose any template you like from the "Page Attributes" on the right side.

Page 7: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

Default Template

Meraki Template

You can select above template from a page sidebar on the right side.

Now user have to set banner so follow this

- In “Add new page” screen that has “Meraki Design” > click on “Add page section”.

( 1 ) BANNER SECTION

This is a Hero Section in this section you can changes background images and main image

Background Image:Background Cover Image Upload or attach image size 1920 X 640

and only allow .jpg, .jpeg, .gif, .png, .tif types

Your Image: Image Upload or attach image size 309 X 445 and only

allow .jpg, .jpeg, .gif, .png, .tif types

Your Name: Enter the title.

Your Designation: Enter the sub title.

Description : Enter the description

Button One Title: Enter the button text EX : "Hire me"

Button One Link: Enter the button URL

Button Two Title: Enter the button text EX : "Download"

Button Two Link: Enter the button URL

Page 8: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki
Page 9: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

( 2 ) ABOUT US SECTION

This is a about section user can change the icon image and also change the text. For the

Social icons image.

Heading: Enter the title

Sub Heading: Enter the sub title

Description: Enter the description

Your Image: Banner Image Upload or attach image size 304 X 304 and only

allow .jpg, .jpeg, .gif, .png, .tif types

Social Icon Label: Enter the social icons title EX : FOLLOW ME

Social Icons: Choose the social icon and enter the social link

Page 10: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki
Page 11: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

( 3 ) SERVICES SECTION

This is a services section user can add the service.

Heading: Enter the heading.

Sub Heading: Enter the sub heading.

Services: Add the service

1. Choose Icon: Choose the icon

2. Title: Enter the title

3. Description: Enter the description

Page 12: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki
Page 13: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

( 4 ) EXPERTISE SECTION

Heading: Enter the title.

Sub Heading: Enter the sub title.

Expertise: Add the expertise

1. Title: Enter the title

2. Percentage: Choose the percentage

( 5 ) EDUCATION SECTION

User can Add and change the education details.

Page 14: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

Heading: Enter the title

Sub Heading: Enter the sub title

Education: Add Education

1. Title: Enter the title

2. Sub Title: Enter the benefits contents

Description: Enter the description

Page 15: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki
Page 16: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

( 6 ) EXPERIENCE SECTION

User can add the experience and link of the section.

Heading : Enter the title

Sub Heading: Enter the sub title

Experience: Choose the fonts color

1. Company title : Enter the title

2. Company sub title : Enter the sub title

3. Description : Enter the description

4. Date : Enter the text ( date or something )

5. Designation : Enter the designation

Page 17: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki
Page 18: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

( 7 ) INTEREST

We can easily add or remove interest for this we have to use below

Heading: Enter the title

Sub Heading: Enter the sub title

Interest: Add Interest

1.Title: Enter the interest

2. Choose Icon: choose the icon

( 8 ) Portfolio

User can add or remove the portfolio form the popup.

Heading: Enter the portfolio title

Sub Heading: Enter the sub title

Portfolio: Add portfolio

Page 19: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

( 9 ) PRICING PLAN

This is a price plans section you can show case your hourly rate.

Heading: Enter Plan Heading

Sub Heading: Enter Plan Sub Heading

First plan :

1. Title: Plan Title Here

2. Sub Title: Plan Sub Title Here

3. Price: Enter Plan Price

4. First Plan Features: Add Plan Features

5. Button Title: Button Title Here

6. Button Link: Button URL Here

Second plan :

1. Highlight Color: Select Highlight Color ( default or custom )

2. Title: Enter Plan Title

3. Sub Title: Plan Sub Title Here

4. Price: Enter Plan Price

5. Second Plan Features: Add second Plan Features

6. Button Title: Button Title Here

7. Button Link: Button URL Here

Page 20: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

Third plan :

1. Title: Plan Title Here

2. Sub Title: Plan Sub Title Here

3. Price: Enter Plan Price

4. Features: Add Plan Features

5. Button Title: Button Title Here

6. Button Link: Button URL Here

Page 21: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

( 10 ) Testimonials

This is a Testimonials section you can show testimonials.

Testimonials heading title: Enter the testimonials title

Sub Heading : Enter the sub title

Choose Testimonials : Add testimonials

Page 22: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

( 11 ) BLOG

We can add blogs with the information text.

Heading : Enter the title

Sub Heading : Enter the sub title

Choose Blog : Add blog

( 12 ) CONTACT FORM

User can use for contact section

Map:

1. Address Label : Enter the text EX : Address

2. Map Address : Enter the address

3. Map Ifram : Enter the address

4. Contact Number Label : Enter the contact number label EX : CALL ME

5. Contact Number : Enter the contact number EX: + 123-456-789-456

6. Email Label : Enter the email label EX: EMAIL

7. Contact Email : Enter the contact email EX: [email protected]

Page 23: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

Form :

1. Form HTML Or Short code : Enter the html or shortcode

Page 24: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

5. MERAKI SETTING

Header And Footer

Logo: Select your logo here

Favicon: Select your favicon here

Footer Text : Write footer text here.

Social

You can add social link for the app and manage it from the above code.

Facebook Link : Enter facebook link

twitter Link : Enter twitter link

linkedin Link : Enter linkedin link

google Link : Enter google link

skype Link : Enter skype link

dribbble Link : Enter dribbble link

pintrest Link : Enter pintrest link

behance Link : Enter behance link

Page 25: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

THEME COLORS

You can changes primary color and hover primary color

Primary Color : Choose the theme primary color

Theme primary Color : Set Theme Primary Color

Header Color : Choose the theme header color

Theme header color : Set theme header color

Body Color : Choose the theme header color

Theme Body Color : Set Theme body Color

Page 26: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

Contact and location

You can add contact form and location map

Contact page title : Enter the page title

Contact page sub title : Enter the sub title

Contact form html or shortcode : Enter the form or shoortcode

Map address : Enter the map address

Map Ifream : Enter the Map iframe

Mobile number : Enter the mobile number

Email id : Enter the email id

Page 27: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki
Page 28: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

Banner settings

You can add banner settings for this theme

Choose Inner Page Banner: Choose the color or image for banner

Custom Settings

You can add custom css and custom js settings for this theme

Custom CSS Code : Paste your CSS snippet here.

Custom JavaScript Code : Paste your Custom JavaScript snippet here.

Google Analytic Code : Paste your Google Analytic snippet here.

Page 29: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

6. Elements page

Heading tags

Meraki theme use 7 heading tags with class and without class below example:

Page 30: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

H1 : <h1>This is H1 heading</h1>

H2 : <h2>This is H2 heading</h2>

H3 : <h3>This is H3 heading</h3>

H4 : <h4>This is H4 heading</h4>

H5 : <h5>This is H5 heading</h5>

H6 : <h6>This is H1 heading</h6>

List Types

Meraki theme use 3 types of list types.

Unordered list

Example with output

<ul>

<li>List Item 1</li>

<li>List Item 2</li>

<li>List Item 3

<ul>

<li>Nested list item 1</li>

<li>Nested list item 2</li>

<li>Nested list item 3</li>

</ul>

</li>

<li>List Item 4</li>

<li>List Item 5</li>

</ul>

Page 31: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

Ordered list

<ol>

<li>List Item 1</li>

<li>List Item 2</li>

<li>List Item 3

<ol>

<li>Nested list item 1</li>

<li>Nested list item 2</li>

<li>Nested list item 3</li>

</ol>

</li>

<li>List Item 4</li>

<li>List Item 5</li>

</ol>

Page 32: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

Table

<table>

<tbody>

<tr>

<th>Table Head 1</th>

<th>Table Head 2</th>

<th>Table Head 3</th>

</tr>

<tr>

<td>Division 1</td>

<td>Division 2</td>

<td>Division 3</td>

</tr>

<tr class="even">

<td>Division 1</td>

<td>Division 2</td>

<td>Division 3</td>

</tr>

<tr>

<td>Division 1</td>

<td>Division 2</td>

<td>Division 3</td>

</tr>

</tbody>

</table>

Page 33: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

Buttons

'e_btn' class is use for button and use this <a class="e_btn"

href="#">Button</a>

'e_btn fill_btn' class is use for button and use this <a class="e_btn

fill_btn" href="#">Button</a>

Page 34: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

Form Controls

<form class="comment-form">

<div class="row">

<div class="col-sm-12 pad-bottom-bigger form-item">

<input name="Name" type="text" placeholder="Your Name" />

</div>

<div class="col-sm-12 pad-bottom-bigger form-item">

<input name="Subject" type="text" placeholder="Subject" />

</div>

<div class="col-sm-12 pad-bottom-bigger form-item">

<input name="Email" type="email" placeholder="Email" />

</div>

<div class="col-sm-12 form-item"></div>

<div class="col-lg-5 col-md-5 send-btn">

<input type="submit" value="SEND MESSAGE" />

</div>

</div>

</form>

Page 35: Meraki Theme Documentation - The DotStore · Meraki Theme Documentation Thank You for Purchasing Meraki Premium WordPress Theme. First of all a huge THANK YOU for purchasing Meraki

Thank You


Recommended