“Organic Shop” Documentation by “Quite Nice Stuff” v2.5.9
“Organic Shop”
Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!
Table of Contents
- Installation
- Getting Started
- Shortcodes
- Accordion
- Buttons
- Columns
- Drop Caps
- Google Map
- List
- Alert Message
- Tabs
- Toggle
- Video
- Title
- Theme Options
- Adding Content
- Page Templates
- Blog
- Contact Us
- Testimonials
- Online Shop
- Credits
A) Installation - top
If you haven't done so already you need to install Wordpress on your webserver, for details of how to do this go to The Wordpress website.
Unzip the file you downloaded from Themeforest and there will be a folder inside called "organic_shop", this contains a zip file with your new theme. You can install it in one of two ways, either via FTP or the Wordpress admin panel.
To install it via FTP
- Login to your server via FTP
- Browse to "wp-content/themes" and upload the zip file here
- Login to the Wordpress admin panel
- Go to "Appearance > Themes"
- Click "Activate"
Alternatively to install via the Wordpress admin panel
- Login into the Wordpress admin panel
- Go to "Appearance > Themes"
- Go to the "Install Themes" tab
- Click "Upload"
- Click "Choose File" or "Browse" (dependant on what browser you are using) and select the zip file in the Specialist folder mentioned above
- Click "Install Now"
- Click "Activate"
B) Getting Started - top
Import Dummy Data
Some dummy data has been included to help you get started, its not identical to the demo site but hopefully it'll give you a general idea of how things work. If you run into any problems replicating something you've seen on the demo site feel free to send me a message via my user page on ThemeForest, I'll be more than happy to help.
- Note: you should install the WooCommerce plugin first before importing dummy data, see the "Installing the WooCommerce Plugin" steps below
- Next you need to install the WordPress Importer Plugin
- Now go to "Tools" > "Import" > "WordPress" and select the "organicshop.wordpress.2012-09-03.xml" file from the "Import Data" folder
- Next go to "Appearance" > "Theme Options" and click on the "Backup Options" tab. Now open the "theme-options.txt" file also found in the "Import Data" folder and paste the contents into the "Transfer Theme Options Data" field and click "Import Options" then click "Save"
- Go to "Appearance" > "Menus", for the Primary Navigation select "Main Menu"
Installing the WooCommerce Plugin
This is a fairly essential, Organic Shop uses the WooCommerce plugin for all the eCommerce features of the theme, the plugin does not come packaged with the theme but is free to download here. WooCommerce has a very thorough guide online which you can view here.
Add your Logo
- Go to "Appearance > Theme Options"
- Click on the "General Settings" Tab
- In the area labelled "Image Logo" click "Upload" and find your logo
- Click "Use This Image"
- Click "Save Options"
- If you don't have a logo tick the box labelled "Text Logo"
Set a Colour Scheme
- Go to "Appearance > Theme Options"
- Click on the "Styling Options" Tab
- Set the colours you want to use in the various fields
- Click "Save Options"
Add a Contact Form Email Address
- Go to "Appearance > Theme Options"
- Click on the "Contact Settings" Tab
- In the area labelled "Contact Form Email" enter your email address
- Click "Save Options"
C) Shortcodes - top
C.1) Accordion
[accordion]
[panel title="The Title"]...[/panel]
[panel title="The Title"]...[/panel]
[panel title="The Title"]...[/panel]
[/accordion]
C.2) Buttons
[button type=small link_url="http://google.com"]...[/button]
[button type=medium link_url="http://google.com"]...[/button]
[button type=large link_url="http://google.com"]...[/button]
[button background_color="#000" text_color="#fff" link_url="http://google.com"]...[/button]
C.3) Columns
There are 2, 3 and 4 column layouts to pick from. For the last column in the row you should add "-last" to the tag, see below for an example
[columns]
[one_half]...[/one_half]
[one_half_last]...[/one_half_last]
[/columns]
[columns]
[one_third]...[/one_third]
[one_third]...[/one_third]
[one_third_last]...[/one_third_last]
[/columns]
[columns]
[one_forth]...[/one_forth]
[one_forth]...[/one_forth]
[one_forth]...[/one_forth]
[one_forth_last]...[/one_forth_last]
[/columns]
C.4) Drop Caps
[dropcap]...[/dropcap]
C.5) Google Map
[googlemap width="100%" zoom=14 latitude="51.523728" longitude="-0.079336"]
Shortcode Options
- width: Any px or % value
- height: Any px or % value
- maptype: ROADMAP, SATELLITE, HYBRID, TERRAIN
- zoom: Zoom value from 1 to 19
- marker_html: HTML to be displayed in the marker popup
latitude and longitude, use this website to find out the correct values for your location: http://itouchmap.com/latlong.html
C.6) List
[list type="arrow"]
[li]...[/li]
[li]...[/li]
[li]...[/li]
[/list]
Shortcode Options
- type: circle, arrow, cross, tick or just use [list] without type specified to use a standard bullet point style
C.7) Alert Message
[msg type=default]...[/msg]
Shortcode Options
- type: default, notice, success, fail
C.8) Tabs
[tabs_container]
[tab title="..."]...[/tab]
[tab title="..."]...[/tab]
[tab title="..."]...[/tab]
[/tabs_container]
C.9) Toggle
[toggle title="..."]...[/toggle]
C.10) Video
[video type=youtube id=PwdA0uOmrzM hd=false width="100%" height="215px"]
[video type=vimeo id=4090686 hd=true width="100%" height="215px"]
Shortcode Options
- type: youtube or vimeo
- id: video id
- hd: true or false
- width: Any px or % value
- height: Any px or % value
C.11) Title
[title]...[/title]
C.12) Photo Gallery
[gallery]
Shortcode Options
- columns: between "1" and "9"
D) Theme Options - top

All the theme options contain a pretty good explanation so it's not necessary to repeat them here. To access the theme options go to "Appearance > Theme Options".
E) Adding Content - top
E.1) Page Templates
This theme comes with a collection of page templates, to use them create a new page (Pages > Add New) and then use the drop down menu labelled "Template" on the right side of the page. The templates available are:
- Default Template
- Blog
- Contact Us
- Full Width
- Homepage
- Left Sidebar
- Right Sidebar
- Testimonials
E.1.1) Blog
Theres not much to explain here, set the blog as the page template and it will display all posts in blog format!
E.1.2) Contact Us
Set the email address the form sends to by going to "Appearance > Theme Options" and then click on the "Contact Settings" tab and entering the email in the field labelled "Contact Form Email".
E.1.3) Testimonials
How do I get testimonials to appear on the homepage?
- Go to "Appearance > Theme Options > Home Settings" and enter the IDs of the testimonials you wish to display in the "Testimonial IDs to Display on Homepage" field
- Where do I find the testimonial IDs? go to "Testimonials > Testimonials", then hover your mouse over a testimonial in the list, some options will appear, click "Edit", then look in the web browser address bar, it will look something like this: http://website.com/wp-admin/post.php?post=33&action=edit, "33" is the testimonial's ID
E.2) Online Shop
Below are some frequently asked questions:
I've just installed the theme, where are all the shop/ecommerce features?
Please see the "Getting Started > Installing the WooCommerce Plugin" section of the documentation
How do I get shop items to appear on the homepage?
- Go to "Appearance > Theme Options > Home Settings" and make sure "Display Featured Products" is ticked
- Now go to "Products > Products", find the product in the list you'd like on the homepage and hover over it, some options will appear, click "Quick Edit" the tick "Featured", then click "Update" to finish
On the product single page I want to display more than one image for the product, is this possible?
- Yes, when you add the product you will have the option of uploading images by clicking "Upload/Insert" above the big post body field, you can keep on uploading as many images as you like here, the one you set as the "Featured Image" will be displayed on the product listing page and big the big main image on the product single page
I want to add attributes to a product such as size, colour etc so that customers can pick this when purchasing, is this possible?
Yes it certainly is, you can add a custom drop down selection box for any kind of attribute you want with as many options as you like.
- First go to "Products > Add New"
- Scroll down and just below the main body text field is a field labelled "Product Data", select "Variable Product" from here
- Now click on the "Attributes" tab found just below in the same area, and click "Add"
- Add the attribute name such as "Size" or "Colour" then add your options in the big box to the right, separating them like so: S | M | L | XL
- Its important that you untick "Visible on the product page" and tick "Used for variations"
- Click "Publish"
- Now click the "Variations" tab and select one of the options you added from the "Default selections" drop down, for example if you added "Sizes" and one of the sizes is "S" pick this, click "Add Variation" then fill out the details such as stock, price etc.
- You can click "Add Variation" as many times as you like, for example if you have "S, M, L and XL" sizes you'll need to do it 4 times.
- Click "Update" to finish
- It's also worth checking the following guide which explains the above in detail with screenshots: http://wcdocs.woothemes.com/user-guide/product-variations/
F) Credits - top
I'd like to thank the people below for providing awesome resources.
Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.
Quite Nice Stuff
Go To Table of Contents