How To Use Different Blog Post Types Avada

A. General Information

A. Wordpress Information

To install this theme you must have a working version of WordPress already installed. If you need help installing WordPress, follow the instructions in WordPress Codex or you can watch the Instructional Video created by Woo Themes. Below are all the useful links for Wordpress information.

WordPress Codex - general information about Wordpress and how to install it on your server
Instructional Video - created by Woo Themes that shows you how to install Wordpress on your server
First Steps With Wordpress - general information that covers a wide variety of topics
FAQ New To WordPress - the most popular FAQ's regarding Wordpress
WP101 Basix Training videos - some great videos from WPTuts on various Wordpress topics

B. What Is Included With Your Package

When you purchase our theme from Themeforest, you need to download the Avada files from your Themeforest account. Navigate to your downloads tab on Themeforest and find Avada. Click the download button to see the two options. The Main Files contain everything, the Installable Wordpress Theme is just the installable Wordpress theme file. Below is a full list of everything that is included along with a brief description of each item.

Avada Docs.html - this is the entire documentation file with instructions and videos on how to use Avada.
Avada Theme Folder - contains the Avada.zip and Avada-Child-Theme.zip wordpress theme. The child theme is only for users who make code changes.
Extras Folder - contains the developer documentation for Layer Slider & Revolution Slider. These are not ours, but the plugin developers docs.
Languages Folder - this contains the .mo & .po translation files needed to translate the theme & also contains several languages already translated.
Licensing Folder - this contains the licensing files, this is not your purchase code that you need to download from Themeforest.
PSD Folder - this contains all the layered PSD files for those developers or designers who want to customize the design further.
XML Folder - this contains the XML file that you can import to receive our demo data. See that section of these docs for how to import this file.

C. What Are The Requirements To Use Avada

To use Avada, you must be running Wordpress 3.1 or higher, PHP5 or higher, and mysql 5 or higher. We have tested it with Mac, Windows and Linux.

D. Migrating From Another Theme

If you are migration from a theme which used the native featured images functionality of WordPress. Please use the Regenerate Thumbnails plugin to resize all the thumbnails. Click the link above and download the free plugin, and read through the steps it contains, it has all the information you need.

E. All Support Is Handled On Our Forum

All theme support is handled on our dedicated support forum. Comments left in the item section on Themeforest can be overlooked. We have a dedicated support staff on our forum who can promptly answer your questions. See the following section on how to sign up and use our forum.

B. Free Forum Support

All of our items come with free support, and we have a dedicated support forum to handle your requests. Support is limited to questions regarding the theme's features or problems with the theme. We are not able to provide support for code customizations or third-party plugins. If you need help with anything other than minor customizations of your theme then you should enlist the help of a developer.

To get support you need to create a forum account using your ThemeForest Purchase Code. Follow the steps below or watch our video tutorial that shows you the full process.

CLICK HERE TO REGISTER AN ACCOUNT, enter your username and email address and hit Submit
You will then be emailed a temporary password, use that to login to the forum. Please check your spam folder if you did not receive the email.
Once you are logged in, you need to enter your purchase code. Try to access the Avada forum and it will bring up the Envato Verification Field.
Copy and paste the purchase code into that field and hit Enter to verfiy. Once it is accepted, you will have full access to the Forum.
Get your purchase code from Themeforest.net on your downloads tab. See the screenshot below for an example or watch our video tutorial below.

click here to setup your free support account

Here is a screenshot that shows you how to find your purchase code.

Watch Video Tutorial - Make sure you watch it in HD or Fullscreen

B1. Before You Post On The Forum

To help speed along your request, we require that you follow the steps below before posting a new topic on the forum. This is for the benefit of everyone and will help make the entire forum more efficient.

Step 1 - Always check the ONLINE DOCUMENTATION, SHORT CODE DOCUMENTATION and FAQ KNOWLEDGEBASE SECTION. Most questions can be answered in those areas.

Step 2 - Always perform a forum search before you post, its very possible your issue has already been brought up and has been answered.

Step 3 - If your question has not been brought up, then please post a new topic. Always be as specific as posisble and include your site URL along with screenshots of the issue. To help speed the process up even more, quickly post a second reply and include your WP and FTP login info and be sure to check the "set as private reply" checkbox so only our team will see it.

Step 4 - Patiently wait! We strive to get you answers as quickly as possible. Do not BUMP your thread, it will take 2X as long to get a reply because we answer threads from oldest to newest.

Step 5 - Lets All Be Civil. The vast majority of users are very helpful, patient and kind, and so are we. We greatly appreciate this type of behavior. If posts are ever made that fall outside of this realm, we will remove them and could possibly remove the user account. So lets all be happy people :)

click here to setup your free support account

C. How To Get Started & Install Avada

You can install the theme in two ways: through Wordpress, or via FTP. The Avada.zip file is the Installable Wordpress Theme and what you need to use to get the theme installed. Please see the following sections for each method and watch our video tutorial on how to install Avada. But first, you need to download the Avada files from your Themeforest account. Navigate to your downloads tab on Themeforest and find Avada. Click the download button to see the two options. The Main Files and the Installable Wordpress Theme. See below.

Downloading The Main Files Gives You A Package.zip File With All The Content Listed Below

Avada Docs.html - this is the entire documentation file with instructions and videos on how to use Avada.
Avada Theme Folder - contains the Avada.zip and Avada-Child-Theme.zip wordpress theme. The child theme is only for users who make code changes.
Extras Folder - contains the developer documentation for Layer Slider & Revolution Slider. These are not ours, but the plugin developers docs.
Languages Folder - contains the .mo & .po translation files needed to translate the theme & also contains several languages already translated.
Licensing Folder - contains the licensing files, this is not your purchase code that you need to download from Themeforest.
PSD Folder - contains all the layered PSD files for those developers or designers who want to customize the design further.
XML Folder - contains the XML file that you can import to receive our demo data. See that section of these docs for how to import this file.

Downloading The Installalable Wordpress Theme Only Gives You The Avada.zip File

Avada.zip - this is the parent wordpress theme, install this via Wordpress. If you install it via FTP then unzip it first and use the extracted folder.

C1. Wordpress Installation

Follow the steps below to install via Wordpress.

Navigate to Appearance > Themes.
Click Install Themes and hit the upload button.
Navigate to find the "Avada.zip" file on your computer and click "Install Now" button.
The theme will be uploaded and installed.
Activate the newly installed theme. Go to Appearance > Themes and activate the installed theme.
Most included plugins are integrated into the theme and all will be ready to use when you right away. The Revolutilon Slider is the acception and you will be prompted to install and activate the plugin.

ARE YOU SURE YOU WANT TO DO THIS?: If you get the "Are You Sure You Want To Do This" message when installing Avada.zip file via Wordpress, it means you have an upload file size limit. Install the theme via FTP if this happens, or call your hosting company and ask them to increase the limit.

PLEASE NOTE: If you have trouble installing the theme via Wordpress, please proceed with installing it via FTP.

Watch Video Tutorial - Make sure you watch it in HD or Fullscreen

C2. FTP Installation

Follow the steps below to install via FTP.

Log into your hosting space via an FTP software
Unzip the Avada.zip file and ONLY use the extracted Avada theme folder
Upload the extracted Avada theme folder into
wp-content > themes in your wordpress installation
Activate the newly installed theme. Go to Appearance > Themes and activate the installed theme.
Most included plugins are integrated into the theme and all will be ready to use when you right away. The Revolutilon Slider is the acception and you will be prompted to install and activate the plugin.

D. How To Update Your Theme

You can update your theme via FTP or via Wordpress. See the information below for each method. No matter what method you choose, you first need to download the new theme files from Themeforest.

First You Need To Download The New Theme Files From Themeforest

Step 1 - Log into your Themeforest account and go find the "Avada" purchase on your downloads tab.
Step 2 - Click the "download" button next to it and choose to download the "Installable WordPress Theme" which is just the WordPress file, or choose the "Main Files" which is the entire package.

How To Update Your Theme Via FTP

Step 1 - Go to "wp-content > themes" location and backup your "Avada" theme folder by saving it to your computer, or you can choose to simply delete it. Your content will not be lost.
Step 2 - Retrieve the "Avada.zip" file from your new Themeforest download and extract the file to get the "Avada" theme folder.
Step 3 - Then simply drag and drop the new "Avada" theme folder into "wp-content > themes" location. Choose to "Replace" the current one if you did not delete it.

How To Update Your Theme Via Wordpress

Step 1 - You need to deactivate the current "Avada" theme in the "appearance > themes" section by simply activating a different theme. Once you activate a different theme, you can delete the Avada theme. Dont worry, your content will not be lost.
Step 2 - Retrieve the "Avada.zip" file from your new Themeforest download. If you downloaded the "Main Files" from Themeforest, then you need to unzip the archive file you received, the Avada.zip will be inside of it
Step 3 - Then simply upload the "Avada.zip" file in the "appearance > themes" section. Click on the "Install Themes" tab at the top and choose to upload the zip file.
Step 4 - Once it uploads, choose to activate it. You're done!

D1. Important Update Information

Each new update brings new features and we like to let our users know everything they can expect. This section below will always contain the latest information for each update. Below is an update guide that lets you know what to expect when updating Avada from an older version to the latest.

Use The Guide Below To See Which Version Pertains To You

If you are using Avada 1.0 to 2.1.2, then please read #1-6
If you are using Avada 2.1.3 or higher, then please read #4-6
If you are using Avada 3.0 or higher, then please note #5-6

1. Twitter & Flickr Widgets -If you are using Avada 2.1 or lower, you will need to reset your flickr & twitter widgets. The API's have changed. Please refer to the "Custom Widgets" section of our documentation for steps & a video tutorial

2. Widgets Will Become Inactive -Upon updating to v2.1.3 or higher, your widgets will drop out of your sidebars and go into the Inactive boxes. They are not deleted, you simply need to drag & drop them back into your sidebars.

3. Many New Theme Options -Due to over 100 new theme options, its recommended that you go through each tab and set any options that are not already set. For example, a very important option is the new line-height values on the Typography tab. Set the default values.

4. Header Selections -We've added the ability for users to select content for the various header areas. If you use header 2-5, your current content will be removed when updating. Go to the header tab in theme options, and choose your selections. You can now select what shows up in the top left & top right section. Header 4 has a unique section that also has different selections. All of this is selected on the header tab in theme options.

5. Revolution Slider Plugin -The Revolution Slider is no longer automatically activated into the theme. It needs to be activated upon install and you will get a big notice about it on wp-admin page. You will not lose any sliders OR slider page settings and revolution slider is and always will be included with the theme. Upon upgrading to v3.1.1 the integrated Revolution Slider plugin will be disabled, and you will see a notification message in the WP admin telling you that the theme requires the installation of the Revolution Slider. Choose to install it, and then activate it. All the other slider plugins (Layer Slider, Elastic Slider, Themefusion Slider, Flexslider) are still integrated. ONLY Revolution Slider is not integrated.

6. Reset Browser Cache -If you see obvious visual issues then you need to reset your browser cache. That will more than likely solve any issues you are seeing. Each browser allows you to remove cookies, history and other data.

E. Demo Data - Importing XML File

We have include the exported XML file from our demo, this allows you to quickly set up your theme the same way our demo is set up. Please note, the XML file does not include images or the slider data. See the slider sections of this documenation to set up the sliders. The XML file will give you all of our demo pages, if you only want a few of them, then you can copy the individual page demo code below.

Import the XML File - Follow These Steps Below, or Watch The Video Tutorial

The XML file is included within the download package at root level in a folder called XML
Navigate to WP Admin > Tools > Import
Select and install WordPress importer
Once its installed, select the XML file and upload it. It will take a few minutes to install and upload all content
Now navigate to WP Admin > Appearance > Menus page and select menu called "Main" and assign it to "Main Navigation" location
Next, navigate to WP Admin > Settings > Reading Settings and set a front page and posts page
If you have issues with the above process, please read the note below

If The XML file will not load, its most likely due to host limitations. The easiest way to get around that is to leave the "download images and attachments" box unchecked. That will give you all the pages and posts without the attachments. This is a good option because users will need to use their own images anyways.

Secondary Troubleshooting Tips For XML

Make sure the wp-content > uploads folder is writeable
Make sure you have the uploads folder on your server, if you do not then please make one at
wp-content > uploads
Its possible that your server upload limit is too low,
if so, contact yourr hosting company to temporarily increase it to about 200MB
Some users may need to set their folder permissions for the wp-content/uploads folder to 777 before being able to upload anything
Please have patience, it can take several minutes or longer depending on the speed of your server

Watch Video Tutorial - Make sure you watch it in HD or Fullscreen

F. Demo Data - Individual Pages

Below is the demo code for all the individual pages on our demo that were made with shortcodes. Please note, the blog, portfolio, contact, faq, sidebar pages are not included since those are not made with shortcodes.

How To Use The Demo Code For Individual Pages:

Copy the individual page code below, then go to your pages section of your admin and paste the code into the HTML/Text editor. Make sure you are pasting the code in the TEXT editor, it will not work if you paste it in the Visual editor.

Home Page 1 Demo Code - Our Demo Uses Full Width Page Template

Home Page 2 Demo Code - Our Demo Uses Full Width Page Template

Home Page 3 Demo Code - Our Demo Uses Full Width Page Template

Home Page 4 Demo Code - Our Demo Uses Full Width Page Template

Home Page 5 Demo Code - Our Demo Uses Default Page Template

Home Page 6 Demo Code - Our Demo Uses Full Width Page Template

Home Page 7 Demo Code - Our Demo Uses Full Width Page Template

Home Page 8 Demo Code - Our Demo Uses Full Width Page Template

Home Page 9 Demo Code - Our Demo Uses Default Page Template

Home Page 10 Demo Code - Our Demo Uses Full Width Page Template

Home Page 11 Demo Code - Our Demo Uses Full Width Page Template

Home Page 12 Demo Code - Our Demo Uses Full Width Page Template

Home Page 13 Demo Code - Our Demo Uses 100% Width Page Template

Home Page 14 Demo Code - Our Demo Uses 100% Width Page Template

Home Page 15 Demo Code - Our Demo Uses 100% Width Page Template

Home Page 16 Demo Code - Our Demo Uses 100% Width Page Template

Home Page 17 Demo Code - Our Demo Uses 100% Width Page Template

Home Shop Style 1 Demo Code - Our Demo Uses 100% Width Page Template - Need WooCommerce Installed

Home Shop Style 2 Demo Code - Our Demo Uses 100% Width Page Template - Need WooCommerce Installed

Home Portfolio Style 1 Demo Code - Our Demo Uses Full Width Page Template

Home Portfolio Style 2 Demo Code - - Our Demo Uses 100% Width Page Template

Home Blog Style 1 Demo Code - Our Demo Uses Default Page Template

Home Blog Style 2 Demo Code - Our Demo Uses Full Width Page Template

Product Launch Page Demo Code - Our Demo Uses 100% Width Page Template

Example Page 1 Demo Code - Our Demo Uses 100% Width Page Template

Example Page 2 Demo Code - Our Demo Uses 100% Width Page Template

About Us Page 1 Demo Code - Our Demo Uses Full Width Page Template

About Us Page 2 Demo Code - Our Demo Uses Full Width Page Template

Our Office Page Demo Code - Our Demo Uses Full Width Page Template

About Me Page Demo Code - Our Demo Uses Full Width Page Template

Services Page 1 Demo Code - Our Demo Uses Full Width Page Template

Services Page 2 Demo Code - Our Demo Uses Full Width Page Template

Meet The Team Page Demo Code - Our Demo Uses Full Width Page Template

G. Setting Up New Pages

You can create any number of pages with content. Avada includes several page templates to choose from, and you will need to choose the page template that suits your needs. For example, if you want a "Full Width" page, then you need to select "Full Width" for the page template.

Follow These Steps Below To Create A New Page

Navigate to Pages and click Add New.
Input a new name for your page, then look for the Page Attributes on the right hand side of the page
Parent is usually set to No Parent unless the page
you are making is a Side Navigation page
Then select a page template from the dropdown list. See list of page templates and descriptions below.
You can then select any number of Page Options or select a Sidebar to show on the page
Content for your page goes in the editing field, use the Visual or HTML editor. Page content is mainly built using Shortcodes, see the Shortcodes section for how to use them. You can also use our demo content, see the corresponding section of this document for the demo code of each page

Below are the page templates along with a description of each one

1. Default: this is the default page template that automatically has the sidebar with it. Choose this template for your blog
2. Contact: this is the contact page template that you should choose when you make your contact page with google map & contact form
3. FAQ: this is the FAQ page template. Choose this template when you make your FAQ page
4. Full Width - this is the full with page that is used for any page you want to be full width, examples are home pages, about us page, services, etc.
5. 100% Width: this is the full width 100% page template. Using this will allow your content to go full width of the browser window. And to contain content within the site width 940px, simply use the full width shortcode.
6. Portfolio 1-4 Columns: these are the portfolio page layout templates, choose 1, 2, 3 or 4 columns depending on the layout you want.
7. Side Navigation: this is the side navigation page template. When making a side navigation page, make sure to set the Parent to Side Navigation, and also set each page Template that needs to be inlcuded to Side Navigation. See "Setting Up The Side Nav Pages" portion of this document for more info.

Here is a screenshot that shows you the various areas and descriptions of the page settings described above

Watch Video Tutorial - Make sure you watch it in HD or Fullscreen

I. Setting Up The Home Pages

Avada includes 3 pre-designed home page options. Any of the layout options you see on the 3 home pages can be used on your home page or any other page via shortcodes, you are not stuck with the pre-designed options. You can mix and match anyway you like.

To setup your homepage, create a new page and make sure you set the Template to Full Width in the Page Attributes box, see the screenshot below.

Homepages can be built through a combination of shortcodes or with our pre-designed demo pages.

To use one of our pre-designed layouts, copy and paste our demo code into the HTML editor of your page. See the demo code for each home page below.

To create your home page with shortcodes, click the shortcode icons you want in the Visual Editor and populate your content. See our shortcodes section for more detailed info on how to use them

Once you have created your home page, you need to select it to show up as the home page. To do this, follow the steps below.

Navigate to Settings > Reading
Select A Static Page for Front Page Displays
Select your new home page for the Front Page
This is also the same spot you select the Blog page

J. Setting Up The Blog

To setup your blog page, create a new page and name it anything that you want. Make sure the page Template is set to Default Template in the Page Attributes Box on the right hand side of the page editor. Doing that will automatically apply the sidebar to your blog page. Avada has 6 different blog layout designs; Grid, Timeline, Large, Large Alternate, Medium, Medium Alternate and Full Width. Each layout can be used with or without a sidebar.

To select a specific blog page layout design, simply follow the steps below

Navigate to Appearance > Theme Options and click on the Blog Options Tab
At the top you can select the three different Blog Layout designs. Select one then hit save
Then Navigate to Settings > Reading and select your blog page name for the Posts Page

After your Blog page is made, you have to create posts to show up on the blog page. Follow the steps below to create a blog post.

All of your blog posts are made in the Posts section of your wordpress admin. Click on Posts to open the section.
At the top of the posts page, click on Add New to make a new post. Create a title and insert your post content in the editing field
On the right hand side of the post page is the Categories box. To make a new Category, click + Add New Category and give it a name. You can have as many as you want. To apply a Category to a post, simply check the box next to the Category name.
You can also apply Tags to a post. The Tag box is below the Category box. Simply insert your tags, separate multiple tags with commas
To set a Featured Image. Click the Featured Image box and select an image from the media window and click Use As Featured Image
Once you have everything you want selected, click Publish and your post will show up on your blog page

Here is a screenshot that shows you the important areas of the blog post page outlined above

Watch Video Tutorial - Make sure you watch it in HD or Fullscreen

J1. Blog Post Types

Avada includes various post types for your blog posts. You can have a single image, a slideshow of images or a video. You can also insert audio into your post content through the sound cloud shortcode in the visual editor. Please see the shortcode section for how to use the sound cloud shortcode.

To create a single image post, follow these steps

Create a new post in your post section of your admin
In the lower right corner are Featured Image boxes
Click on Set Featured Image and your media window will popup which will allow you to select an image in your media library or upload a new one
Then select Use As Featured Image, only set one Featured Image if you do not want a slideshow
Close the media window and be sure to Publish

To create a slideshow post, follow these steps

Follow the same steps above but set multiple featured images instead of just one
Select Use As Featured Image for the first item, and Use As Featured Image #2, #3, etc for the other images in the slideshow
Close the media window and be sure to Publish
5 Featured images show by default, to add more change the Post Image Slideshow number in your theme options located on the Post Slideshows tab

To create a video post, follow these steps

Create a new post in your post section of your admin
Find the Video Embed Code field and paste your iFrame embed code you get from your video source, either Youtube or Vimeo
Close the media window and be sure to Publish
The screenshot on the right gives you an example of the iFrame video embed code

Slideshows: Avada has 2 methods for slideshows, legacy and the new method. If you have been a user prior to Avada 2.0, you will need to turn on Legacy Slideshows in your theme options located on the Slideshows tab for your old slideshows to show up. We prefer the new method of setting multiple featured images as it allows for easier slideshow creation and management as well as images to be placed in the post content without being added to the top slideshow. Previous users can create your slideshows over again with the new method, or enable Legacy Slideshows in theme options.

Featured Images: The feature image on the listing page for the Blog Large layout is set at 670px wide x 272px high, the Blog medium is set at 320px wide x 202px high. And the featured image on the single post pages is set to be 670px wide. If the featured image you upload is smaller than the default size for the layout you choose, it will be automatically scaled up to fit the size which can cause pixellation in images. Make sure the featured images you use are the correct size for the layout. Or you can set a custom featured image size for each post. To do so, navigate to your post and find the "Post Options" box, at the bottom of the box is a field to input a custom featured image width and height. Insert a number in pixels (ex: 200px) and it will override the default size.

Re-Order Posts: FAQ's, Blog Posts, and Portfolio Posts are all ordered by date, the newest posts show first and the oldest show last. We have included a plugin called Post Type Order, which allows you to Re-Order those items manually. By default the plugin is disabled. Go to the Extras tab in theme options and check the box next to Enable posts type order plugin. When the plugin is enabled, simply click Re-Order in the dropdown list of the section and you will be able to drag and drop posts into place.

Thumbnail Generation: Avada uses the WordPress Post Thumbnails function, this way you can upload one image and WordPress will automatically resize it to all the different thumbnail sizes for the different blog widgets (Recent News and Avada Tabs).

K. Setting Up The Portfolio

To setup your portfolio page, create a new page and name it anything that you want. Avada includes 9 different portfolio templates, Grid, 1-4 column and 1-4 column with text. Select the page Template of your choice. You can also use a sidebar with any of the layouts by choosing Portfolio: Full Width "Yes or No" and set a excerpt length for the text layouts by inserting a number in Portfolio Excerpt Length.

After you create your new page and select the template, you need to make portfolio posts. Each portfolio post gets a thumbnail added to the main listing page (by setting a featured image for each post) and also gets a single post page.

After your Portfolio page is set, you create posts to show up on the portfolio page. Follow the steps below to create a portfolio post.

All of your portfolio posts are made in the Portfolio section of your wordpress admin. Click on Portfolio to open the section.
At the top of the page, click on Add New to make a new portfolio post. Create a title and insert your post content in the editing field
On the right hand side of the post page is the Categories box. These Categories are the filters that will sit above your portfolio images and allow you to filter the different types of projects. To make a new Category, click + Add New Category and give it a name. You can have as many as you want. To apply a Category to a post, simply check the box next to the name.
Also on the right hand side of the post page is the Skill box. Follow the same steps above for Cateogires to create a new Skill
To set a Featured Image. Click the Featured Image box and select an image from the media window and click Use As Featured Image. Setting a Featured Image is important because it is needed for the thumbnails to show up on the main portfolio page.
Below the post content editing field are your Portfolio Options. You can set various things here including, half or full width, video embed code, light box video URL, and other project atributes that show up on the single portfolio post pages
Once you have everything you want selected, click Publish and your post will show up on your portfolio listing page and the single post page

Please Note: Avada uses the WordPress Post Thumbnails function, this way you can upload one image and WordPress will automatically resize it to all the different thumbnail sizes for the different blog widgets (Recent Works Slider and Sidebar Widget). Featured Images on the Single Post Page Full Width are set to be 940px wide, and on the Single Post Page Half Width are set to be 620px wide so make sure your featured images are the right size or they will be scaled up to fit which could cause pixelation.

Here is a screenshot that shows you the important areas of the portfolio post page outlined above

Avada also allows for Unlimited Portfolio Pages with a custom set of Categories (Filters) per Portfolio page

To setup multiple portfolio pages, simply create a new page for each portfolio you want to have, and select the page Template of your choice for each of those pages as the above directions state. You can select Portfolio One, Two, Three or Four Column for each Portfolio page and each portfolio page can have a different template as well as a custom set of Category Filters.

To select a custom set of Category Filters for your portfolio pages, follow the steps below.

Open up your individual portfolio page in the Pages section of your admin
Scroll down until you get to the Page Options box
Inside the page options you will see a Portfolio Type option with your Categoires listed
Any Portfolio Category you have created will show in this list, simply select the Category or Categories that you want to show for that specific Portfolio page. To select more than one Category, hold down the Command or Control key while selecting
Once you are done, publish the page and your settings will be saved

Please Note: You have to already have Categories setup in your Portfolio section for them to show up in the Portfolio Type list. Only the Categories you have made will show up. See the above section for how to make a Category and how to apply it to a Portfolio post. You also need to have the Categories assigned to Portfolio posts for them to show up on your site. See the above section for how to make Portfolio post.

Watch Video Tutorial - Make sure you watch it in HD or Fullscreen

K1. Portfolio Post Types

Avada includes various post types for your portfolio posts. You can have a single image, a slideshow of images or a video. You can also insert audio into your post content through the sound cloud shortcode in the visual editor. Please see the shortcode section for how to use the sound cloud shortcode.

To create a single image post, follow these steps

Create a new post in your post section of your admin
In the lower right corner are Featured Image boxes
Click on Set Featured Image and your media window will popup which will allow you to select an image in your media library or upload a new one
Then select Use As Featured Image, only set one Featured Image if you do not want a slideshow
Close the media window and be sure to Publish

To create a slideshow post, follow these steps

Follow the same steps above but set multiple featured images instead of just one
Select Use As Featured Image for the first item, and Use As Featured Image #2, #3, etc for the other images in the slideshow
Close the media window and be sure to Publish
5 Featured images show by default, to add more change the Post Image Slideshow number in your theme options located on the Post Slideshows tab

To create a video post, follow these steps

Create a new post in your post section of your admin
Find the Video Embed Code field and paste your iFrame embed code you get from your video source, either Youtube or Vimeo
Close the media window and be sure to Publish
The screenshot on the right gives you an example of the iFrame video embed code

Featured Images: The feature image on the full width single post page is 940px wide, the half width post page is set at 620px wide. If the featured image you upload is smaller than the default size for the layout you choose, it will be automatically scaled up to fit the size which can cause pixellation in images. Make sure the featured images you use are the correct size for the layout. Or you can set a custom featured image size for each post. To do so, navigate to your post and find the "Post Options" box, at the bottom of the box is a field to input a custom featured image width and height. Insert a number in pixels (ex: 200px) and it will override the default size.

M. Setting Up The FAQ page

Avada includes a Frequently Asked Questions (FAQ) page that allows you to insert large amounts of content questions organized into Categories using filters, just like the Portoflio Posts can be filtered.

To create the FAQ Page, follow the steps below

Create a new page and give it any name you wish
In the Page Attributes box on the right hand side, set the Template to FAQs
Once you are done, be sure to Publish
To create new FAQ's, select the FAQs sidebar item in your admin section
FAQ's work like regular posts, to add a new one, click Add New in the FAQs section of your admin
Create a title which will be the question, then insert copy in the editor field which will be the answer
On the right hand side is the Categories box, these are your filters to your FAQs
Click Add New Category and give it a name, then check the box to apply it to a FAQ

Please Note: Setting the page template to FAQ will automatically set the default sidebar on the page. To use a different sidebar, select a different sidebar in the Sidebar dropdown field on the page. To create a custom sidebar, please see our section called "Creating Custom Sidebars" in this document. You can also select Full Width from the page options to not have any sidebar

Here is a screenshot that shows you the various areas and descriptions of the FAQ posts that are mentioned above

N. Setting Up The Side Navigation Page

Avada includes a Side Navigation page template that can be used to insert large amounts of content that is easily accessible to the viewer. You can also setup second level menu items on the Side Navigation page that will collapse by default and expand when the parent level is moused over or clicked, depending on how you set it in theme options. You create Side Navigation pages in sets. Each set always has to have a Parent page that will show at the top. Then you create additional pages and assign them to the parent page. All the pages assigned to the parent page will make one side navigation set.

To create a Side Navigation Page Set, follow the steps below

Create a new page and give it any name you wish
In the Page Attributes box, leave the Parent field blank (no parent) and Template to Side Navigation
Insert any type of content into the Visual or HTML editor, use short codes in the Visual editor
To add more side navigation menu items, create another new page, and select your newly made Parent page as the Parent, and set the Template to Side Navigation
To create a second level, select an already created Side Navigation page for the Parent, and set Side Navigation for the Template field in the Page Attributes Box. The Parent Tempalte you select has to be a page that already has the Side Navigation set for both the Parent and Template.
Side navigation will show on the right side of the page by default. To change it, select Left from the Sidebar Position dropdown field in the page options. You can change it globally in theme options
Menu order is set alphabetically, change it by inserting a new order for each page in the Order field
Once you are done, be sure to Publish each of the pages

Please Note: You can create as many side navigation page sets as you want as long as the first parent page is different for each set.

O. Advanced Theme Options

Avada has an advanced Theme Options panel that is loaded with options. There are too many options to go over in these docs but please take some time and navigate through each tab. Go to Appearance > Theme Options and take a look. We've organized them into logical sets and have given descroptions for items that need it, most things are self explanatory. Be sure to hit Save All Changes to save your settings once you are done.

You can also backup your theme options, click on the Backup Options tab and copy the data inside the Transfer Theme Options Data field.

Please Note: If you are using anything prior to Avada 2.0, your theme options will reset when you upgrade to Avada 2.0. This is due to an entirely new theme options control panel. Most settings are easy to reset, but please copy your custom CSS if you have any inserted. We apologize for this but its a minor thing to deal with considering the new theme options are much more high level with numerous options. Its a huge improvement all around.

P. Custom Font - Museo Slab

Avada allows users to chooose from any of the 500+ Google Fonts, the Stadnard System Fonts, and also allows you to upload a Custom Font. The Custom Font will be applied to the headings and menu. On our demo, we use a custom font called "Museo Slab", we have the "300" version which is a paid version, but there is a "500" version which is free. Below you will find directions for how to download and use this font. If you want to use a different custom font, follow the same steps below. You will need to have the 4 required font files for the Custom font you want to use.

Museo Slab 300 is the font used for all headings and menus in our demo, it is not a free font but there is a 500 version that is free. Please download it below, make sure you are selecting the "Museo Slab 500" version, it is the only one that is $0. Or you can purchase the 300 version for about $17.

DOWNLOAD LINK FOR MUSEO SLAB 500 FONT

After downloading the font, follow the steps below to install it via theme options

Make sure the Avada theme is already installed
Unzip the Font file you receive from the download
You will need the .woff, .ttf, .svg, .eot font files
Navigate to Appearance > Theme Options > Typography Options
You will see 4 Custom Font fields, one for each of the 4 font files listed above
Upload the 4 individual font files into the corresponding field by clicking the Upload button
After you have uploaded all 4 custom font files, the custom font will be set for the headings and menu, and it overrides any of the other settings

Watch Video Tutorial - Make sure you watch it in HD or Fullscreen

Q. Shortcodes

Avada includes tons of shortcodes. Most pages and elements are built using shortcodes, it provides major flexibility to use them anywhere, and also allows uers to quickly and easily build pages. All shortcodes are accessed in the usual spot, which is in the Visual Editor field. See the screenshot below to see where they are located. Click a shortcode icon and simply populate the content inside of it, some of them have various options to choose from, and the column shortcodes can be wrapped around other content to keep them inside columns. See our demo code for additional examples.

click here to view all shortcode documentation

Watch Video Tutorial - Make sure you watch it in HD or Fullscreen

T. Setting Up The Sliders

Avada includes 5 total sliders, the Revolution Slider, the Layer Slider, the Elastic Slider, the Flex Slider and the ThemeFusion Slider. The Layer Slider, Elastic Slider, Flexslider and Themefusion Slider are fully integrated into the theme. When you install the theme, those 4 sliders are ready to be used with the theme and you and will be able to be access in the sidebar of your wordpress admin. The Revolution Slider is not integrated, it is a standalone plugin activated via TGM plugin activation. Upon upgrading to v3.1.1 the integrated Revolution Slider plugin will be disabled, and you will see a notification message in the WP admin telling you that the theme requires the installation of the Revolution Slider. Choose to install it, and then activate it and then you will see it in the sidebar of your WordPress admin. Please See Sections: S1, S2, S3, S4, S5 for information on how to use each slider.

PLEASE NOTE: You can disable the Layer Slider, Elastic Slider and FlexSlider plugins on the Extras tab in theme options. This is recommened if you are not using one one or all of them as it will speed up your site. The Themefusion Slider will only load if they are on a page. You can also disable other features on the extras tab like the lightbox, google maps, vimeo videos and others. Please use this tab wisely for optimization.

Once you make a slider, you need to assign it to one of your pages via the page options box. To do this, follow the steps below.

Your slider must already be made with any 1 of our 5 slider types
Navigate to the page that you want the newly created slider to appear on
Scroll down to find the Page Options or Post Options box
First select the Slider Type from the dropdown field
Then select the name of the slider under the corresponding slider dropdown field
To finish, click Publish to save the settings
Please note that if you have a fallback image inserted, it will override the slider o responsive devices

Some of the sliders (Revolution, Layer, Flex & our built in image/video slider) can also be used via Shortcodes in the post content field. Please see the information below for how to use shortcodes for those 3 sliders.

1. Revolution & Layer Slider Shortcodes

Your slider must already be made. The Layer Slider and Revolution Slider will generate a shortcode for you
Go to the slider creation page for either slider and find the automatiaclly generated shortcode, then copy it
Navigate to the page that you want the newly created slider to appear on
Insert your cursor in the Post Content field and paste the shortcode
To finish, click Publish to save the settings

2. Regular Image/Video Shortcode

We also have a regular built-in slider shortcode [slider] that can be used in the post content fields. It can accept any images or videos from Vimeo or Youtube. Please see our Shortcodes section of this documentation file for information on using our built-in shortcodes.

3. FlexSlider Shortcodes

The Flexslider has two sets of shortcodes that you can use. The first set are custom made Flexslider Shortcodes made for Avada that have custom styles applied to them. They are all located in the visual editor while editing your page or post. They are called Flexslider in the shortcode dropdown. To find out more about those, please viist our online shortcode documenation. The second set of shortcodes are the ones that come bundled with the Flexslider plugin. They do not have added Avada styles but cna also be useful. See the below information for the bundled Flexsldier shortcodes.

The bundeld Flexslider shortcode starts with [wooslider], then you can add any one of the 3 slider type (Slides, Attached Images & Posts) along with a large number of other parameters that work with each one. Below you will find a list of each slider type and the parameters that go wtih it, along with the general parameters you can use with each one. An example of the shortcode with slider type looks like this ... [wooslider slider_type="slides"] ... then you can add the extra parameters for each slider type or the general ones to control different things.

Slider Type 1: "slides" Below is a list of all the different parameters you can use with the slides slider type.

slide_page - The slug (or a comma-separated list of slugs) of one or more of your slide groups
limit - The number of posts to display (an integer value such as 1, 5, or 10, for example) Default: "5"
thumbnails - Whether or not to use thumbnails for pagination, instead of the default pagination navigation (Boolean- "true" or "false") Default: "false"

Slider Type 2: "posts" Below is a list of all the different parameters you can use with the posts slider type.

category - The slug (or a comma-separated list of slugs) of one or more of your post categories
tag- The slug (or a comma-separated list of slugs) of one or more of your post tags
size - The size of the image to be displayed (takes a WordPress size handle - "thumbnail", "medium", "large", "full" or a custom-registered image size) Default: "large"
layout - Where to display the post title and excerpt, in relation to the image ("text-left", "text-right", "text-top", "text-bottom") Default: "text-left"
overlay- Whether or not to overlay the text over the image ("none", "natural" or "full") Default: "none"
limit - The number of posts to display (an integer value such as 1, 5, or 10, for example) Default: "5"
thumbnails - Whether or not to use thumbnails for pagination, instead of the default pagination navigation (Boolean- "true" or "false") Default: "false"
link_title - Whether or not to transform the title of each post into a link to the post itself (Boolean- "true" or "false") Default: "false"

Slider Type 3: "attached images" Below is a list of all the different parameters you can use with the attachments slider type.

id - An optional post ID for which to retrieve attached images (must be an integer). Default: $post->ID (the ID of the current post being viewed)
size- The size of the image to be displayed (takes a WordPress size handle - "thumbnail", "medium", "large", "full" or a custom-registered image size) Default: "large"
limit - The number of posts to display (an integer value such as 1, 5, or 10, for example) Default: "5"
thumbnails - Whether or not to use thumbnails for pagination, instead of the default pagination navigation (Boolean- "true" or "false") Default: "false"

General Parameters Below is a list of all the general parameters that can be used with any of the above slider types.

slider_type - The slideshow type desired (bundled options include "attachments", "posts" and "slides")
animation- The type of animation transition to apply ("slide" or "fade")
direction - The direction in which to slide the slides (works only with the "slide" animation) ("horizontal" or "vertical")
slideshow_speed - The delay between each slide animation (0.5 - 10.0 - in seconds ( 1.5, 2.0, 2.5, etc))
animation_duration - The duration of each slide transition animation (0.1 - 0.9 and 1.0 - 10.0, with 0.5 increments)

Control Parameters Below is a list of all the control parameters that can be used with any of the above slider types.

autoslide - Whether or not to automatically animate the slideshow (Boolean- "true" or "false")
smoothheight- Whether or not to adjust the slideshow height to the height of the current slide (Boolean- "true" or "false")
direction_nav - Whether or not to display the "previous/next" navigation (Boolean- "true" or "false")
control_nav - Whether or not to display the pagination (Boolean- "true" or "false")
keyboard_nav - Whether or not to enable navigation using a keyboard (Boolean- "true" or "false")
mousewheel_nav - Whether or not to enable navigation using the mousewheel (Boolean- "true" or "false")
randomize- Whether or not to randomize the display of the slides in the slideshow (Boolean- "true" or "false")
animation_loop - Whether or not to loop the animation when reaching the end (Boolean- "true" or "false")
pause_on_action - Whether or not to pause when the visitor uses the navigation controls on the slideshow (Boolean- "true" or "false")
pause_on_hover - Whether or not to pause when the visitor hovers over the slideshow (Boolean- "true" or "false")

Button Parameters Below is a list of all the button parameters that can be used with any of the above slider types.

prev_text - Custom text to display as the "Previous Slide" button text
next_text - Custom text to display as the "Next Slide" button text
play_text - Custom text to display as the "Play Slideshow" button text
pause_text - Custom text to display as the "Pause Slideshow" button text

How To Use These Parameters Adding parameters to the [wooslider] shortcode looks like this: [wooslider autoslide="false"]. Adding a second parameter (smoothheight, for example) would look as follows: [wooslider autoslide="false" smoothheight="true"].It's only necessary to add a parameter to the shortcode if you wish to override that specific parameter for that slideshow.

T1. Revolution Slider

Avada includes the newly popular REVOLUTION SLIDER CREATED BY THEMEPUNCH. This slider is a beautifully animated slider that is 100% rsponsive and has some amazing options. We can't cover everything here but we outline how to setup a slider and one slide for it. We also include a video tutorial walk thorugh, and include the original documentation created by ThemePunch, which is located at package > documentation > extras.

To create a new Revolution Slider, follow the steps below

Click on the Revolution Slider sidebar item
Click the Create New Slider button
Insert a slider name and alias, and it will generate a shortcode that can be used in post content
Then select the type of slider, Fixed, Responsive, Full Width and also input the Slider Width and Slider Height. Those dimensions represent the "content" area of the slider. You can also specify the Responsive Sizes but its best to leave them at the defaults
On the right hand side are many other options you can set, all are self explanatory, test them out
Once you are done, click Create Slider and your new slider will be made

To create slides for your Revolution Slider, follow the steps below

Click on the Edit Slides button of your slider
Click the New Slide button and select a background
Then click Edit Slide to add content to it
Inside the slide setting are many fields you can set
Click the Add Layer to add a text layer. Use their CSS styles for the text or make your own
Click the Add Layer:Image or Add Layer: Video to add images or video layers
Adjust the Layer Params for each layer. You can set the animation, the location, the speeed, etc.
You can click Preview Slide to see a preview
Then click Update Slide and your slide will be saved
Repeat the process for each slide you add

Watch Video Tutorial - Make sure you watch it in HD or Fullscreen

T2. Layer Slider

Avada includes the popular LAYER SLIDER CREATED BY KREATURA. This slider is a beautifully animated slider that is 100% rsponsive and has some amazing options. We can't cover everything here but we outline how to setup a slider and one slide for it. We also include a video tutorial walk thorugh, and include the original documentation created by Kreatura, which is located at package > documentation > extras.

To create a new Layer Slider, follow these steps

Click on the Layer Slider sidebar item
Click the Add New button at the top
The Global Settings tab will open and allow you to set the general settings for your slider such as the width, height, responsive, full width, and much more
There are many Skins you can select for the Skin field, use any of them listed, or you can use our own Avada skin by selecting Avada
Once you are done, click Save to save the slider
Also note you can can Import Sample Sliders to get Kreatura's demo slides, its a good way to learn and see the different types of settings

To create slides for your Layer Slider, follow the steps below

Click on the Layers tab.
Layer #1 will already be showing, each layer is one slide and you build multiple Sublayers for additional content that is included in that one slide
Add a background image for Layer #1 and set other settings for it
Then create Sublayers for any additional elements you want to show on the slide
Each sublayer will have its own settings, you can set animations, speed, delayin, links, etc
You can click Enter Preview to see a preview of the slide
Repeat the process for each slide you add
When you are done, click Save Changes

Watch Video Tutorial - Make sure you watch it in HD or Fullscreen

T3. Elastic Slider

Avada includes the stylish Elastic Slider. This slider is a great way to create beautiful slideshows with stylish captions that have simple animations. Its fully responsive and can be full width or can have a custom width and height set. Users can also customize other settings on the Elastic Slider tab in the Theme Options panel.

Please Note: The Elastic Slider has its own tab in theme options. You will need to go to appearance > theme options and click on the Elastic Slider tab to set the custom settings such as; width, height, animation, speeds, font size and color, thumbnail width, etc. All of that is controlled in theme options. To create the actual slider and slides to go with it, you need to follow the steps below.

To create a new Elastic Slider, follow these steps

Click on the Elastic Slider sidebar item
Click the Add New button at the top
Then enter a name for the slide in the top field.
Look for the Elastic Slide Options box where you can set your slide Title and Caption
To set your image, click on the Set Featured Image link in the Featured Image box and choose an image from your media library
Then add the slide to a Group. Click on the empty field and enter a Group name then click Add
Publish the slide by clicking Publish
Repeat process to add more slides, be sure to add the same Group name to your slides if you want them all be in one set. You can manage your Groups by clicking on "Groups" in the left sidebar under the Elastic Slider menu item

Watch Video Tutorial - Make sure you watch it in HD or Fullscreen

T4. ThemeFusion Slider

The ThemeFusion slider is powered by the FlexSlider 2 and is easily accessed in the Theme Options panel. This is the perfect slider to use if you just want single images or videos with or without captions. Its very easy to use and edit and is fully responsive.

To create a ThemeFusion Slider, follow these steps

Navigate to Appearance > Theme Options > ThemeFusion Slider to setup the slider
Set the width of the slider, the height is variable. Input 100% for full width
There will already be ThemeFusion Slider 1 setup
Simply add your caption in the Title field
Insert your image in the Image URL field by clicking Upload and selecting an image from your media section
You can also insert a link for the slide in the Link field
For a video slide, simply insert the iFrame Video Code in the Video Embed Code field
Click Add New Slide to create more slides for the current ThemeFusion slider
Change Number of ThemeFusion Sliders to a higher number if you want to make more than one slider. Each slider will have its own number

Watch Video Tutorial - Make sure you watch it in HD or Fullscreen

T5. FlexSlider

Avada inlcudes an awesome slider plugin, powered by the FlexSlider 2. Its a great option for general image or video sliders. It has added options and settings such as; animation, slide direction, control settings & more. Its more advanced than the ThemeFusion slider, but it does not allow for captions.

To create a FlexSlider, follow these steps

Click on the FlexSlider sidebar menu in your wordpress admin section
Click on Slide Groups and create a new group by giving it a name. Click Add New Slide Group to save it
Now you need to add slides to that group. Click on Add New Slide and name it so you can identify it
On the right hand side is the Slide Groups box, select your Group by checking the box next to it
To add an image, use the Visual Editor and click the Upload/Insert icon and select an image. Make sure you select Insert Into Post so the image gets inserted into the post content and not the Featured Image. Featured Images do not show up for this slider
To insert a video, click the Youtube or Vimeo shortcode icon and populate the content. Or simply paste the video embed code into the content field
Make sure you hit Publish to save your slides. Repeat the process for additional slides
You can create as many slide groups as you want and asign specific sldies to them. Its a good way to organize multiple sliders

Watch Video Tutorial - Make sure you watch it in HD or Fullscreen

U. Retina Ready Feature

Avada is Retina Ready so the theme will look fantastic on High Resolution displays like the iPad or iPhone Retina devices. Please read below and watch our video tutorial to help understand how this process works.

There are two different sets of images/graphics that can be Retina Ready

Theme Images: These are the images that are included with the theme (ex: Social Media Icons). All of the included Theme Images are Retina Ready out of the box and do not require the user to do anything. They will look super sharp on Retina Ready screens.

User Uploaded Images: The second set of images are called User Images, these are any images that the user will upload into their theme (ex: Blog Post Image). Wether or not the User Images are Retina Ready depends solely on you, the user. The general rule is that a Retina Ready image needs to be 2x the normal size. So if you have an image that is going in a space that is 100px x 100px, you would need to upload a 200px x 200px image. The easiest way to ensure that your User Images are Retina Ready is to use the WP Retina 2X Plugin created by Jordy Meow.

The WP Retina 2X Plugin For User Images

This is a fantastic plugin and is the best option for users to ensure their images are Retina Ready. It tells you if the images you are uploading are large enough to ensure Retina Resolution. And it can also convert your current media library to be Retina Ready. It will automatically create the necessary 2x images that are needed for every area of the site, and will warn you if your images are not large enough to be Retina Ready. Please watch our video tutorial below to see how the plugin works.

Other Images Such As Logos and Favicons

Some images such as the Logo and Favicons need to be uploaded via Theme Options. We have created the necessary fields to ensure those images are Retina Ready. Users will need to upload the extra files that are 2x the original size. For example, you will need to upload your regular size logo file in the Logo field, then upload the 2x Logo file in the Logo (Retina Version @2x) field. For the logo, you will also need to input the width x height of the original logo size, not the 2x size. This is important and part of the process the browsers uses to display the Retina Ready Images. Please watch our video tutorial below to see how this process works.

Watch Video Tutorial - Make sure you watch it in HD or Fullscreen

V. Using WooCommerce With Avada

Avada is compatible with WoCommerce and includes full design integration as well as custom shortcodes. To get started with creating your online shop, you need to install the free WooCommerce Plugin. This documenation on using WooCommerce is the very basic information you need to get started. Please take a look at the important links below that have additional information about using WooCommerce

WooCommerce Plugin Page - This is the official WooCommerce plugin page
WooCommerce Documentation: This is the WooCommerce Online documenation created by WooThemes
WooComerce Commiunity Forums:This is the community forum for WooCommerce plugin created by WooThemes
WooComerce Built-In Shortcodes:These are the included shortcodes for WooCommerce, our custom shortcodes are not included in this.

Please See The 3 Sections Below For General Information About Using WooCommerce With Avada

1. How To Install WooCommerce And Setup The Default Shop Pages

Go to your Plugin section of your wordpress admin
Click on the Add New button at the top of the page.
Then enter WooCommerce in the search field
Choose the first one called WooCommerce - excelling eCommerce and click on Install Now
WooCommerce will install, then click the link that says Activate Plugin
You will then see a WooCommerce Purple Notficication Bar at the top of the plugin page.
Click the Install WooComemrce Pages button in the purplar bar to install all the default pages

Please Note: Once you are done installing WooComerce and the default pages, you can go to the Appearance > Menu section of your admin and choose to add all the WooCommerce pages to your menu. They will be listed at the top under the most recent pages

2. How To Create Your Products

Click on the Products sidebar menu
Click on Add Product button at the top of the page.
Enter a name for your product at the top of the page
Enter all the product description text into the post content field, this will be all the product informaiton
The Product Data box is where you enter all the product details (price, SKU, shipping, and more)
The Product Short Description box which will be the short intro copy that shows next to your images
Set your main Featured Image in the right sidebar Featured Image box.
To use a gallery of images, insert more images in the Product Gallery box.
Enter your categories in the Product Categories box
Enter your tags in the Product Tags box
When all your data is entered, click Publish and the item will now show on your main shop page

Please See below for a visual description of the product page.

3. How To Use WooCommerce Shortcodes With Avada Columns And Have The Graphics Extend The Full Width of The Column

WooComerce shortcodes can be used with Avada columns and the graphics will extend out the full width of the column size. But this will only happen once you have a large enough Catalog image size and you might posisbly need to regenerate thumbnails using the Regenerate Thumbnails plugin. This is very important in having a consistent design/layout for all your pages.

Click on the WooCommerce sidebar menu item and find Settings area
Click on Cataglog tab at the top of the page.
Scroll to the bottom of the Catalog tab and find the Image Options section
There is a Catalog, Single Product & Product Thumbnail image size
Catalog Image is for your images on the shop page and for shortcodes.
Single Product Image is for your images on the single product pages
Product Thumbnail is for your smaller product thumbnails for widgets
If you want your image to not be cropped leave the height field blank and only enter a width
Enter a large enough Catalog Image Width to fit the corresponding column size.
When you make changes to the 3 various images sizes and save it, you may need to regenerate thumbnails using the Regenerate Thumbnails plugin
Install the Regenerate Thumbnails plugin and go to your media section and choose to regenerate your image thumbnails so the larger size will be created

Please Note: Your catalog image size and single product image size need to be large enough to fit the size column you want to use. And you also need to make sure your product images are the size you need. For example: if you want to use a shortcode in a one_half column and have it fill the full space, then you need to have a Catalog Image size of about 500px in width, and your product image needs to be at least 500px.

W. How To Translate & RTL

We provide translation files for you to translate the theme into your language. The translation files Avada.mo and Avada.po are located in the languages folder inside your package. We also include a few languages that are already translated by our wonderful users, find those files in the same location.

To translate the theme into your language, follow the steps below

Edit the .po file using POEdit (you can also use qTranslate or WPML plugin)
Use the translation field to make replacements
From the file menu, save file with your language name it, for example: de_DE.po. It will generate both a .po and .mo file for your translation.
Next edit wp-config.php located in the root folder of wordpress and define the WPLANG prefix with your language name which should be similar to the translation file name.
Then go to your server via FTP, navigate to the theme folder and find the languages folder, its located at wp-content > themes > Avada > languages
Upload the language files in the languages folder, then you're done!

Included Languages We have included several languages already translated. If one of these is your language, then you simply need to make sure the language files are in the right location listed above, and then open the wp-config.php file and define the WPLANG prefix with your language name which should be similar to the translation file name. The languages we incldue are:

German – Deutsch (de_DE)
Español – España (es_ES)
Italian (it_IT)
Dutch – Nederlands (nl_NL)
Czech - Čeština (cs_CZ)
French - Français (fr_FR)
Polish - Polski (pl_PL)
Portuguese (European) - Português (pt_PT)
Turkish - Türkçe (tr)
Chinese Taiwan - (zh_TW)
Russian - Русский (ru_RU)
Swedish - Svenska (sv_SE)

Avada is RTL Ready

Avada has RTL built into the theme. RTL automatically activates itself when user uses an RTL language in wp-config or uses one of the language plugins like RTL Tester. When an RTL language is specified in the wp-config file and uploaded to the languages folder located at wp-content > themes > avada > languages then you will see Switch to RTL button in the top Wordpress admin bar. Simply click that to switch to RTL.

X. Using WPML With Avada

Avada is WPML Tested & Approved

We have tested and ensrued that Avada is WPML compatible. If you need a multi-language site, then we recommend using the WPML Plugin. You would need to buy a license for the plugi, then install it and set it up. All the inforamtion you need to get started and use it is on the WPML.org page. The WPML developers have also created their own documenation for using the Avada theme with the plugin. Below are all the resource links you will need.

WPML Forum Support: - If you bought WPML then you get free support from their amazing team
WPML Avada Documentation: This is created by the WPML developerss and is specifically catered to Avada
Translating Widgets:Tutorial recommended by wpml team for translating widgets

Y. CSS, Javascript & Credits

CSS FILES: The CSS files are listed below and are located at Avada > CSS. We have included a Custom CSS tab in the theme options for users to insert their own custom CSS. Please make sure to put all of your custom CSS in the CSS field and not change it in the theme CSS files listed below. If you make changes to the CSS files below, they will be overwritten when you update the theme. Anything in the custom CSS field will override the all.css file and not be overwritten.

all.css - Default CSS
prettyPhoto.css - Located in the css folder of the theme. CSS for lightbox.
style.css - Placeholder stylesheet
flexslider.css - CSS for the Flex Slider
ie.css - CSS to combat the quirks of Internet Explorer
media.css - CSS for the responsive framework

Javascript FILES: The Javascript files are listed below and are located at Avada > js. Please leave these files alone unless you know exactly what you are doing. If you do need to edit them, please make a copy of them before you try to edit.

js/jquery.cycle.lite.js - jQuery Cycle is used for slider shortcode.
js/jquery.prettyPhoto.js - jQuery PrettyPhoto is used for the lightboxes.
jquery.carouFredSel-6.2.1-packed.js - carousel javascript
jquery.fitvids.js - responsive videos javascript
jquery.flexslider-min.js - flexslider slider javascript
jquery.isotope.min.js - portfolio filtering / animation javascript
main.js - main file / avada code that utilizies all the the other javascript plugins
modernizr.js - browser features detection script
options-custom.js - custom script that fills in the colors in the theme options
respond.min.js - another browser feature detection script
upload.js - upload script for metaboxes
gmap.js - script for google maps
jquery.infinitescroll.min.js - script for allowing infinite scroll on blog
jquery.hoverIntent.minified.js - script for determining users intent with mouse

Sources & Credits: We've used the following images, icons or other files as listed.

jQuery - http://jquery.com/
IconSweets 2 - http://www.iconsweets2.com
Creattica Images For Preview - http://creattica.com
Pretty Photo Lightbox - http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/
FlexSlider2 - http://flexslider.woothemes.com
Layer Slider - http://codecanyon.net/item/layerslider-wp-the-wordpress-parallax-slider/1362246
Slider Revolution - http://codecanyon.net/item/slider-revolution-responsive-wordpress-plugin/2751380
Post Types Order Plugin - http://wordpress.org/extend/plugins/post-types-order/

How To Use Different Blog Post Types Avada

Source: https://moderzinski.de/wp-content/themes/Avada/0%20-%20Avada%20Docs.html

Posted by: weinmanndraugh.blogspot.com