Oyster Photo WordPress Theme

• By: Mad_Dog
• themeforest.net/user/mad_dog
• Support Forum: http://forums.gt3themes.com

Thanks for purchasing this theme. If you have any questions that are beyond the scope of this help file, please feel free to submit your request to my support forum. Also you can find a lot of useful information right there. Thanks so much!

Theme Installation

There are several ways to install wp themes, we do prefer using FTP but you can choose other ways. Please read more about theme installation on the official website at http://codex.wordpress.org/Using_Themes

• please unzip the installable zip file that you downloaded from ThemeForest (oyster.zip);
• upload "Oyster" theme folder to the theme directory of your WordPress via ftp;
• log into your WordPress admin dashboard and activate "Oyster" theme in the Appearance => Themes section;

Note, Oyster theme contains built-in GT3 Page Builder. You don't need install the plugin. It will be activated automatically on the pages and posts sections after theme installation.

Theme Options Panel Overview

This theme comes with its own theme options panel. You can manage general theme settings panel. Let's review it:

• General: right there you can upload your own logos, put custom css, import sample data, put your google analytics code etc;
• Sidebars: create unlimited custom sidebars;
• Fonts: the themes uses google web fonts. Please choose the desired font from the drop down menu for content fonts, typograpy H1, H2, H3, H4, H5,H6;
• Socials: the full list of available social link;
• Contacts: your contact info details;
• View Options: adjust theme view options (site width, responsive, theme layout etc);
• Light Skin Colors: adjust theme color options (header background color, header border color, slogan color options, menu, footer colors etc) for the light theme version.
• Dark Skin Colors: adjust theme color options for the dark theme version.

Import Demo Content

To import the demo content, please go to Oyster theme options panel => General section and at the very bottom there is "Import demo content" button, please click it. It may take several minutes to import the entire demo content.

• If the demo content was not imported (the standard export/import .xml option is used in the theme), it means that there is a server side issue or our demo page is not accessible via http (you can check the demo on our site or via ThemeForest).
  Sometimes, the content can't be downloaded from external site to your wordpress content folder because of the folder permissions, server configuration, temporary site URL etc. In this case, we recommend you to contact your hosting provider regarding this issue.
• During the sample data import, some images won't be imported, in the galleries. You will get the empty image placeholders. Please remove them and add your own images to the galleries.

Theme Layout Settings

The theme has the options which allow you to change it.

The skin of the theme. You can select dark or light skin. To change the style, please go to Theme Options Panel => View Options section. Use "Default skin" to change the parameter.

The menu position. You can change the menu position, please go to Theme Options Panel => View Options section. Use "Menu state" to change it.

Please note that if you want to have a custom layout for the certain page, you can do that using the custom layout option on the page.

Theme Color Settings

You can easily change the colors of the main elements like header, slogan color, footer items colors etc. Please review the Light Skin Color and Dark Skin Colors section in your Theme Options Panel.

Theme Menu Activation and Front Page Settings

1. To activate main and footer menu: Please go to Appearance => Menus => Manage Locations and choose from the drop down list "Main" and select the Footer menu from the proposed menu items, click save changes.
After that, you can edit your menu items in the "Edit Menus" tab.

2. Set the page for the front page: Please go to Settings => Reading => Front page displays -> A static page (select below) set the page for the front page and save changes.

Custom Logo Setup

To change the current existing logo, please go to Theme Options Panel => General section. Use the "upload image" option to upload your own logo. Once the logo is uploaded, please put its height and width to the required fields.
Taking into consideration the fact that this theme is retina ready, you have to upload your logo in 2 sizes bigger to look great on tablet and mobile devices. For example, if your site logo is 200x100, the retina version will be 400x200.

GT3 Page Builder Modules

This WordPress theme comes with the built-in GT3 Page Builder section, which allows you to create custom page layouts with ease.

You don't need to install GT3Page Builder plugin. Here is the brief overview of all available page builder modules.

• Accordion - add simple accordion style with collapsible components;
• Before & After - add an image with before/after effect;
• Blog - display standard style blog to the page;
• Blog Posts - display blog posts from different categories;
• Blog- Masonry - display masonry style blog to the page;
• Content - display entire content available in the visual editor;
• Divider - add divider to separate module blocks;
• Gallery - display gallery from existing gallery list;
• Google Map - add simple google map;
• HTML - add any HTML code or shortcode to display on the page;
• Heading - add simple heading;
• Icon Box - add content block with the icon;
• Icon List - add icon list with the text link option;
• Javascript - add javascript code to run on the page;
• Message Box - add different message box types;
• Partners - display the partners logos from existing list;
• Portfolio - add non-ajax portfolio to the page;
• Portfolio Posts - display portfolio posts from different categories;
• Price Table - add simple and advanced price table;
• Progress Bar - add advanced and flexible progress bar;
• Promo Text - add special promo text with call to action button;
• Sitemap - add simple sitemap;
• Slider - add any slider plugin that uses shortcodes;
• Tabs - add tabbed content area;
• Team - display selected team members from existing list;
• Testimonials - display the selected testimonials from existing list;
• Text Area - add simple text area;
• Toggle - add simple toggle style with collapsible components;
• Video - add vimeo or youtube video.

Page Templates

The theme has custom templates for creating non-standard pages. We present a list of templates you can use for the theme.

• Please go to Pages => click create a new Page or edit the required one=> on the right you can see "Page Attributes section".

Striped Page

The template displays a page with the horizontal and verticals sections. It spans the whole screen to create a striping effect as the user scrolls the pages.

• Please select the Layout style you want display on the page: Veritcal or Horizontal.
• Indicate the number of stripes you want to show.

Fullscreen Slider

• Fullscreen Slider is a template that allows to create a page slider with fullscreen images.
  Please select the Fit style option from the list: Cover slide, Fit Always, Fit Horizontal, Fit Vertical;
  It has back, pause, next navigation that makes easy to view gallery works on the screen.

Gallery Flow

• This template helps to create a slider with images in a flow.
  It displays all images, sliding it with special effect.

Gallery Kenburns

• This is special fullscreen slider template.
  It displays every image separately, sliding it with automaticall zoom effect using transition.

Gallery Grid

• Gallery Grid template allows to display a gallery in preset layout.
  Grid units are the primary locations on a page where the gallery images will be placed.

Gallery Masonry

• The template works by placing gallery items in optimal position, sort of like a mason fitting stones in a wall.
  Display a gallery in a popular manner by selecting the following template. Masonry style can maximize the efficiency of galleries containing items with varying height

Gallery Photo Listing

• The template works by placing gallery items in optimal position, using masonry style layout.
  It works as the previous one described above, but you will see the difference in elements placement.

Gallery Ribbon

• The Gallery Ribbon is a template which contains a list of elements, it displays a collection in the Ribbon.
  You can move images using special navigation.

Portfolio Grid Style 1

• Display Portfolio Posts listing in a grid layout style. The Portfolio posts featured images will create grid layout on a page.
  Every item is clickable, it will redirect you to a post page.

Portfolio Grid Style 2

• It's the second type of grid style template. It displays Portfolio Posts listing in a grid layout too. The featured images displays without gaps on a page.
  

Portfolio Masonry Style

• This template uses popular masonry style to display Portfolio posts featured images in a flow without empty spaces.
  It's a good choise if you want to show Portfolio using a creative layout. It perfectly responds to various mobile devices screen resolutions.

Portfolio Masonry Listing

• Just like previous template, the Portfolio items will have variable heights (masonry style).
  But instead of a nice tight grid, we get the portfolio items with spacing and titles under the images.

Fullscreen Blog

• Website Posts can be individually assigned to a Page with amazing Fullscreen Blog template.
  It designed to keep a showcase minimal and clean.

Background Image/Video

• Background Image/Video template allows to create a page with the one image or one video layout.
  The page will not contain any other modules or content.
  Please select the required options, upload an image or add a video link.

Coming Soon

• The template is a good solution for website launching. Create a page with coundown timer. It allows to gather emails in a closed beta mode to notify visitors when the website will be available online.

Revolution Slider Template

• This is a special template for Revolution slider. It allows to alternate images and videos. Add a slider shortcode and that's all.

Vertically Stretched Page

• The template has a non-standard page layout.
  It arranges page vertically, the height stays fixed.

Template Setup

Let's have a look how to select a custom template for the page.

1. Please go to Pages => click create a new Page or edit the required one=> on the right you can see "Page Attributes section".

2. Don't select the Parent for the page, just indicate the required Template.

3. When the template is selected, please click Publish button. The Page will display the required editor according your template.

Striped Page Setup

Here we will explain you how to setup your Striped Page :

• the first thing you have to do is to create a blank page;
• please select the Striped Page Template, click Publish button;
• after page publishing you will find Strip Page Options, please select Layout style => click Add New Strip;
• new fields will be activated, please add the details: Title1, Title2, Link, Image..

Coming Soon Page Setup

Here are the detailed instructions how to setup Coming Soon Page :

• the first thing you have to do is to create a blank page;
• please select the Coming Soon Template, click Publish button;
• after page publishing you will find Strip Options, please Enter Date: Year, Day, Month=> add Notify Text => add Form shortcode => select Social Icons;
• on the right in Custom Layout area select the Background settings option Image=> add an image you want to display as a background for Countdown timer. That's all, please update the page.

Custom Sidebars Setup

The theme has the option to create unlimited number of custom sidebars, let's have a look how to create a custom sidebar and add it to the page.

1. Please go to Pages => click edit the page you need=> on the right you can see "Custom Layout" module.

2. The next step is to add widgets to this custom sidebar. Please go to Appearance => Widgets. You will see a custom widget on the right. Please drag and drop the widgets you want to display in the sidebar.

3. The last step is to add the custom sidebar to the page. Please open the page where you want to display the custom sidebar. On the right you can see "Custom Sidebar" module.
Please choose the desired layout and sidebar from drop down menu. Save page settings and preview the page. That's all.

Note, Custom sidebars available only for Default Pages. If you are going to use custom templates they will not be available for the pages.

Revolution Plugin Installation

There are several ways to install WordPress plugin, we do prefer using FTP but you can choose other ways. Please read more about plugin installation on the official website at http://codex.wordpress.org/Managing_Plugins

• please unzip the main zip file that you downloaded from ThemeForest and open "Plugins" folder;
• there you can find Revolution slider folder;
• please find revolution installable.zip file there;
• unzip it and upload to Plugin folder to the wp-content/plugins folder in your WordPress directory online via FTP.;
• log into your WordPress admin dashboard and activate "Revolution slider" plugin in the Plugins => Installed Plugins section;
• once the plugin is activated, you can start creating the slides.
• do not forget to read the slider documentation for obtatining information.

Please note that you purchased the WordPress theme, not a slider plugin, that's why your item purchase code won't work. You have to use only the slider version which comes with the theme pack and compatible with it.

Revolution Plugin Usage

After you’ve installed the plugin, it should add a menu item to your main WordPress dashboard. Now you can start building your sliders!
We are always trying to ease your work that's why the theme comes with the import demo content .txt files. You can find them in the Plugins/RevolutionSlider/Demo/ folder.

• please go to "Revolution Slider WP";
• there is an option Import Slider (see screenshot below), please choose the file import_slider.zip and click Import;
• once the import is complete you will see the newly added slider;

• use the Revolution Slider shortcode that you created earlier. This shortcode can be found by clicking on the Revolution Slider menu item in your dashboard.
  The shortcode should look like [rev_slider alias] based on the alias you gave the slider when you created it;

Revolution Slider Template

You can create fullscreen slider page (the same one as you see at our demo). Please follow these steps to add the slider to the page:

• use the Revolution Slider shortcode from the imported slider. This shortcode can be found by clicking on the Revolution Slider menu item in your dashboard [rev_slider fullscreen];
• please go to Pages section in the main WordPress menu and click Add New;
• on the right in Page Attributes section select the Revolution Slider Template. Please, don't forget to publish the page.
• special field for a shortcode will be available on the page. Add the slider shortcode and update the page. That's all.

Contact Form 7 Plugin Installation

There are several ways to install WordPress plugin, we do prefer using FTP but you can choose other ways. Please read more about plugin installation on the official website at http://codex.wordpress.org/Managing_Plugins
If you choose to use ftp, please do the following:

• please download the plugin at http://wordpress.org/plugins/contact-form-7/
• please unzip the plugin zip file that you downloaded and upload to Plugin folder to the wp-content/plugins folder in your WordPress directory online via FTP.;
• log into your WordPress admin dashboard and activate "Contact Form 7" plugin in the Plugins => Installed Plugins section;
• once the plugin is activated, you can start creating contact form.
• do not forget to read the Contact Form 7 documentation for obtatining information.

Contact Form 7 Plugin Usage

The first thing you have to do is to create a contact form . Please go to the Contact plugin section. You can see it in the main WordPress menu.

If you want to get the form titles appear inside the contact form fields follow the instructions:

• please open the created contact form in the plugin section;
• add special code to the Form area.
• save changes.

• please copy the contact form shortcode, please see screenshot above;
• then open the page where you want to add the contact form to;
• add "HTML" module to the page, click edit and put the contact form shortcode into the text area (see screenshot below);
• that's all, please preview the page.

Gallery Page

Setup Using GT3 Builder

To create a gallery page on your site, please follow the steps below:

• please go to Gallery section in the main WordPress menu and click Add New;
• there is section called "Select Media" in GT3 Page Builder;
• simply click any image that you want to add to the gallery;
• when the image is added to the page builder, hover it and click edit;
• right there you can add Alt, Title and Description to the image, they will appear in the lightbox;
• when gallery is ready, it's time to create a gallery page, please go to the pages and add a new page;
• go to the GT3 Page Builder and add Gallery Module;
• please check the module settings, just click edit. Right there you can select the available gallery from the drop down menu, set the number of images in a row;
• once it is done, please save the changes, and preview the page.

Gallery Setup Using a Template

• please go to Pages section in the main WordPress menu and click Add New;
• on the right in Page Attributes section select the one of the Gallery templates: Gallery-Grid, Gallery-Masonry or Gallery-Kenburns. Please, don't forget to publish the page.
• special Gallery uploader will be available on the page. Upload your media collection and select the images for Gallery. That's all.

Blog Page

Setup Using GT3 Builder

Here we will explain you on how to setup your blog page using GT3 Page Builder:

• the first thing you have to do is to create a blank page;
• if you want to have a sidebar on the blog, please read "Custom Sidebars Setup" section;
• once the page is created, please add "Blog" module using GT3 Page Builder;
• click edit to adjust blog posts listing settings.

Blog Setup Using a Template

• please go to Posts section in the main WordPress menu and click Add New;
• the first thing you have to do is to choose the post format, it can be (standard, image, video), you can choose it on the right side in Format section;
• then please add the content to your post item page, text, featured image (very important as it will be a thumbnail for your post);
• when all the items have been created, it's time to create a page, please go to the pages and add a new page;
• on the right in Page Attributes section select Fullscreen Blog in Templates. That's all, publish the page.
• Note, you can select how many items per page can be displayed on the Fullwidth blog page. Please go to Oyster theme options panel=> View Options=> Fullscreen blog Items per page field.

Portfolio Page

Setup Using GT3 Builder

To create a standard portfolio page with columns layout on your site, please follow the steps below:

• please go to Portfolio section in the main WordPress menu and click Add New;
• this is a portfoio item page not the parent potfolio one, sometimes people think that it is a portfolio page;
• the first thing you have to do is to choose the post format, it can be (standard, image, video), you can choose it on the right side in Format section;
• then please add the content to your portfolio item page, text, featured image (very important as it will be a thumbnail for your portoflio page);
• if you want to link the portfolio item from the portfolio page to another resourse which is out of your current site, please use "Advanced Options" below the page builder section;
• you can also add the custom fields to the portfolio item (please use "Advanced Options" below the page builder section), they will be displaying in the tag line, see screenshot below;
• when all the items have been created, it's time to create a portfolio page, please go to the pages and add a new page;
• go to the GT3 Page Builder and add Portfolio Module;
• please check the module settings, just click edit. Right there you can choose number of items per page, view type (1,2,3,4 columns), enable/disable filter, select the category etc;
• once it is done, please save the changes, and preview the page.

Portfolio Setup Using a Template

• please go to Pages section in the main WordPress menu and click Add New;
• on the right in Page Attributes section select the one of the Portfolio templates: Portfolio Grid Style 1, Portfolio Grid Style 2 or Portfolio Masonry Style. Please, don't forget to publish the page.
• The template will display the items automatically you created in Portfolio section before. That's all.
• Note, you can select how many items per page can be displayed on the page. Please go to Oyster theme options panel=> View Options=> Fullscreen Portfolio Items per page field.

WPML Language Switcher Setup

Oyster theme is fully compatible with the WordPress Multilingual Plugin. If you use it, WPML lets you add language switcher in a menu section.

To add it on your site, please follow the steps below:

• please open wp-content\themes\gt3-wp-oyster\header.php and wp-content\themes\gt3-wp-oyster\header-fullscreen.php;
• please find the line 33 in both file with the code <?php /*do_action("icl_language_selector");*/ ?>;

• the code is commented out (more info about Comment Codes you can read here). Please remove comments to enable the switcher.
  As result you should get this code <?php do_action("icl_language_selector");?>

Please don't forget to save changes.

Go to WP admin Panel => WPML => Languages

• In Language switcher options=> choose where to display the language switcher widget - 'None'.

• Scroll down to find Language switcher style=> select List of Languages 'Horizontal'.

• Under What to include in the language switcher please select only Flag option.

Footer Editing

To change the copyright, please open the General section in your Theme Options Panel and find the Copyright field (© 2020 Business Theme. All Rights Reserved).

Please replace the text with your own one, save the changes. The changes will be reflected on your site.

There is also the social icons list in the footer. All those icons can be managed in the Theme Options Panel => Socials.

Translation Support

This theme comes with .po, .mo files, they are located in \oyster\core\languages\ folder.

Please follow these steps to translate your theme text:

• please download this software and install it http://www.poedit.net/download.php;
• please open theme.po file located here \oyster\core\languages\en_US.po using poedit tool and translate the existing text to your own;
• when you save the file, you must name it according to your language;
• upload the file to the required folder on your server, that's all.

Please note that you can also use the special plugins like WPML to do the translation.

Source Files Included

The theme comes with 26 PSD files. Some PSD files can include different pages inside, and can have hidden layers. Please note that the images are not included in the package.