Oliver Documentation

Overview of the theme, its contents, and how to get started with the theme

Thank you for purchasing our theme. If you have any questions that are beyond the scope of this help file, you can sign in to our support forums with your Item Purchase Code. And please rate the theme on ThemeForest if you liked it. Thanks so much!

- Pixelwars Team

Support Forums

Any questions that are beyond the scope of this help file, use support forums.

Visit Support Forums

Follow Us

Follow us on ThemeForest and don't miss new upcoming premium themes.

Follow us on ThemeForest

Rate Theme

If you liked the theme you can rate it on ThemeForest in your downloads menu.

Rate on ThemeForest

We assume you have basic knowledge of WordPress. In this doc you will learn how to setup, use and customize the theme.

Install Theme

  • The theme is under Theme folder in the package.
  • Install the theme via WordPress admin panel.
  • Go to: Appearance > Themes > Add New > Upload.
  • Install and activate the theme.

Note: This theme is about 10 MB. Some hosts don't allow to upload over 8 MB. So, if you see an error message for the above way, please try the below ways.

OTHER WAYS TO INSTALL A THEME

Note: This theme uses custom image sizes. If you have images in your Media Library, run Regenerate Thumbnails plugin once. Install and activate the plugin then go to Tools > Regenerate Thumbnails.

Child Theme

Child theme inherits the functionality and styling of the parent theme. Child theme is the recommended way of modifying the parent theme.

  • This package includes a child theme.

Import Demo Data

There are two ways.

Way 1:

Install and activate One Click Demo Import plugin from Appearance > Install Plugins. Then, go to Appearance > Import Demo Data and click on the Import button of a demo.

Way 2:

  • Go to: Tools > Import > WordPress.
  • WordPress might offer you to install the WordPress Importer plugin, if you haven't installed it before do it now.
  • Install and activate the plugin.
  • Once you've installed WordPress Importer plugin, browse to the package folder, select XML data file under Sample Data folder and upload it.
  • Go to: Appearance > Menus. Select theme location for the imported custom menu.

Page Template

This theme has custom page templates you can use for certain pages that have additional features or custom layouts. You can see them in the Template dropdown menu in Page Attributes box of editing screen.

Templates

  • Default Template: This is regular page.
  • Medium width:: This page is larger.
  • Full width: This creates largest pages.
  • Portfolio: Choose to display your portfolio posts.
  • Portfolio Narrow: Choose to display your portfolio posts in a narrow page.
  • Portfolio Full width: Choose to display your portfolio posts in a large page.

Title Visibility

You can hide page title from Title Visibility box in edit screen. This will remove page title text from single viewing.

Featured Image

You can set featured image to a page like in your posts.

Sidebar

You can select sidebar from Sidebar box in editing screen.

Post Formats

Select from Format box in the editing screen.

  • Standard
  • Aside
  • Audio
  • Chat
  • Gallery
  • Image
  • Link
  • Quote
  • Status
  • Video

Specific Formats

CHAT
JOHN: Hey there

MARY: Aye, matey!

JOHN: Huh?

GALLERY

Create a gallery from the "Add Media" button. Make your gallery grid or slider from Gallery Type box in the editing screen.


QUOTE

Use [quote] shortcode.

Example:

[quote align="" name=""]Text here.[/quote]


align="" ... alignleft, alignright

Portfolio Functionality

Portfolio functionality is not activated in the theme by default.

Activate Portfolio

Go to "Appearance > Install Plugins". You can see the built-in plugin Oliver Portfolio in the list. Install the plugin. When you click the "Install" link, it will be installed and activated automatically. Then go to your main dashboard page. Now you can see the "Portfolio" menu under the "Posts".

Portfolio Menu

There are three sub menu under the portfolio menu:

  • Portfolio: You can see all portfolio posts in a list. They are listed by the date. So you can change the publish date from publish box in edit screen to change post order in the table. This will also effect item ordering in your portfolio page.
  • Add New: Create new portfolio items. (see instructions below)
  • Portfolio Categories: You can assign a category to a post in edit screen. Categories appear as filter in your portfolio page. Also you can create multiple portfolio pages with categories. (see instructions below)

Create A Portfolio Post

Portfolio items are similar to blog posts.

  • Go to: Portfolio > Add New.
  • Enter title and set featured image.
  • Assign to a category. This category will be displayed as a filter in your portfolio page.
  • Use "Excerp" field to show a short description under the post title in your portfolio page.
  • Choose post type from "Format" box. (see formats below)
  • Publish your portfolio post. (Edit publish date to change post order)

Portfolio Post Formats

  1. Standard: Add your content to editor. This type of posts go to single view when click in portfolio page.
  2. Image: Displays post featured image in a lightbox.
  3. Gallery: Displays images in a lightbox. Create a gallery from Add Media button above the content editor.
  4. Audio: Displays an audio in a lightbox. Use browser address url of an audio from SoundCloud. Add the url to "URL" field in Featured Video box.
  5. Video: Displays a video in a lightbox. Use browser address url of a video from YouTube or Vimeo. Add the url to "URL" field in Featured Video box.
  6. Link: Enter your custom url to "URL" field in Featured Video box.

Note: You can see a box called "Gallery Type" in edit screen. The type option effects content galleries when you view your portfolio post in individual page.
Note: You can turn on above talked boxes from "Screen Options" panel in upper right side if you do not see them in edit screen.

Portfolio Pages

There are two ways to build one or more portfolio pages.

  1. Portfolio Page Template: For single portfolio page.
  2. Portfolio Category Pages: For different portfolio pages. (see multiple portfolios below)

Make A Portfolio Page (with portfolio page template)

This page shows all published portfolio posts.

  • Go to: Pages > Add New.
  • Enter title.
  • Select "Portfolio" template from Page Attributes box.
  • Publish the page.
  • Add this page to your navigation menu. (Appearance > Menus)
  • Also, you can assign a sidebar to this page from Sidebar box.
  • Also, you can assign a featured area to this page from Featured Area box. (see featured area section for more information about the featured area)

Note: Add some text to content of the page to show it like a message in your portfolio page.
Note: Play with post publish date to change item order in your portfolio page.

Make Multiple Portfolio Pages (with portfolio category pages)

A portfolio category page shows its own published portfolio posts.

  • Go to: Portfolio > Portfolio Categories > Add New Category. (parent category)
  • Create portfolio posts assigned to this category.
  • Add sub categories under this category to filter posts. (assign posts to sub categories)
  • Add this portfolio category to your navigation menu. ("Appearance > Menus > Portfolio Categories". Show "Portfolio Categories" list from Screen Options panel in upper right side.)
  • Every parent category displays its portfolio posts. So you can have different portfolios in your site.

Note: Add some text to description field of a category to show it like a message in your portfolio category page. (Portfolio > Portfolio Categories > Edit > Description)
Note: Play with post publish date to change item order in your portfolio category page.

Portfolio Options in Customizer

Go to: Appearance > Customize > Portfolio.

  • Page Layout: Adjust portfolio page width.
  • Grid Type: Change image size in portfolio page.
  • Grid Post Width: Adjust post width in portfolio page.

Overflow Images in Content

This setting is used in single view of portfolio posts.

Activate Overflowing Functionality

  • Go to: Appearance > Customize > Single Post > Post Media Width.
  • Set to "Overflow" option.

Enable Overflowing For Images

  • Edit images in your content. Align an image as center from display settings.

Portfolio Sidebar

Control portfolio sidebar from Appearance > Customize > Sidebar:

  • Portfolio Category Sidebar: Activate sidebar area for portfolio category pages.
  • Portfolio Post Sidebar: Activate sidebar area for single portfolio posts.

Sidebar for Portfolio Page Template: Adjust sidebar from Sidebar box in edit screen.

Portfolio Widget Area: You can see the Portfolio Sidebar widget area listed in the Widgets page under Appearance menu.

Custom Theme Widgets

This theme has custom widgets.

  • Go to: Appearance > Widgets.
  • Drag and drop widgets to widget areas.

Available Widgets

  • Main Slider: Display your site's posts. Use in the Featured Area.
  • Intro: Show a brief description with an image in the Featured Area.
  • About Me: Show a brief description with an image in the sidebar.
  • Link Box: Make a link with an image in the Featured Area.
  • Social Media Feed: Display your social media feed for available networks.
  • Social Media Icon: Add social media icons for your social media profiles.

Note: Check out Plugins section for "Subscribe" and "Trending Posts" widgets.

Intro Widget

Background Self-Hosted Video: You need to upload one MP4 format video.

Background Embed Video: Use an embed code of any YouTube, Vimeo video.

Example: (Vimeo)

<iframe src="https://player.vimeo.com/video/111529240?autoplay=1&loop=1" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

Note: ?autoplay=1 and &loop=1 are optional.

Use Visual Composer page builder to add shortcode modules. Click to "Backend Editor" or "Frontend Editor" above the content editor.

social_icon

[social_icon type="" same_tab="" url=""]
[social_icon type="" same_tab="" url=""]
[social_icon type="" same_tab="" url=""]


same_tab="" ... yes

type="" ...

facebook, twitter, linkedin, google-plus,

pinterest, github, behance, dribbble, instagram,

lastfm, vimeo, forrst, skype, picasa, youtube, flickr,

tumblr, blogger, delicious, digg, friendfeed, wordpress,

foursquare, xing, soundcloud, slideshare, fivehundredpx,

weibo, stack-overflow, vine, vkontakte, bloglovin, rss


Note: You can use your site's feed url for the rss icon: http://www.yoursite.com/feed/


Example 1:

[social_icon type="facebook" url="http://www.facebook.com/username"]
[social_icon type="twitter" url="http://twitter.com/username"]


Example 2:

[social_icon type="facebook" same_tab="yes" url="http://www.facebook.com/username"]
[social_icon type="twitter" same_tab="yes" url="http://twitter.com/username"]

contact_form

[contact_form captcha="" to="" subject=""]


to="" ... Your email address.

captcha="yes"


Example:

[contact_form to="yourname@example.com" subject="New Message from My Site"]

quote

[quote align="" name=""]Text here.[/quote]


align="" ... alignleft, alignright

timeline

[event_group_title icon="" text=""]
[event current="" date="" title="" sub_title=""]Text here.[/event]
[event current="" date="" title="" sub_title=""]Text here.[/event]
[event current="" date="" title="" sub_title=""]Text here.[/event]


icon="" ... See Icons section.

current="" ... current

skill

[skill title="Fireworks" percent="90"]
[skill title="Photoshop" percent="70"]
[skill title="Illustrator" percent="50"]

testimonial

[testimonial image="" title="" sub_title=""]Description text here.[/testimonial]
[testimonial image="" title="" sub_title=""]Description text here.[/testimonial]
[testimonial image="" title="" sub_title=""]Description text here.[/testimonial]


title="" ... Person's name.

sub_title="" ... Person's job.

image="" ... An image url. Upload your image to your Media Library, then copy its url and use in this parameter.

section_title

[section_title]Title here.[/section_title]

fun_fact

[fun_fact]
An image here.
Heading 4 title here.
[/fun_fact]

service

[service]
An image here.
Heading 4 title here.
Description here.
[/service]

client

[client image="" url=""]

image="" ... An image file url.

url="" ... URL address for client link.

Full-width Images

Edit images in your content. Add full keyword as Image CSS Class to your image from advanced options.

Zoomable Images

Edit images in your content. Add zoom keyword as Link CSS Class to your image from advanced options. And Link To: Media File from display settings.

Parallax Images in Posts

Edit images in your content. Add parallax or parallax half keywords as Image CSS Class to your image from advanced options.

Available icons here. Select your icon from the list. Don't use the prefix pw-icon-. Only use icon name for the icon="" parameter of the shortcodes.

Customizer

This theme supports the live theme customizer. You can customize almost every bit of your site from live customizer.

  • Go to: Appearance > Customize.

Customizer Sections

  • General > Layout: Change content width.
  • General > Fonts: Choose theme fonts for your site.
  • General > Characters: Activate extra character sets for your local.
  • General > Colors: Change theme colors.
  • Site Identity: Upload an image logo for your site.
  • Header > General: Choose header layout.
  • Header > Menu: Change menu style.
  • Footer: Change footer style.
  • Featured Area > General: Change width.
  • Featured Area > Slider: Style options for "Main Slider" widget.
  • Featured Area > Link Box: Style options for "Link Box" widget.
  • Featured Area > Intro: Style options for "Intro" widget.
  • Blog: Choose blog page and archives layout.
  • Single Post: Choose individual post style.
  • Meta > Style: Choose category link style.
  • Meta > Blog Meta: Choose which meta will be displayed in your blog page.
  • Meta > Single Post Meta: Choose which meta will be be disabled in your individual post page.
  • Sidebar: Activate theme sidebar to display widgets.
  • Portfolio: Choose portfolio page layout.
  • Shop: Change item width for shop page.
  • Widgets: Add widgets to sidebars or other widget areas.
  • Menus: Create a custom menu for better navigation.
  • Static Front Page: Set a page to make it your homepage.
  • Additional CSS: Add custom css to make changes in your site.

Bundled Premium Plugins

Go to: Appearance > Install Plugins.

This premium plugin has its own documentation. You can find it under "Plugin Documentation" folder in the package.

Styled Free Plugins

Go to: Appearance > Install Plugins.

  • WP Instagram Widget

    WP Instagram widget is a no fuss WordPress widget to showcase your latest Instagram pics. It does not require you to provide your login details or sign in via oAuth.

  • Top 10 - Popular Posts

    Track daily and total visits on your blog posts. Display the count as well as popular and trending posts.

  • MailChimp for WordPress

    Subscribe your WordPress site visitors to your MailChimp lists, with ease.

  • I Recommend This

    This plugin allows your visitors to simply like/recommend your posts instead of comment on it.

Setting Up WP Instagram Widget

Change photo size option of the widget to set image count in a row.

  • Thumbnail: 12 images.
  • Small: 8 images.
  • Large: 6 images.
  • Original: 4 images.

Setting Up MailChimp for WordPress

  • Go to MailChimp for WP > Forms > Fields,
  • Paste this code to textarea:
  • <p>
       <label>Subscribe your e-mail address and get to know about fresh stuff!</label>
    </p>
    <p>
       <input type="email" name="EMAIL" placeholder="Your email address" required="required">
    </p>
    <p>
       <input type="submit" value="Sign up">
    </p>
    
  • Switch to Appearance tab and select "Inherit from Oliver theme" in "Form Style".

Recommended Plugins

Go to: Appearance > Install Plugins.

  • Regenerate Thumbnails

    Allows you to regenerate the thumbnails for your image attachments. This is very handy if you've changed any of your thumbnail dimensions (via Settings -> Media) after previously uploading images or have changed to a theme with different featured post image dimensions.

  • WPFront Scroll Top

    Allows the visitor to easily scroll back to the top of the page.

  • Selection Sharer

    Medium like popover menu to share on Twitter, Facebook, LinkedIn or by email any text selected on the page.

This theme is ready for localization. We have made every string translatable, use a plugin or an editor.

There is a POT file (oliver.pot) under languages folder in the theme. It contains all theme texts to translate. In here, translation is localization. Localization mean is not only changing words to another language. It is basically changing texts to another texts. For example; if your local is English (en-US) and in the theme there is title text Browsing Category for category archives. You can change it what you want like Posts under Category in your local.

Plugins

Editor

Note: The translation files are located under languages folder in the theme folder.

Update Theme

Before you update, it is best practice to always make a backup of your theme folder.

Download the new theme package from your ThemeForest account.

The theme is under "Theme" folder in the package.

Choose to upload the theme via Envato Market plugin or via WordPress or via FTP.

Update Your Theme via Envato Market Plugin

The Envato Market plugin can install WordPress themes purchased from ThemeForest by connecting with the Envato Market API using a secure OAuth personal token. Once your themes are installed WordPress will periodically check for updates, so keeping your items up to date is as simple as a few clicks.

Update Your Theme via WordPress

  • You need to deactivate your theme in the "Appearance > Themes" section by simply activating a different theme. Once you activate a different theme, you can delete your theme. Don't worry, your content will not be lost. (The translation files are located under languages folder in the theme folder.)
  • Then simply upload the new theme file in the "Appearance > Themes" section.
  • Once it uploads, choose to activate the theme.

Update Your Theme via FTP

There are two ways of getting files onto your site, and once there, changing them.

  1. By using an FTP client.
  2. By using the file manager provided in your host's control panel.
  • Go to "/wp-content/themes/" location and backup your current theme folder by saving it to your computer, or you can choose to simply delete it. Your content will not be lost. (The translation files are located under languages folder in the theme folder.)
  • Retrieve the new zipped theme file from your new ThemeForest download, and extract the file to get the theme folder.
  • Then simply drag-and-drop (Upload) the new theme folder into "/wp-content/themes/" location, and activate the theme in the "Appearance > Themes" section. (Choose to "Replace" the current one if you did not delete it.)