Quick Start Guide

In this tutorial we will provide instructions for using your theme’s home and page templates.

Reference:
Page Templates (WordPress Codex)
Using Page Templates (Organic Themes Tutorial)
Appearance Menus Screen (WordPress Codex)

Setting the ‘Home’ page template
  1. Navigate to Settings > Reading, and select the ‘Your latest posts‘ option. This will set the home page template as seen in your theme’s demo.
  2. Once set, navigate to Appearance > Theme Options (Appearance > Customizer in newer themes) to begin configuring your home page.
Setting the ‘Full Width’ page template
  1. Navigate to Pages > Add New, and create a new page.
  2. From the ‘Page Templates‘ drop-down menu, select the ‘Full Width‘ page template option. Save and publish.
  3. Navigate to Appearance > Menus to add your full-width page to your (custom) menu.
Setting the ‘Blog’ page template
  1. Navigate to Pages > Add New, and create a new page.
  2. From the ‘Page Templates‘ drop-down menu, select the ‘Blog‘ page template option. Save and publish.
  3. Navigate to Appearance > Theme Options (Appearance > Customizer in newer themes) to configure your blog page.
  4. Navigate to Appearance > Menus to add your blog page to your (custom) menu.
Setting the ‘Portfolio’ page template
  1. Navigate to Pages > Add New, and create a new page.
  2. From the ‘Page Templates‘ drop-down menu, select the ‘Portfolio‘ page template option. Save and publish.
  3. Navigate to Appearance > Theme Options (Appearance > Customizer in newer themes) to configure your portfolio page.
  4. Navigate to Appearance > Menus to add your portfolio page to your (custom) menu.

Note: For themes with a filterable portfolio, the filters are sub-categories of the category set in step #3. For example, you could set a category such as ‘Portfolio’, then create sub-categories as filter options: ‘Photography’, ‘Illustration’, ‘Oil’, and so forth.

Using the ‘Slideshow’ page template
  1. Navigate to Pages > Add New, and create a new page.
  2. From the ‘Page Templates‘ drop-down menu, select the ‘Slideshow‘ page template option.
  3. To add images to your slideshow, click the ‘Add Media‘ button to the top-left of the page editor. Using the media uploader, upload your desired slideshow images. Note: Images must be uploaded because of the way the slideshow template is setup, which means that you cannot choose previously uploaded images from the media library unless you were to use a plugin such as Attachments.
  4. Navigate to Appearance > Menus to add your portfolio page to your (custom) menu.

How To: Install Theme Demo Content

By default, a WordPress theme does not include pre-installed content. However, if you would like to install your theme’s demo content to be used as a guide, you can do so by following these instructions.

Note: We do not recommend this if you have existing content in your WordPress installation, as it will add numerous posts, pages, categories, media and more to your site. Also, we recommend replacing all content as soon as possible to avoid negative SEO effects or image licensing repercussions.

Reference:

Importing Content (WordPress Codex)
Organic Themes Quick Start Guide

  1. Access your Organic Themes documentation page here.
  2. Download the file link called ‘Download Demo Content’ under the documentation page of your theme.
  3. Once downloaded, unzip the file you are provided. If you are using Safari’s default settings, the file will be unzipped automatically.
  4. Log into your dashboard and navigate to Tools > Import, and choose the ‘WordPress‘ importer.
  5. When prompted, upload your demo content .xml file.
  6. After you have initiated the demo content upload, you will be asked to assign or create a new author for your demo content — this is your choice. You will also be given a checkbox option to ‘Import File Attachments‘. Please do not check this box as the images in the demo are not licensed for distribution.
  7. Once imported successfully, navigate to Appearance > Theme Options (Appearance > Customizer in newer themes) and configure your content
  8. That’s it, enjoy!

If you wish to remove the demo content after installing it, you could use a solution such as the WordPress Reset plugin. Note: Using this plugin will delete ALL content within your WordPress installation. So use this plugin at your own risk.

How To: Change Link And Highlight Colors

Note: Most of our themes contain options for changing link and highlight colors within the Appearance > Theme Options. This tutorial is for older versions of our themes that require changing the colors within the stylesheet.

In this tutorial I will explain how to replace the current theme link and highlight colors with a color of your choosing. This can be accomplished using a “Find and Replace” method, which is available in most text editors and web development software.

Organic Themes are designed with a single link and highlight color. This makes changing the link and highlight colors within our themes a relatively simple customization. However, you will need to edit the stylesheet and have a basic understanding of web colors to accomplish this tutorial.

Colors are applied within a stylesheet as Hex Codes — a combination of 6 letters and numbers that make up the color, such as #FF3300. The Hex Code of your desired color can be found using most image editing and design software. If you do not have any image editing software, you can use an online color generator to select your color.

An example of what the WordPress appearance editor should like with the stylesheet displayed.

With this basic understanding of web colors, we can begin the tutorial:

  1. Open your stylesheet by navigating to the Appearance > Editor within the WordPress admin.
  2. Copy all the code from your stylesheet.
  3. Paste the code in to a text editor or program such as TextEdit, Word or DreamWeaver.
  4. Save the unedited stylesheet to your computer as a backup, in case something goes wrong.
  5. Find the current link color within the theme. This can be accomplished by scrolling through the stylesheet until you see a style similar to this (The Hex Code will vary depending on the theme):
    a {
    color: #FF3300;
    text-decoration: none;
    }
  6. Highlight the Hex Code within your editing program.
  7. Choose the Find and Replace option, and replace all instances of the existing Hex Code, with your desired color.
  8. When all color codes have been replaced, copy and paste the updated stylesheet back in to WordPress.
  9. Save the changes.
  10. Refresh your site.

Note: Some of our themes may require the editing of a couple image files within the images folder of the theme to ensure that all colors have been changed.

How To: Change Your Theme Favicon

Favicons are the small icons for your website that are typically displayed in your web browser.

All Organic Themes contain a leaf favicon. Favicons can be created using various image editing software. Easier solutions involve generating a favicon from an image using a website such as this, or creating your own favicon using Faviconer. If you would like to change the favicon of your theme, follow these instructions:

  1. Log in to the server of your site using an FTP client such as FileZilla, or within your hosting options.
  2. Locate the images folder within your themes directory. The path should be similar to wp-content > themes > organic_theme > images.
  3. Upload your favicon.ico file in to the images directory, overwriting the existing favicon file.
  4. You’re done!

In addition, there are several WordPress plugins available for changing your favicon. A list of available plugins may be found here.

Note: Favicons are registered deep in your browsers cache. So you may not see the change right away unless your browser cache is cleared and/or restarted.

Reference: Using Page Templates

Select a template from the Page Attributes.

All Organic Themes include a variety of Page Templates. Templates are used to display content differently on a page. Some common page templates included with an Organic Theme are a blog template, portfolio template, archive template and full width template.

Each Page Template serves a unique purpose. We have outlined the purposes for some common page templates found within our themes:

Archive — Display your site archives including posts, pages and categories. Can be used as a sitemap.

Full Width — Display a full width page without any sidebars.

Blog — Display posts from a category selected within the theme options.

Portfolio — Display posts with Featured Images from a category in the theme options.

Page Templates are applied within the Page Attributes section of the page editor. Templates can also be applied within the Quick Edit options as seen below.

To make it easier, page templates can also be applied in the Quick Edit options.

Note: Available Page Templates do vary with each theme.

SAVE 20% On All Organic Themes This Holiday Season! Use Discount Code "HOLIDAYS20" At Checkout!

Error: Please enter a valid email address

Error: Invalid email

Error: Please enter your first name

Error: Please enter your last name

Error: Please enter a username

Error: Please enter a password

Error: Please confirm your password

Error: Password and password confirmation do not match