General Setup

Installation

To install the Purpose theme you must first have a working WordPress(.org) installation. For information on installing WordPress, please see Installing WordPress, from the WordPress Codex. Once WordPress has been setup in your hosting environment, you can install your theme one of two ways:

FTP upload: Download and un-zip your theme folder, and using the FTP program of your choice upload the theme folder to the ‘../wp-content/themes/’ folder on your server.

WordPress dashboard: Download your theme and sign into your WordPress dashboard (e.g., yourdomain.com/wp-admin). Navigate to Appearance > Themes > Add New > Upload, and select your zipped theme folder, click “Install Now“. Once the theme is uploaded you will need to activate it, either with the provided link or under Appearance > Themes.

Note: If you use Safari as your primary browser you may find that your theme folder is not zipped after downloading it. You will need to re-compress your theme folder before proceeding with the second installation process.

Theme License

A theme license is what allows you to have access to ongoing theme updates. By applying the theme license, you will see automatic notifications for all future theme updates in the Appearance > Themes section of the dashboard – this makes updating the theme very easy! If you have not yet applied a license key to your site, please do so by logging into your www.organicthemes.com account and navigate to the Account > Licenses page in order to retreive the theme license. Copy the license key and apply it within the WordPress dashboard section under Appearance > Theme License. Paste the license key in the license field, and click the “Save Changes” and then “Activate License” buttons.

Plugins

The contact form in our demo is powered by Gravity Forms, an excellent premium WordPress contact form plugin. There are also may free alternatives, such as ‘Contact Form 7’ and ‘Jetpack Forms’. Our themes are compatible with most form plugins.
If you want to make use of the shop portion of the theme you will need to install WooCommerce. Please see WooCommerce documentation for help with using WooCommerce: http://docs.woothemes.com/documentation/plugins/woocommerce/

We highly recommend installing the Organic Builder Widgets plugin for use with our themes. This plugin offers a highly customizable “Organic Custom” page template, which works as a page builder, allowing you to add any combination of widgets to your pages in case you’d like to create a custom page. We offer both a free and premium version of the plugin. Click here for more information on the Organic Builder Widgets plugin.

Demo Content (Optional)

You can install the theme demo content to be used as a guide with the .xml file available for download below. Please refer to the following tutorial for instructions on installing your demo content: Installing Demo Content

Download Demo Content

Settings

To replicate the homepage as shown in the demo you will need to first create a page and assign the “Home” page template to it. The theme demo homepage uses “A Static Page” setting, within the WordPress dashboard’s Settings > Reading tab. Here, you’ll need to set your home and blog pages within the dropdown menus under the top “Your Homepage Displays” section. See our ‘Reading Settings‘ tutorial for more information.

Image Dimensions

Theme defined image dimensions are as follows (these can be found in the ‘Theme Setup’ function at the top of your functions.php file):

Purpose Featured Large: 2400x1600px
Purpose Featured Medium: 1800x1200px
Purpose Featured Small: 960x960px
Purpose Featured Square: 720x720px

Logo

You can add a logo to your site within the customizer’s “Site Identity” tab. Here, you can also set your Site Title and Tagline. Before uploading your logo image, we recommend saving the image as a PNG file, and using no larger than 1080×180 pixels as a general guideline for image size.

The Purpose Theme main menu style transitions to a fixed white bar once you begin scrolling down the page. For this reason, we give the option to add a light logo (to display on dark menu), and also a dark logo (to display on light menu). Some logo designs work universally, so it is not always necessary to add both a Logo Light and Logo Dark.

Main Menu

You can setup and manage your main menu under Appearance > Menus, in your WordPress dashboard. Please see the “Main Menu” section in our “WordPress Custom Menu” tutorial for detailed instructions on how to setup a main menu on your site.

Social Menu

You can setup and manage your social menu under Appearance > Menus, in your WordPress dashboard. By default, this theme displays the social media menu within the footer section throughout the site. Please see the “Social Menu” section in our “WordPress Custom Menu” tutorial for detailed instructions on how to setup a social menu on your site.

Widgets

The Purpose Theme includes a few different widget area options. Widgets can be added within the Appearance > Widgets section of the dashboard. Simply drag and drop widgets from the left side into the respective widget area tabs on the right. The following widget areas are included with the Purpose Theme:

  • Default Sidebar – displays widgets in a right sidebar on pages with the “Default” page template applied.
  • Blog Sidebar – displays widgets within a right sidebar on only the blog page only.
  • Post Sidebar – displays widgets within a right sidebar on posts only.
  • Left Sidebar – displays widgets within a left sidebar on pages using the “Three Column” page template.
  • Footer Widgets – displays a section of widgets at the bottom of your page (between page content and footer).
  • Shop Sidebar – displays widgets in a right sidebar on the shop page only.

Note: The only exception to adding widgets within the Appearance > Widgets area is when using the Organic Builder Widgets. Organic Builder widgets should be added within the customizer only, and not the “Widgets” area within the dashboard. Adding widgets in the improper location may cause functional errors within the widgets.

Homepage Setup

Featured Header

You can upload a header image or video of your choice under Appearance > Header in your WordPress dashboard, or within the customizer under Appearance > Customize > Header Image. The header image or video will be added at the top of the homepage. You can display text within the header area, as seen in the demo’s homepage, by adding text in the “Excerpt” area within the page that has the “Home” template applied to it – the page set as your Front Page (see “Settings” section above).

Note: Due to WordPress limitations, header videos will not display on mobile, so make sure to also apply a header image as a default for mobile devices.

Featured Slider

You can choose a post category to be displayed in the homepage header featured slider area under Appearance > Customize > Home Page > Featured Slideshow Category, instead of a fixed header image. The featured slider for the Purpose theme can display slides in various layouts using Post Formats. When adding a Standard post format to be displayed in the featured slider, you must manually add content to the post Excerpt in order for the content to be displayed on the slide. More information on setting up the featured slider can be found here.

Featured Pages

The first Featured Page under the header will automatically display as the “Home” page, which was set within your Reading Settings as your homepage (see “Settings” section above). Up to 3 additional Featured Pages may be displayed on the homepage under Appearance > Customize > Theme Options > Home Page. Select the pages from the dropdown menus (Featured Page One, Two, & 3). When a Featured Image is added to a featured page, the image will be displayed as the background, and the content on top will be white.

*The “What We Do” section on the homepage was created as a normal page, using the Column block within the Gutenberg editor.

Featured Posts

The featured posts section displays the most recent posts of a chosen category on your homepage. You can see an example of this in the “Our Latest News” section on our demo homepage. You can select a featured post category to display under Appearance > Customize > Theme Options > Home Page > Featured News Category. You can also select the number of posts to display in the “Featured News Posts Displayed” option below.

Page Templates

Full Width

This template allows you to display page content or text body at full width. See an example here.

Portfolio

This template allows you to create a collection of posts. You can view an example here in our demo. The Portfolio page template displays posts in either one of two ways:

  • Using the Portfolio “Projects” custom post type, provided by the Jetpack plugin (although the Jetpack plugin is not necessary to use the Portfolio page template). If using this Jetpack custom post type, these “Projects” posts will automatically display within your Portfolio page.
  • Using a selected post category within Customize > Theme Options > Portfolio > Portfolio Template Category. If you’re not using Jetpack custom post types, you will have the option to select a post category to display within the “Portfolio Template Category” dropdown menu here.

Slideshow

An image slideshow can be added to the top of a page using the Slideshow page template. See an example here.
If using the classic editor: Within the page editor, add a gallery by selecting Add Media > Create Gallery. Select your images, then click the blue “Create A New Gallery” button.

This screenshot displays how to add a slideshow gallery within the classic WordPress editor.

If using the Gutenberg editor: You will need to add the slideshow gallery by using the Shortcodes block, and listing the image ID numbers within the shortcode. You can find the image number by selecting “Media” in the dashboard, then clicking on an image. The number displayed within the URL at the top is the image number. The following Codex page explains the Gallery Shortcode in greater detail: https://codex.wordpress.org/Gallery_Shortcode. It should look like this:

This is an example of a Gallery Shortcode within a Shortcode block, using the Gutenberg editor.

Split Content

This page template displays your Featured Image in full length on the left half of the page, and your text content to the right half of the page. View an example here.

Three Column

This template displays three columns of content: a left sidebar, main page content, and a right sidebar. A page using this template displays the “Left Sidebar” and “Page Sidebar”, which both are set under the Appearance > Widgets section in the dashboard. View an example in our demo here.