Valenti v3.2


Thank you very much for purchasing Valenti. The following documentation contains almost everything related to Valenti, and if anything important has been overlooked, it will be added over time. Let's begin :)

1- After downloading the theme from Themeforest, extract the contents of the downloaded zip file to your computer.

2- In your Wordpress backend, go to Appearance -> Themes -> Install Themes (top tab).

3- Click the upload option (just under the tabs) and go to the folder where you extracted the previous zip file, and select the file called "valenti.zip"

4- Click on "Install Now" and once completed select "Activate".

5- You will see a notice about installing plugins that the theme uses. Click on "Begin installing plugins".

6- Tick all of the plugins listed and then using the drop down underneath, select Install. Apply.

7- Once they are all installed, click on "Return to Required Plugins installer" and tick all of the plugins once more, but this time, select "Activate" from the drop down and hit apply.

The video below shows the entire installing process:

Direct URL: http://www.youtube.com/watch?v=eWYe7r9C7ko

If you are installing Valenti on a website that already has images uploaded, please follow these important steps once Valenti is activated:

After logging into your admin Wordpress account:

  1. Go to Plugins -> Add New and install a free plugin called "Force Regenerate Thumbnails"
  2. After Installing and activating it, go to Tools -> Force Regenerate Thumbnails 
  3. Click on "Regenerate All Thumbnails" and wait until it is finished

This fixes all your existing images to work with Valenti. Any images uploaded after Valenti is active will have the appropriate thumbnails created automatically.

You have two main homepage options with Valenti:

1- Make the homepage show the latest posts with the option of a grid/slider on top. To learn how to do this, go the the Homepage Latest Posts Style section.

2- Build your own homepage using the "Valenti Homepage Builder". To learn how to do this, go the the Valenti Homepage Builder section.

To set up the homepage to show the latest posts:

1- In your Wordpress backend go To "Settings -> Reading" 

2- Select "Your Latest Posts" in the "Front Page Displays" option.

3- Go To "Appearance -> Theme Options -> Homepage"

4- Select a blog style to use on the homepage:

5- Optional: To add a grid or slider at the top of the posts, select an option from "Featured Posts"

6- Optional: To only show a specific category or multiple categories, tick the categories you want to show on the grid/slider in the "Grid/Slider Category Filter" option

7- Optional: To feature only certain posts in the grid/slider, edit/add a post and turn on the "Valenti Homepage Feature" option.

Valenti comes with a unique homepage drag & drop builder that does not use shortcodes or need any type of code to be inputted (Horrah!) and allows you to quickly create or change complicated homepage layouts within a few clicks. 

You can mix and match the modules, grids, ad blocks and special module that accepts custom code (HTML, shortcodes, special ads, etc)

 

To build a unique homepage using the "Valenti Homepage Drag & Drop Builder"

1- Add/Edit a page with a suitable name

2- In the "Page Attributes" box, set the template to "Valenti Drag & Drop Builder"

3- Scroll down to see the "Valenti Drag & Drop Builder" box

There are four sections that compose a Valenti Homepage. They are all optional.

Section A is a full-width section.

Section B is a section that has a sidebar.

Section C is a full-width section.

Section D is a section that has a sidebar.

4- Click on "Add New" In any of the sections and you will be able to select the type of module to use and select the details for that module.

5- Once all your modules are setup Publish/Update your page.

6- Go to Appearance → Widgets

7- Depending if you added modules to Sections B and D, you will now see two new sidebar areas called "Section B Sidebar (Page Name)" and "Section D Sidebar (Page Name)", add widgets to these sidebars and they will appear next to the modules set in those sections.

8- In your Wordpress backend go To "Settings -> Reading" 

9- In the "Front Page Displays" choose the "A static page (select below)" option and in the "Front Page" setting choose the homepage page you created earlier.

 

Here is a short video demonstrating the speed and easy-to-use nature of the "Valenti Homepage Drag & Drop Builder":

Direct URL: http://www.youtube.com/watch?v=mqE0ox0i2B4

Valenti comes with a complex megamenu system that is very easy to use.

To use a Valenti megamenu:

1- Go to Appearance -> Menus

2- Setup the menus as normal. (Good guide: http://codex.wordpress.org/WordPress_Menu_User_Guide)

3- Each parent menu entry has an option called "Valenti Megamenu Type" where you can select the type of megamenu.

 

For categories there are four options available:

A- Valenti Standard Dropdown

B- Valenti Dropdown + Featured/Random + Recent Posts

If no posts are featured, this dropdown will show a random post on every refresh. To feature a post here:

1- Add or edit a post

2- Inside the“Valenti General Options” box there is a dropdown called "Valenti Dropdown Menu Featured", change it from being "off" to "Featured on category dropdown"

3- Publish/Update the post

C- Valenti Dropdown + Slider

D- Valenti Megamenu

For every other type of menu entry (page, custom, link, etc) there are two options available:

A- Valenti Standard Dropdown

B- Valenti Megamenu

An example of how a megamenu should be structured:

This menu layout comes out like this:

In order to have full control of every detail, the mobile device menu is separate from the main navigation menu. This allows you to have control over what you want mobile users to see in the mobile navigation menu.

To set the mobile menu:

1- Go to Appearance -> Menus

2- Setup a menu as normal, or if you want, you could also use an existing menu (Good guide: http://codex.wordpress.org/WordPress_Menu_User_Guide)

3- Set that menu to appear for the "Small-Screen Navigation Menu" option.

 

The mobile menu will appear if a user taps the "hamburger" icon, or he/she swipe the screen to the right of the screen and to hide the menu, they can swipe the screen to the left. This swipe detection can be turned off in Appearance → Theme Options  Navigation Menus by turning the "Show Slide In/Slide Out menu with swipe" setting on/off.

Since Valenti v2.0, you are now able to set the blog style to load using infinite scroll in blog style homepages and category pages.

To enable infinite scroll on a blog style homepage

1- Go to Appearance → Theme Options  Homepage

2- Under the "Infinite Scroll" option, select an option from the dropdown. It can be either set to "Off / Infinite Scroll / Infinite Scroll with Load More Button".

To enable infinite scroll on a category page

1- Go to Posts → Categories 

2- Add/Edit a category and you will see an "Infinite Scroll" option, select an option from the dropdown. It can be either set to "Off / Infinite Scroll / Infinite Scroll with Load More Button" and save the category settings.

 

Couldn't be simpler.

To set the base global style for the entire website, including background images/colors and color for menu hovers, review colors, etc. You can change them in the theme options.

These options are applied to the entire website, however, if a category has its own global color and/or background options, then they will override whatever is set in the global style options.

1- Go to Appearance → Theme Options  Styling

2- Set global colors and/or global background options

Valenti can use any of the several hundreds of Google fonts available. You can select one font for the body text (often a clean, light font) and another font for everything else (menu font, titles, etc).

Valenti comes with a dropdown option of recommended fonts:

1- Go to Appearance -> Theme Options -> Typography

2- Select a font in both “Recommended” drop downs

3- Click on “Save Changes

 

To use a Google Font not in the dropdown lists:

1- Go to Appearance -> Theme Options -> Typography

2- Enter the code provided by Google Fonts in Quickuse Step 4 into the “Override” boxes without the “Font-family:” part. Example if step 4 says font-family: 'Cantora One', sans-serif; you should only enter 'Cantora One', sans-serif;

3- Click on “Save Changes

To add a review box to a post:

1- Add/Edit a post with a suitable name

2- Inside the“Valenti Review System” box there is a checkbox called "Include Review Box" to enable the review

3- Once enabled, fill in all the details for the review.

4- Publish/Update the post

To make the post a "Video" post type and show a specific video:

After logging into your admin Wordpress account:

1- Add or edit a post with a suitable name

2- In the "Format" box, select "Video"

3- A new metabox will appear above your post content (Valenti Post Format: Video), enter the video embed code there. Example On a Youtube video click on "Share" then "embed" and copy the code provided

4- Publish/Update the post

To make the post a "Audio" post type and include a song:

After logging into your admin Wordpress account:

1- Add or edit a post with a suitable name

2- In the "Format" box, select "Audio"

3- A new metabox will appear above your post content (Valenti Post Format: Audio), enter the audio embed code there. Example On a Soundcloud song click on "Share" then and copy the code provided in the "Widget Code" box.

4- Publish/Update the post

To make the post a "Gallery" post type and have a slideshow:

After logging into your admin Wordpress account:

1- Add or edit a post with a suitable name

2- In the "Format" box, select "Gallery"

3- A new metabox will appear above your post content (Valenti Post Format: Gallery), lick on the "Select or Upload images" button and select/upload the images. 

4- Publish/Update the post

To create a post with a background slideshow as seen on http://valenti.cubellthemes.com/videogames/post-with-background-slideshow-video-review/:

1- Edit/Add a post.

2- In the Valenti General Options box select the "Background" featured image style.

3- In the Valenti Background Options box there is an option called "Background Image", click on the "select or Upload Images" button

4- Select/Upload the images you wish to have in the background slideshow

5- Update/Publish the post

To add a tile gallery like the ones seen on http://valenti.cubellthemes.com/videogames/post-with-background-slideshow-video-review/:

1- Install Wordpress Jetpack Steps can be found here

2- Activate the Jetpack Module called "Tiled Galleries"

3- Edit/Add a post

4- Create and add a new Wordpress gallery and select the "Tiled" type. Tutorial can be found here

5- Update/Publish the post

To make a long post have several pages (add pagination) simply add <!--nextpage--> in the post text-editor where you would like split the post. Note: You must be in "text" view when editing the post to paste that code.

Valenti allows you to have posts that don't use a sidebar (full-width). To do this:

1- Add or edit a post with a suitable name

2- Inside the“Valenti General Options” click on the Post Style image you wish to use

3- Publish/Update the post

Valenti allows you to have pages that don't use a sidebar (full-width). To do this:

1- Add or edit a page with a suitable name

2- Inside the“Page Attributes”  box click on the Template dropdown and select "Full-Width"

3- Publish/Update the page

To have a contact page like the one seen on the Valenti demo:

1- Go to Plugins < Add New

2- Search for "Contact Form 7" and install it

3- After activating the plugin, there will be a new option in your Wordpress backend. Go to Contact

4- There will be a default contact form created, simply copy the code of it under "Shortcode" (should be similar to: [contact-form-7 id="2841" title="Contact form 1"])

5- Add/Edit a page with a suitable name

6- Paste the shortcode code of the contact form 

7- Publish/Update the page

 

Valenti already comes with predefined styles for Contact Form 7.

Valenti comes with multiple author template pages.

1- Add/Update a new page with a suitable name

2- Inside the“Page Attributes”  box click on the Template dropdown and select either "Meet the team" or "Meet the team (no sidebar)".

3- Publish/Update the page

4- Go to Users → All users

5- Edit the users you want to show on the Meet the team template

6- Under the "Meet The Team Page Template Options" title tick the "Show User On Template" checkbox

7- Optional Step: Authors will appear in alphabetical order by default. If you wish to override the order and put a specific few authors in the first positions, you can specify a position in the "Template Order Override".

8- Update profile

 

 

You can customize each category to look different. This is very easy to do, when creating a new category (or editing an existing one) you will see Valenti-exclusive options:

Blog Style: This changes the way post are displayed on the category page, the styles look like this:

Category Global Color: This color sets the main color for the category (Menu hover color, review boxes, etc)

Show Grid Slider: This adds a grid or a slider above the posts displayed on a category page.

Custom Sidebar: Enable/Disable a custom sidebar for the category. To read more on this go to the Sidebars section in this documentation.

Background Options: Give the category a custom background, can be an image or a background color.

You can add CSS code or code that you want to add to the <head> or <footer> sections by using the Theme Options. This way your changes will not be lost if you update the theme.

To add custom code:

After logging into your admin Wordpress account:

1- Go to Appearance -> Theme Options -> Custom Code

2- Enter your custom code in the relevant box (CSS box, <head> box or <footer> box)

To add Google Anayltics code, simply copy and paste the code they provide you and add it to the "Code for <head> section" in the "Custom Code" tab in the Theme Options. Ensure the code goes in this box, as this is what Google recommends.

To give authors avatar images (that appear in the about the author box, comments sections, etc - you have two options:

1- Install a free plugin called "Simple local avatars" which when installed, adds a image upload option in the "edit profile" page to upload an image and use as avatar.

2- Create a free account on http://www.gravatar.com and make sure the email of the user is the one used to create the Gravatar account.

Valenti does not force a website to have a specific format to show the title at the top of the browser, this is to provide the freedom to set them up as you wish. It is recommended to install a free SEO plugin such as: All-In-One Seo or SEO by Yoast. Both these plugins will allow you to set the titles as you wish to show them and at the same time improve your SEO.

Valenti comes with x widgets:

Valenti 125px x 125px ads: This widget allows you to add the code to six different 125px/125px ads. Simply copy and paste the ad code into each option and the widget will output it all. Code can be any type of code. 

 If you only banner images and you want to make them all clickable to specific URLs, you can enter code like this to the options:

<a href="http://this-is-the-url-you-want-to-link-to"><img src="http://this-is-the-url-of-the-image-banner" alt=""></a>

 

Valenti Facebook Like Box: This widget shows a Facebook Like Box of any Facebook page. Add to increase the likes on your page. 

Valenti Google+ Follow Widget: This widget shows a Google+ Follow widget for a Google+ page. Add to increase the follows on your page. 

Valenti Recent Comments With Avatar: This widget shows the latest comments made on the site with the avatars of the people who left the comments. 

Valenti High Resolution Image Widget: This widget shows a single image with the option to set a high resolution (Retina) image. Recommended for footer logos. 

Valenti Popular Posts: This widget shows the most popular posts from a specific category or all categories. You can also set the number of posts to show and show them with either big thumbnails or small thumbnails.

Valenti Latest Posts: This widget shows the latest posts from a specific category or all categories. You can also set the number of posts to show and show them with either big thumbnails or small thumbnails.

Valenti Latest Posts Slider: This widget shows the latest posts from a specific category or all categories in a slider. You can also set the number of posts to show.

Valenti Multi-Widget: This widget is used to show multiple widgets in one. To use it:

1- Drag multiple widgets to the "Valenti Multi-Widgets Area"

2- Drag the "Valenti Mulit-widget" to the sidebar where you wish to show the multi-widgets.

Valenti Social Media Icons: This widget allows you to add social media icons of popular social networks and link them to your own pages. 

Valenti Top Reviews: This widget shows the reviews with best scores from a specific category or from all categories. You can also set the number of posts to show and only show reviews from a specific time: All-time/Last Month/Last 7 Days/2013/2012/2011

Valenti comes with eight different shortcodes for you to use. To insert them into your posts/pages, use one of the eight new buttons located in your post-editing toolbar.

1. Buttons

Adds a clickable button with the following options:

Button URL: The url that is opened when the button is clicked

Button Text: The text to show on the button

Size: Normal sized Button or Big Button

Color: White, Pink, Yellow, Green, Red, Grey, Brown, Black or Blue

Alignment: None or center

Open In: Same window or New window

Rel: Follow or No follow ("no follow" is recommended to be used for affiliate type of links - for SEO purposes)

2. Toggler

Reveal hidden text when clicking on a title.

Title: Clickable text that reveals the Hidden Text

Hidden Text: The text to be revealed when the title is clicked.

3. Dropcap

Size: Size of the dropcap, can be big or small.

Dropcap Letter: The dropcap letter.

4. Alert Box

Alert Text: Text that is shown in the alert

Background Color: The background color of the text

5. Author Box

Author ID: Enter ID of author you wish to show

Block Title: The title that appears above the author box

6. Highlight Text

Background Color Hex Value: The background color for the text, must be entered as a hexadecimal (example: #e1e1e1). If left blank, the background color will be the global color set in the theme options.

Highlighted Text: The text to go over the background color.

7. Tabs

Clickable tabs. Enter the title + content of each tab.

8. Columns

Split content into columns.

If you wish to insert two columns (50% width each) you must insert a column with the following settings "One Half + First" and another one that is "One Half + Last". If you wish to insert four columns (25% width each) you need to insert "One Quarter + first" and then "One Quarter + Middle" and then "One Quarter + Middle" and lastly "One Quarter + Last".

9. Divider

Inserts a content divider with a title. To insert a divider all that is needed is to enter a title.

10. Video Gallery

To insert a video gallery select the Gallery Size (2, 3 or 4) then fill in the Video ID, URL of the image thumbnail that will appear and the caption that will appear under the video in the lightbox.

Valenti automatically detects if a site is installed in a RTL language. If it is, Valenti will load the RTL CSS file. Simple!

To install Wordpress in your own language

Since v1.5, Valenti is compatible with custom post types, which means that your custom posts will now also show the post meta boxes (featured image styles, reviews, color options, etc). If the custom post type has the category taxonomy enabled and the custom posts are assigned to categories, the posts will now appear in the blog styles and in the pagebuilder's modules too.

You only need to do this to get this all to work:

1- Go to Appearance → Theme Options  Custom Code

2- Write the names of your custom post types into the "Custom Post Type Names" input box and if you have more than one, separate them using a comma, example: books, movies

Tip: To find out the custom post type name quickly, simply go to your WordPress backend and hover your mouse over the custom post type item in the menu, at the bottom of the browser you should see a URL ending in something like this: "edit.php?post_type=movies" and whatever is after the "=" is the name you need to enter in the input box, in this case you would enter "movies".

Valenti is fully-compatible with Disqus Comments. 

After following the instructions found in http://disqus.com/admin/wordpress/ you must do one final step:

1- Go to Appearance → Theme Options  Custom Code

2- Add your forum shortname in the "Disqus Forum Shortname" box. This is to tell Valenti to count the comments from Disqus.

Valenti includes bbPress integration, which means not only does it re-style it completely to match the rest of the site's design, it also adds bbPress links to the login with ajax (if used) so users can quickly register, login, see/edit their profile and quickly go see their favorites/subscriptions etc (this is all added automatically to the login with ajax modal as soon as you activate bbPress on a Valenti site).

All that needs to be done to use bbPress Forums is to:

1- Go to Plugins -> Add New and search for "bbPress"

2- Install and activate bbPress

3- Create your forums by going to "Forums -> Add New"

4- Setup your forum options by going to "Settings -> Forums"

5- Go to "Theme Options -> bbPress" and you can set a global color for bbPress (color used in menu hovers, widget underlines, etc), set a bbPress style (left sidebar, right sidebar, no sidebar/full-width), set the background color for sticky posts and set a background image/color to be used on the bbPress pages of your site.

For support or help with using bbPress or bugs in the plugin, you need to use the bbPress support forums which can be found here bbPress Support Forum.

Valenti also includes BuddyPress integration, which means not only does it re-style it completely to match the rest of the site's design, it also adds BuddyPres links to the login with ajax (if used) so users can quickly register, login, see/edit their social profile and quickly check their messages/groups, etc (this is all added automatically to the login with ajax modal as soon as you activate BuddyPress on a Valenti site).

All that needs to be done to use BuddyPress is to:

1- Go to Plugins -> Add New and search for "BuddyPress"

2- Install and activate BuddyPress

3- Read the documentation to learn to use specific aspects of the plugin here: BuddyPress Documentation

4- Go to "Theme Options -> BuddyPress" and you can set a global color for BuddyPress (color used in menu hovers, widget underlines, etc), set a BuddyPress style (left sidebar, right sidebar, no sidebar/full-width) and set a background image/color to be used on the BuddyPress pages of your site.

For support or help with using BuddyPress or bugs in the plugin, you need to use the BuddyPress support forums which can be found here BuddyPress Support Forum.

Valenti also includes WooCommerce integration, which means that the style/design of your WooCommerce shop will match the rest of the Valenti theme design. To use WooCommerce with Valenti simply:

1- Go to Plugins -> Add New and search for "WooCommerce - excelling eCommerce"

2- Install and active the plugin

3- If you are new to WooCommerce, you can find a "Getting started" guide here.

4- Go to "Theme Options -> WooCoommerce" and you can set a global color for WooCommerce (color used in menu hovers, widget underlines, etc), set a WooCommerce style (left sidebar, right sidebar, no sidebar/full-width) and set a background image/color to be used on the WooCommerce pages of your site.

Note: WooCommerce was created by WooThemes, and they only provide support to people who have purchased WooThemes themes. However, if you run into any problems with the plugin, your first stop should be their online documentation, which is very thorough and covers most aspects of the plugin, this documentation can be found here: WooCommerce Documentation.

If you are looking to add extra functionality to WooCommerce, you need to find a plugin for that, and there are three main places to look for WooCommerce extension plugins:

1- WordPress plugin repository - Here you can find a few free extensions for WooCommerce.

2- WooCommerce official extensions - Here you can get official WooCommerce extensions for almost every purpose.

3- CodeCanyon.net eCommerce section - Here you can also find a lot of WooCommerce extensions.

Valenti comes with everything setup to easily translate it into any language. 

English, French and Spanish are already prepared, but to translate into a different language:

1- Go to the theme translation folder, which is located in "valenti/library/translation/"

2- Make a copy of the file 'default.po' and rename the file to the locale of your language, example: Spanish would be 'es_ES.po'

3- Open Poedit (can be downloaded for free from http://www.poedit.net/) and open the file you have created in it

4- Translate all the strings and save your changes. After you save, you will have two files, example: Spanish would have 'es_ES.po' and 'es_ES.mo'

5- Upload these files to "valenti/library/translation/"

6- Make sure your WordPress config file (located in the root of your website "yoursite/wp-config.php") has the following line set to your locale: "define ('WPLANG', 'es_ES');"

Recommended Theme Update Method:

When Valenti is activated it recommends three plugins. One of them is called "Envato Wordpress Toolkit" which when enabled and setup, will automatically alert you on your Dashboard when a new version of the theme is available and allows you to install it with only a few clicks.

If you did not install the plugin when you first installed Valenti, and wish to install it now, please follow these steps:

1- Go to Appearance → Install Plugins

2- Hover over "Envato Wordpress Toolkit" and click on "install plugin"

3- Go to Plugins → Installed Plugins and activate "Envato Wordpress Toolkit"

A very good tutorial on how to use this plugin can be found at: http://wpmu.org/envato-wordpress-toolkit-a-themeforest-auto-updater/

 

All your settings should remain intact after updating the theme (menu settings, theme option settings, etc).

IMPORTANT: Once the theme is updated, you need to go to Appearance → Install Plugins and check the status of "Cubell Themes Functionality" plugin, if it says "Not Updated", simply hover over the plugin name title and click "update".

 

Alternative Theme Update Method:

You can also update the theme manually by going to Themeforest.net, logging into your account and downloading the latest Valenti version. 

For users who are not using a Child Theme:

1- Deactivate your current Valenti version in the Theme section (This can be done by activating any other theme)

2- Delete the Old Valenti theme from your website

3- Upload the new version of Valenti as normal and activate it

For users who are using a Child Theme:

1- Delete the Old Parent Valenti theme from your website

2- Upload the new Parent version of Valenti and keep the child theme active

IMPORTANT: Once the theme is updated, you need to go to Appearance → Install Plugins and check the status of "Cubell Themes Functionality" plugin, if it says "Not Updated", simply hover over the plugin name title and click "update".

 

All your settings should remain intact after updating the theme (menu settings, theme option settings, etc).

When you download the theme from Themeforest, the file you get includes multiple things, one of them is a file called: valentidemo.wordpress.2013-10-16.xml. This XML file contains all the data from the v1.0 demo (Except the licensed images, which are replaced by placeholders), to import it:

1- After logging into your WordPress backend go to Tools -> Import

2- Select the WordPress option (Install plugin that popups if it isn't installed)

3- Select the XML file from the file you downloaded and run the import process

Once the importing is complete:

- Go to “Settings -> Reading” and set the front page to display a “front page” then select one of the demo homepages from the list (the demo homepage uses page "Homepage One")

- Go to Appearance -> Menu and set “Main Nav” menu to the “Main Navigation Menu” theme location

- Go to the "theme options" and upload/select your logo

- Go to the "widgets" section and add widgets to the "footer 1", "footer 2" and "footer 3"

- In the "widgets" section add widgets to "Section B Sidebar (Homepage One page)" and "Section D Sidebar (Homepage One page)" - These are the widget areas that are on the sidebars in the homepage

And that is pretty much it, shouldn't take more than a few minutes.

If you are having issues with Valenti, please ensure that the solution isn't already covered in this documentation.

If you read the documentation and can not find the answer to your issue, please open a ticket with as much information about the problem as possible at:

http://support.cubellthemes.com

Information that you should include in your ticket:

- Did you disable all the plugins to test if the problem is being caused by a plugin?

- Wordpress Version?

- Valenti Theme Version?

- Website URL with problem

 

We will try to fix all theme-related bugs that are reported, but please remember, we do not provide theme customizations services (not even paid), however, if you open a ticket in the support system explaining the customization you are trying to achieve, depending on free-time, we may be able to give you basic advise on the best way to achieve it.