VÉLO WordPress Theme

THEME INSTALLATION

To install Vélo you must have a working version of WordPress already installed. Make sure your installed Wordpress version is 4.3 or higher. You also need to have PHP 5.5 or higher versions and MySQL 5.0 to function correctly. If you need help installing WordPress, follow the instructions in WordPress Codex

When you purchase Vélo, you need to download our theme package on from Themeforest.

Extract our full package, then you will see all the files and folders, including 01 .zip files and 06 folders. Below is a full list of everything that is included when you download our theme, along with a short description of each item.

Following some steps below, you can completely install Vélo in few minutes.

• Step 1: Login to your WordPress Admin


• Step 2: Go to Appearance >>> Themes >>> Add new


• Step 3: Click to Upload >>> Select installation files, choose Vélo.zip.


• Step 4: Click Install now button and then wait while the theme uploaded and installed


• Step 5: Finally, click the Activate link

If you get the “Are You Sure You Want To Do This” message when installing Vélo via WordPress, it means you have an upload file size limit. Install Vélo via FTP if this happens, or call your hosting company and ask them to increase the limit.

If you get this message when you install our theme on localhost, here is a solution for you:

• Through php.ini file

Step 1 - Find the php.ini file on your host

Step 2 - Find the following lines and adjust the value. We suggest to change the upload file limit to 10M


• Through function.php

You may add the below mentioned code in the functions.php file of your theme

@ini_set( 'upload_max_size' , '64M' );
@ini_set( 'post_max_size', '64M');
@ini_set( 'max_execution_time', '300' );
• Through .htaccess method

You may try modifying the existing .htaccess file in the root directory or creating a new one.

Add the following code in the existing or new htacess file:

php_value upload_max_filesize 64M
php_value post_max_size 64M
php_value max_execution_time 300
php_value max_input_time 300

• Step 1 – Log into your hosting via an FTP software


• Step 2 – Unzip the Vélo.zip file, and ONLY use the extracted Vélo theme folder


• Step 3 – Upload the extracted Vélo theme folder into /wp-content/themes/.


• Step 4 – Login to your WordPress Dashboard, go to Appearance >>>> Themes


• Step 5 – Click to Activate link to enable Vélo theme

INSTALL DEMO DATA

There are also 02 different ways to help you import Vélo demo content. However, each way has its own purposes which are worth noticing:

• Import All Demo Content: If you want to import OUR entire demo data using one click demo, all YOUR current data will be dissappeared. So, before implementing this step, start backup your database to ensure all the important information will be reserved.


• Manual Demo Import: If you choose to import manually some data from other websites, usually you have to import an XML file (called Sample Data and included in our package)

Please Note These Important Items about The Demo Content

Images - Our demo images are not included because they are licensed stock items that are not allowed to be shared. So, they will be modified by placeholders, you need to contact authors to get permission in case you want to use them in your commercial or non-commercial projects.

Below are the detailed guides for each method:

Import Manual Demo Content

---

This is the second way for you to import our demo content. Continue reading below to learn how to manually import demo content.

Check The Following Plugins Before Import

• Visual Composer: The most popular page builder for WordPress


• Advanced Custom Fields Pro: A graphic user interface layer for custom fields


• K2T Velo shortcodes: A plugin which includes all shortcodes for theme which helps you build your own pages



That are required plugins to use this theme, besides there are some recommended plugins including Contact Form 7, Ajax Search Pro, Booking System PRO, Black Studio TinyMCE Widget, Custom Sidebars, DHVC Form, Icegram, Revolution Slider, zM Ajax Login & Register, WPML Multilingual CMS, WPBackery Visual Composer, WP Instagram Widget, Woocommerce, Woocommerce Products Layouts, Woo Details Product Page Builder and YITH WooCommerce Wishlist

How to Install Plugins

Once you activate Vélo, you will see a notification message to install and activate the required and recommended plugins

• Step 1: Click to Begin installing plugins



• Step 2: Select All the plugin >>> Install, then click to Apply



• Step 3: Click to Activate to enable the plugins you want to use

Where To Find Demo Files

But before moving straight to the point, there are some notes worth checking:

• Make sure you have installed all recommended plugins before importing sample data.
• In /Sample Data/ folder of our package, you can find 04 files which are:
1. velo.xml - Includes all dummy data of some pages from our demo
2. velo-themeoptions.txt - Theme Options Settings from our demo
3. velo-widgets.wie - Widgets settings
4. velo-revoslider.zip - Revolution slider settings
5. velo.database.mysql - Mysql Database from our demo
• The import process may take several minutes due to large data and your server capacity. If your server setting "Max Execution Time" is too low, increase it (as your hosting provider). Please do not close the browser until it finishes. If it fails, you can run this process again until seeing the "Success Message".
  Demo Images are not installed due to some copyrighted licenses
• If you have to run the process more than once, menu items may be duplicated. Just go to Appearance > Menus and edit/delete Menu items
• Feature images are not imported (We use licensed photos on our demo page). Instead you will see placeholder images.

How To Import XML Files

To install sample data, please following these steps below:

• Step 0 - Make sure you have installed Vélo theme and all required & recommended plugins


• Step 1 - Go to Tools >>> Import, then click to "WordPress" and wait until installation is finished



• Step 2 - If it is not yet installed before, you have to install it by clicking on Install Now

• Step 3 - After installed successfully, click on Activate Plugin & Run Importer

• Step 4 - When the installation is done, go ahead and click to "Choose File" button and import Vélo-wordpress-import.xml file. Don't cancel the importing process

• Step 5 - When you see the message "All done. Have fun!", you will know that the import process is done. Note: you may need to re-import the second time if the data is large.

And now you finished!

• Step 6 - Done, then you have to set Homepage, Menu, Widgets for your site

NOTE: You can get the .xml file by going to Tools >> Export >> Choose file and click "Download Export File". In the screenshot above, we have exported all content demo data. Then we got the file named "content-export.xml"

How To Import Revolution Slider

To install revolution slider, please following these steps below:

• Step 1: First, go to Revolution Slider >> Import Slider

• Step 2: Choose .zip file to upload and import. Click "Import Slider" to finish!


• Step 3: In case you want to export slider from a website, you can go to Revolution Slider. And then hover to the slide that you might want to export data. Click to the down arrow sign >> Export Slider

How To Import Theme Options Data into WordPress

To transfer theme options data into your website, go to Apperance >> Theme Options >> Backup Options >> Import Options (.txt file)

NOTE: You can get the .xml file by going to Tools >> Export >> Choose file and click "Download Export File". In the screenshot above, we have exported all content demo data. Then we got the file named "content-export.xml"

When you see the message "All done. Have fun!", you will know that the import process is done. Note: you may need to re-import the second time if the data is large.

And now you finished!

HOW TO

This is necessary steps for you to setup your site

1. Upload Logo

To upload your logo, you navigate to Theme Options. Please follow the below steps to upload your logo:

• Step 1: Login to your WordPress Dashboard


• Step 2: Go to Appearance >>> Theme Options >>> Header



• Step 3: After clicking to Header tab, you scroll to the bottom of page - Logo section and upload your logo. The logo size in our demo is 116x33px. Please use jpg, jpeg, png or gif image for best performance.


• Step 4: If you want to use Text logo, you turn ON and fill text you want to show, for example the name of your site


• Step 5: If you want to make retina logo, you can use a big logo (2x times your regular logo dimension.). The retina logo in our demo is 232x66px


• Step 6: There are also options to choose alignment of the logo, and adjust the left, top logo margins. This allows you to fine tune the placement of your logo.


• Step 7: Click to Save all changes and see them on front-end.

Note: If your logo is narrowed down in tiny shape

• (1) You can resize it by navigating to Appearance >> Theme Options >> Header >> Headers Section. Then move your mouse pointer to the space between two blocks. If the logo block was too small, you need to resize it until you satisfy with the result.

• (2) Also, don’t forget to adjust the padding size in “Logo Margin” of Theme Options. That is also the reason causing the logo’s narrowing. The final way to resolve this problem is to have some code knowledge to be able to edit the height of header section.

• (3) You can remove the max height limit by adding this code to Apperance >>> Theme Options >>> General >>> Custom CSS .k2t-logo, .k2t-logo img { max-height: inherit; max-width: inherit }

2. Upload Favicon

To upload your favion, you navigate to Theme Options. Please follow the below steps to upload favicon:

• Step 1: Go to Appearance >>> Theme Options >>> General



• Step 2: You scroll to the bottom of page - Icons section
  Favicon - Favicon is a small icon image at the topbar of your browser. The size should be a 16x16px or 32x2px Png/Gif image

• Step 2: You can upload icons for iphone, ipad
1. Iphone icon - The iPhone icon is a file used for a web page icon on the iPhone. When someone bookmarks your web page or adds your web page to their home screen, this icon is used. If this file is not found, these products will use the screen shot of the web page, which often looks like no more than a white square.


2. Iphone retina icon - The same as iPhone icon but for Retina iPhone.


3. Ipad icon - The same as iPhone icon but for iPad.


4. Ipad retina icon - The same as iPhone icon but for Retina iPad.

1. How To Create A Menu

Follow the below steps to create a new menu:

• Step 1: Login to the WordPress Dashboard


• Step 2: Go to Appearance >>> Menus , then click to Create a new menu at the top of page



• Step 3: Enter the name for your menu in the Menu Name box


• Step 4: Click to Create Menu button

Your menu is created, now you can add pages for menu. Please follow the below steps

2. How To Add Pages To Your Menu

You can choose pages to add to your menu in Pages section in the left corner. Besides, you also can add posts, custom links or categories to menu

• Step 1: Click to Pages section in the left corner of Dashboard


• Step 2: Select the View All to see all published pages on your site



• Step 3: Select pages you want to add to menu by check the box and click to Add to Menu


• Step 4: If you want to add items to menu by using custom link, you click to Custom link, fill URL link and Link text, then click to Add to Menu



• Step 5: To create sub-menu of the parent menu, you just drag and drop items to the right side a distance compared with the parent menu



• Step 6: Click to Save menu button once you have added all items you want to menu.


• Step 7: You have to assign your menu to the location you want, please follow some steps below

3. How To Assign A Menu To a Location

After you have created a menu, you have to assign it to one of the pre-defined locations. Follow the below steps to assign a menu to a Location

• Step 1: Go to Appearance >>> Menus and click Manage Location


• Step 2: Assign each Theme Location with a menu, you can assign a menu to several Theme Locations


• Step 3: Click to Save Changes button

Menu is displayed on front-end

4. How To Create Mega Menu

Vélo supports Mega menu feature. The Mega Menus are available for the first level items of menu in "Main Menu" area. Follow some steps below to create a mega menu:

• Step 1: Only first level items can enable the Mega Menu. Click the “arrow icon” next to any parent level menu item to expand the option box.


• Step 2: Check the box "Enable Mega Menu"


• Step 3: Select Yes to display the “Mega Menu Fullwidth”. Also choose "Mega Menu Position" such as Left or Right.


• Step 4: If using Mega menu background, click the “Upload Image” button to upload an image


• Step 5: Now you need to add child items for the first level item, like the image below

• Step 6: Now, you need to add child items for the second level items, like the image below


The mega menu on front-end should be dispayed like the below image:


• Step 7: Click to Save Changes button

1. How To Add A New Post

To create a new post, you follow the below steps:

• Step 1: Login to your WordPress Dashboard


• Step 2: Go to Posts >>> Add new post


• Step 3: Then, you enter your post title, contents in the text editor



• Step 4: You need to select post format, category and add tags


• Step 5: Upload a featured image for your post


• Step 6: Scroll down to Post options box, you will need to setup some options about layout, metadata, format. Please check Post options for more information


• Step 7: Click to Publish post

2. How To Add A Gallery Post

To create a gallery post, you follow the below steps:

• Step 1: Login to your WordPress Dashboard


• Step 2: Go to Posts >>> Add new post


• Step 3: Then, you enter your post title, contents in the text editor

• Step 4: You need to select "Gallery" post format, select category and add tags

• Step 6: Scroll down to Post options box, click to Post format tab, you will see Gallery format and some other options


• Step 7: CLick to Add to gallery to select and upload images you want to gallery



• Step 8: Setup some options for your gallery:
1. Gallery format: add images, audio, video... from gallery.


2. Gallery auto play: True or False. If you choose True, your gallery will play in auto. Default is False.


3. Gallery duration time: fill duration time for your gallery. Default is 5000.


4. Gallery speed: custom the speed. Default is 300.


5. Gallery pagination: True or False. If you choose True, your gallery will be paginated. Default is False.


6. Gallery navigation: True or False. If you choose True, your post will have gallery navigation. Default is True.


7. Gallery mousewheel using: True or False. If you choose True, the gallery can be used by mousewheel. Default is True.


• Step 9: Upload a featured image for your post


• Step 10: Click to Publish post


• Step 11: When your post is published, it can be the below image:

3. How To Add A Video Post

To create a video post, you follow the below steps:

• Step 1: Login to your WordPress Dashboard


• Step 2: Go to Posts >>> Add new post


• Step 3: Then, you enter your post title, contents in the text editor

• Step 4: You need to select "Video" post format, select category and add tags

• Step 6: Scroll down to Post options box, click to Post format tab, you will see Video source and video format link

• Step 8: Setup some options for your video:
1. Video source: Select video source: video link, upload local file, video embed code.


2. Video format URL: You can only add link from Vimeo and Youtube
• Step 9: Upload a featured image for your post


• Step 10: Click to Publish post


• Step 11: When your post is published, it can be the below image:

4. How To Add An Audio Post

To create an audio post, you follow the below steps:

• Step 1: Login to your WordPress Dashboard


• Step 2: Go to Posts >>> Add new post


• Step 3: Then, you enter your post title, contents in the text editor

• Step 4: You need to select "Audio" post format, select category and add tags

• Step 6: Scroll down to Post options box, click to Post format tab, you will see Audio source and soundcloud format link

• Step 8: Setup some options for your audio:
1. Audio source: Select audio source: soundcloud link or upload local file.


2. Soundcloud format URL: Insert soundcloud link, or link audio from other websites (option for format "Link" only, please fill in full http:// address).
• Step 9: Upload a featured image for your post


• Step 10: Click to Publish post


• Step 11: When your post is published, it can be the below image:

5. How To Add A Quote Post

To create an quote post, you follow the below steps:

• Step 1: Login to your WordPress Dashboard


• Step 2: Go to Posts >>> Add new post


• Step 3: Then, you enter your post title, contents in the text editor

• Step 4: You need to select "Quote" post format, select category and add tags

• Step 6: Scroll down to Post options box, click to Post format tab, you will see Quote

• Step 8: Setup some options for your audio:
1. Quote author: Fill the author name of the quote.


2. Author quote URL: Add author link.


3. Quote content: Fill the quote.
• Step 9: Upload a featured image for your post


• Step 10: Click to Publish post


• Step 11: When your post is published, it can be the below image:

1. How To Create A Blog Page

• Step 1: Login to your WordPress Admin


• Step 2: Go to Pages >>> Add new page


• Step 3: Enter title for your blog and select template for your blog in "page attribute"



• Step 4: Scroll to Page options, you will need to setup some options about layout, titlebar for your blog page. Please see Page options to know more details
1. Page layout: You can select sidebar for your blog page including right sidebar, left sidebar, 100% width.



2. Page titlebar: You can select show/hide titlebar. Please see Page options to know more details

3. Blog: Allow you to select specific categories of posts for your blog page

4. Step 5: Click to PUBLISH page

2. How To Setup Blog Category Page

To setup for your blog category page, please go to Theme Options and follow the below steps. All the changes that have been made in this 'Blog' section of Theme Options will effect the entire website. That means if you make any adjustments in a certain page, it will overwrite options in Theme Options.

• Step 1: Login to your WordPress Admin


• Step 2: Go to Appearance >>> Theme Options


• Step 3: Click to Blog tab, you wwill see blog setting options



• Step 4: In Blog layout there will have options for you to setup layout, sidebar, style for blog
1. Blog sidebar position: Right sidebar, left sidebar, two sidebars or no sidebar


2. Blog style: There are 4 styles icluding large, large 2, timeline, masonry, medium, small.



• Step 5: Blog options
1. Content or excerpt: select to display content or excerpt on the blog


2. Excerpt length: The number of displayed excerpt words


3. Infinite scroll: You can use Pagination number to navigate to the next page


4. Title link: You can show or hide title link


5. Post date: Enable to show published date information


6. Comments: Show the number of comments


7. Author: Show the name of author


8. "Readmore" link: Show the readmore button

• Step 6: Finally, Save changes


• Step 7: When your blog page is published, it can as the below image

front-end setttings

To create a homepage, please follow the below steps:

• Step 0: Make sure you created two new pages in WordPress (under Pages >>> Add new), and publish them. For the purpose of example, we’ll call these “Home” (for the front, or Home, page) and “Blog”.


• Step 1: Go to Settings >>> Reading in your WordPress Admin


• Step 2: Set "Front page displays" to a "Static Page"


• Step 3: In Front Page, choose a page which will be your homepage and select a page for posts page


• Step 4: Save changes

Sample Codes For Homepages

Here we provide you 04 demo pages, each comes with different style and purpose:

• 1. Homepage 1:

You can insert the following code into the back-end's visual section:

[vc_row session_layout="no_wrap" scrolldown="true" css=".vc_custom_1437189002492{margin-top: -20px !important;}" class="top-banner"][vc_column css=".vc_custom_1437116786663{margin-top: -30px !important;}"][rev_slider_vc alias="home2"][/vc_column][/vc_row][vc_row css=".vc_custom_1437187795251{margin-top: 70px !important;}" class="banner-top"][vc_column width="1/2"][banner banner_hover="round-border" text_box="All Bikes" text_size="30" color="#ffffff" anm="1" anm_name="fadeIn" anm_delay="500" image="1417" link="http://dev.sunrisetheme.com/velo/en/shop/"][/banner][/vc_column][vc_column width="1/2" class="left-banner"][vc_row_inner][vc_column_inner width="1/2"][banner banner_hover="round-border" text_box="Test Ride" color="#ffffff" style="small" anm="1" anm_name="fadeInDown" anm_delay="500" image="1419" link="http://dev.sunrisetheme.com/velo/en/test-drive/"][/banner][/vc_column_inner][vc_column_inner width="1/2"][banner banner_hover="round-border" text_box="Hire Bike" color="#ffffff" style="small" anm="1" anm_name="fadeInRight" anm_delay="500" image="1359" link="http://dev.sunrisetheme.com/velo/en/booking/"][/banner][/vc_column_inner][/vc_row_inner][vc_row_inner][vc_column_inner][banner banner_hover="round-border" text_box="Our story" color="#ffffff" style="medium" anm="1" anm_name="fadeInUp" anm_delay="700" image="2488" link="http://dev.sunrisetheme.com/velo/en/about-us/"][/banner][/vc_column_inner][/vc_row_inner][/vc_column][/vc_row][vc_row css=".vc_custom_1436280646480{margin-top: 100px !important;margin-bottom: 100px !important;}"][vc_column][heading h="h2" align="center"]POPULAR PRODUCTS [/heading][vc_column_text class="header-margin"] <p style="text-align: center; font-size: 18px;">These are the most popular bike products in our store to offer as chosen by our beloved customers. [/vc_column_text][recent_products per_page="9" columns="3"][button size="large" align="center" title="View More" link="#" mgt="20"][/vc_column][/vc_row][vc_row css=".vc_custom_1439265822490{padding-top: 100px !important;padding-bottom: 80px !important;}" background_gen_color="#f3f3f3"][vc_column width="1/4"][counter title_underline="true" number="24622" title="TEST RIDES"][/vc_column][vc_column width="1/4"][counter title_underline="true" number="6134" title="BIKES SOLD"][/vc_column][vc_column width="1/4"][counter title_underline="true" number="7516" title="BIKES HIRED"][/vc_column][vc_column width="1/4"][counter title_underline="true" number="12023" title="HAPPY COSTUMERS"][/vc_column][/vc_row][vc_row css=".vc_custom_1436771966406{margin-top: 100px !important;margin-bottom: 100px !important;}"][vc_column][heading h="h2" align="center" class="blogspot-heading"]Latest From Blog [/heading][blog_post style="2" slider="1" show_content="1" navigation="true" pagination="true" limit="9" items="3" items_desktop="3" items_tablet="1" items_mobile="1" cat="79"][/vc_column][/vc_row][vc_row css=".vc_custom_1439266063696{margin-bottom: 50px !important;}"][vc_column width="1/2" css=".vc_custom_1437185882863{margin-bottom: 20px !important;}"][iconbox layout="4" icon_type="no_icon" border="dashed" title="For all standard order in 30 days" link="#" link_text="More info here"]Free Shipping & returns [/iconbox][/vc_column][vc_column width="1/2" css=".vc_custom_1437185899896{margin-bottom: 20px !important;}"][iconbox layout="4" icon_type="no_icon" border="dashed" title="Hey! How we can support you?" link="#" link_text="More info here"]Vélocare Protection Plan [/iconbox][/vc_column][/vc_row]
• 2. Homepage 2:

You can insert the following code into the back-end's visual section:

[vc_row session_layout="no_wrap" scrolldown="true" class="top-banner"][vc_column css=".vc_custom_1437116790026{margin-top: -30px !important;}"][rev_slider_vc alias="home-slider"][/vc_column][/vc_row][vc_row css=".vc_custom_1436332548469{margin-top: 70px !important;margin-bottom: 50px !important;}"][vc_column width="1/3" css=".vc_custom_1437185939725{margin-bottom: 20px !important;}"][iconbox layout="4" icon_type="no_icon" border="dashed" title="Totally Free" link="#" link_text="More info here"] Test Drive [/iconbox][/vc_column][vc_column width="1/3" css=".vc_custom_1437185955810{margin-bottom: 20px !important;}"][iconbox layout="4" icon_type="no_icon" border="dashed" title="For all standard offer" link="#" link_text="More info here"] Free Shipping [/iconbox][/vc_column][vc_column width="1/3" css=".vc_custom_1437185974560{margin-bottom: 20px !important;}"][iconbox layout="4" icon_type="no_icon" border="dashed" title="Only in 30 days" link="#" link_text="More info here"] Free Returns [/iconbox][/vc_column][/vc_row][vc_row css=".vc_custom_1436281428093{margin-top: 100px !important;margin-bottom: 100px !important;}"][vc_column][heading h="h2" align="center"] FEATURED PRODUCTS [/heading][vc_column_text class="blogspot-heading" css=".vc_custom_1439220883702{margin-bottom: 50px !important;}"] <p style="text-align: center;">Customers' favorite products this week. What's so special? Check it out!</p> [/vc_column_text][featured_products per_page="2" columns="2"][/vc_column][/vc_row][vc_row session_layout="no_wrap" css=".vc_custom_1437188000051{margin-top: 100px !important;margin-bottom: 100px !important;}" background_gen_color="#ffffff" class="image-banner"][vc_column width="1/2" background_setting="bg_image" background_img_position="center bottom" background_img="1373" background_gen_color="#9cbebf" css=".vc_custom_1440728045201{padding-top: 280px !important;padding-bottom: 280px !important;}" class="middle-banner"][vc_column_text] [/vc_column_text][/vc_column][vc_column width="1/2" background_gen_color="#ffffff" css=".vc_custom_1441781277015{padding-top: 90px !important;padding-right: 100px !important;padding-bottom: 100px !important;padding-left: 100px !important;}" class="countdown-row"][heading h="h2"] DEAL OF THE WEEK [/heading][vc_column_text] Sale up to 30% only in a week [/vc_column_text][countdown day="Days" hour="Hours" minute="Minutes" second="Seconds" time="2015-12-15-24-00-00"][button icon_position="left" size="medium" title="Shop now" link="/shop"][/vc_column][/vc_row][vc_row css=".vc_custom_1436281572119{margin-top: 50px !important;margin-bottom: 50px !important;}"][vc_column][heading h="h2" align="center"] New Products [/heading][vc_column_text] <p style="text-align: center;">Check out what's going on in the store. Hurry up! Bestsellers often sold out in couples of weeks.</p> [/vc_column_text][recent_products per_page="12" columns="4"][/vc_column][/vc_row][vc_row css=".vc_custom_1439221069293{margin-top: 80px !important;margin-bottom: 50px !important;padding-top: 30px !important;padding-bottom: 20px !important;}"][vc_column][vc_row_inner css=".vc_custom_1436364954471{padding-top: 100px !important;padding-bottom: 80px !important;}" el_class="border"][vc_column_inner width="1/4"][counter number="24622" title="TEST RIDES"][/vc_column_inner][vc_column_inner width="1/4"][counter number="6134" title="BIKES SOLD"][/vc_column_inner][vc_column_inner width="1/4"][counter number="7516" title="BIKES HIRED"][/vc_column_inner][vc_column_inner width="1/4"][counter number="12023" title="HAPPY COSTUMERS"][/vc_column_inner][/vc_row_inner][/vc_column][/vc_row][vc_row session_layout="no_wrap" css=".vc_custom_1437188102251{margin-top: 50px !important;margin-bottom: 50px !important;}" background_gen_color="#ffffff" class="image-banner"][vc_column width="1/2" css=".vc_custom_1441781289383{padding-top: 90px !important;padding-right: 100px !important;padding-bottom: 100px !important;padding-left: 100px !important;}"][heading h="h2"] NEWSLETTER [/heading][vc_column_text] Sign up to receive the coupon 15% off for your first purchase via email and get informations about bicycle, accessories, tips,... and many exclusive offers. [/vc_column_text][vc_column_text] [simpleSubscribeForm] [/vc_column_text][vc_column_text] <p class="p1" style="font-size: 14px;"><em>*Discount applies only to orders over $100</em></p> [/vc_column_text][/vc_column][vc_column width="1/2" background_setting="bg_image" background_img_position="left bottom" background_gen_color="#b9bf9b" css=".vc_custom_1436365402318{padding-top: 300px !important;padding-bottom: 300px !important;}" background_img="1380" class="middle-banner"][vc_column_text] [/vc_column_text][/vc_column][/vc_row][vc_row css=".vc_custom_1436406320653{margin-top: 100px !important;}"][vc_column][heading h="h2" align="center" class="blogspot-heading"] Latest blog [/heading][blog_post style="2" rows_num="2" slider="1" pagination="true" limit="18" items="3" items_desktop="3" items_tablet="2" items_mobile="1"][/vc_column][/vc_row][vc_row background_setting="bg_image" background_img_size="cover" css=".vc_custom_1436403796574{margin-top: 100px !important;margin-bottom: 100px !important;}" class="banner-bottom"][vc_column][vc_row_inner el_class="bottom-banner-inner" css=".vc_custom_1436421550984{padding-top: 50px !important;padding-right: 50px !important;padding-bottom: 40px !important;padding-left: 50px !important;}"][vc_column_inner][vc_column_text class="test-drive"] Free test ride [/vc_column_text][vc_icon icon_fontawesome="fa fa-bicycle" color="custom" css_animation="left-to-right" custom_color="#ffffff" el_class="bicycle"][button size="medium" align="right" title="Book Now" link="#"][/vc_column_inner][/vc_row_inner][/vc_column][/vc_row]
• 3. Homepage 3:

You can insert the following code into the back-end's visual section:

[vc_row full_width="stretch_row_content_no_spaces" session_layout="no_wrap" css=".vc_custom_1441868455910{margin-top: -30px !important;margin-right: 0px !important;margin-bottom: 100px !important;margin-left: 0px !important;padding-top: 0px !important;padding-right: 0px !important;padding-bottom: 0px !important;padding-left: 0px !important;}" class="homepage3-slider"][vc_column][rev_slider_vc alias="home3"][/vc_column][/vc_row][vc_row][vc_column][heading underline="false" class="product-heading"] ALL BIKES [/heading][products columns="2"][/vc_column][/vc_row][vc_row session_layout="no_wrap"][vc_column width="1/2" background_setting="bg_image" background_img_position="left bottom" background_img="2323" background_gen_color="#9bbebe" css=".vc_custom_1439190342916{padding-top: 600px !important;}" class="coupon"] [/vc_column][vc_column width="1/2" background_setting="bg_image" background_img_position="center bottom" background_img="2324" background_gen_color="#b9be9b" css=".vc_custom_1439190402235{padding-top: 600px !important;}" class="coupon"] [/vc_column][/vc_row][vc_row class="middle-form"][vc_column width="1/3"][heading h="h2"] VÉLO [/heading][vc_column_text css=".vc_custom_1441299378660{margin-bottom: 25px !important;}"] <div style="font-size: 14px; font-style: italic; color: #949494;">Store Address CT16122 Collins Street West, Victoria 8007, Australia.Phone: +1 (2) 345 6789 Fax: +1 (2) 345 6789 Email: Contact@yourdomain.com</div> [/vc_column_text][vc_widget_sidebar sidebar_id="cs-1"][/vc_column][vc_column width="2/3"][heading h="h2"] Newsletter [/heading][vc_column_text] <div style="font-size: 14px; font-style: italic; color: #949494;">Sign up to receive a coupon 15% off for your first in store purchase. Get informations about bicycle, accessories, tips,... and many exclusive offers via email.</div> [/vc_column_text][vc_column_text]<code>[simpleSubscribeForm]</code> <div style="font-family: 'PT Serif', serif; font-size: 14px; font-style: italic; color: #ccc;">*In store sale applies only to orders over $100</div> [/vc_column_text][/vc_column][/vc_row]

Below is an example of WordPress theme with direct instruction for every section. This captures some main components in contributing a web page:

• Secondary Menu: This might not be included in some web designs. But you can customize it by navigating to Appearance >> Theme Options >> Header. Then you navigate to "Top Header Section" and click "On" to activate it.
• Top Navigation Sidebar: You can see in this demo.
• Search: You can also add more icons to Top Navigation such as Text Editor, Social, Widgets, Canvas Sidebar, Woocommerce Cart, Logo, Custom Menu by navigating to Theme Options >> Header. Then scroll down to "Middle Header Section".
• Primary/Main Menu: In order to change all the title in the main menu, you can go to Appearance >> Menus. More information
• Logo: You can change logo by navigating Appearance >> Theme Options >> Header. Then scroll down to 'Logo' section. More information
• Revolution Slider: This section seperates the main body and the menu header. It is often focused because it is the most popular way to attract users by its flexible slider and appealing messages on that.
• Page Content:This section of a web page plays the most important role partly because it contains visual block, content, image, video, which are built by shortcodes in Visual composers or codes. It also occupies the largest part in a web page.
• Footer:Web page footer content most often conveys technical information. You can customize it by navigating to Theme Options >> Footer. More information
• Copyright text:This copyright text is in the footer of web page. You can go to Appearance >> Theme Options >> Footer. Then scroll down to the 'Footer copyright text'.
• Social Accounts: To customize all the social links in page bottom, you can go to Appearance >> Theme Options >> Social and then change the links.

Below, we guide how to import revolution slider for your page, please follow some steps below:

• Step 0 - Make sure you have installed Vélo theme and all recommended plugins, especially Revolution Slider
• Step 1 - Go to Revolution Slider >> Import Slider

• Step 2 - Choose .zip file to upload and import. Click "Import Slider" to finish!

In case you want to export slider from a website, you can go to Revolution Slider. And then hover to the slide that you might want to export data. Click to the down arrow sign >> Export Slider

Our item comes with flexible off-canvas sidebar which can be customized in theme options. See our following guideline to be clear how to add and change it. Off-Canvas sidebar is sidebar that can slide in and slide out of the page from both the left and the right to show all widgets in front-end page. We will instruct you how to add and customize the flexible sidebar from scratch.

• Step 1: Navigate to Appearance >>> Theme option >>> Off-canvas sidebar.


• Step 2: Turn ON to enable off-canvas sidebar
1. Offcanvas sidebar position: You can choose left or right position for this sidebar


2. Shown sidebar: Choose among these sidebars to be shown in your selected position like header: primary sidebar, secondary sidebar, canvas sidebar. You can create sidebar in Appearance >>> Widget. Note: If you see "cs-1" in "shown sidebar?" field, the "cs-1" stands for the first custom sidebar you have created in Appearance >>> Widget

• Step 3: Offcanvas sidebar background
1. Image: upload image from your computer. The suggest width size is no more than 300px
2. Position: Based on location you choose from top to bottom and left to right, the image part in there will be prioritized to show in front-end.
3. Background repeat: repeat, repeat X toward horizontal-align, repeat Y toward vertical-align or none. If you want to show in front-end, please carefully choose image size to adapt these styles
4. Background size: auto, cover, contain size.
5. Background color: If you don't want to use background image, choose among numerous colors in palette to decorate your own offcanvas sidebar
6. Text color: besides choosing background color, choose one color to match with it for canvas sidebar text
7. Offcanvas sidebar custom css: you can customize the sidebar as you like by adding CSS here

1. Velo's Header

Velo supports you with 03 header sections including top, middle (main) and bottom header. Below, we will guide you how to setup each header section. Please follow step by step:

front-end setttings

Velo's main header includes logo, main menu, search and cart icons. After you have uploaded a logo and created menu, you will follow the below steps to complete main header settings

• Step 1: Login to your WordPress Admin


• Step 2: Navigate to Appearance >>> Theme Options and click to Header tab



• Step 3: Scroll to Header layout, you will see options for top, middle and bottom header section


• Step 4: Click ON to enable middle header section


• Step 5: Click to symbol like the below image to create 03 columns, the max is 03 columns


• Step 6: Click to "+" to add elements, then you will see the box to choose elements. You select canvas sidebar, login for the first column, select 02 menus, logo for the second column; note: Logo will be placed between 02 menus. For menu, there are different menu options for you to select. All menus will be created in Appearance >>> Menus, select Cart, search box for the third column.



• Step 7: You can drag and drop elements and change columns width freely.

• Step 8: Save all changes

2. Sticky Header

Sticky menu on middle header

To use sticky header, you follow the below steps:

• Step 1: Login to your WordPress Admin


• Step 2: Navigate to Appearance >>> Theme Options and click to Header tab



• Step 3: Scroll to Header Settings, you will see options for sticky header


• Step 4: Select header section you want to fix. There are three options to select Sticky menu Sticky menu on top header, Sticky menu on middle header or Sticky menu on bottom header


• Step 5: Click to turn ON if you want to use Smart sticky menu: This is a superior of sticky menu. After you select the header section you want to retain, you turn ON to enable smart sticky menu. It will disappear when the user scrolls down the page and appear once scrolling up to the top of page.

• Step 6: Save all changes

3. Fullwidth Header

Header Fullwidth setttings

To use fullwidth header, you follow the below steps:

• Step 1: Login to your WordPress Admin


• Step 2: Navigate to Appearance >>> Theme Options and click to Header tab



• Step 3: Scroll to Header Layout, you will see options for Fullwidth header


• Step 4: Click to turn ON to enable fullwidth header

• Step 5: Save all changes

4. Header Settings and Back-up Options

Header Settings

You can set up background color, image, opacity, custom css in each of header section (top, middle or bottom), follow the below steps:

• Step 1: Login to your WordPress Admin


• Step 2: Navigate to Appearance >>> Theme Options and click to Header tab



• Step 3: Scroll to Header Layout, you will see options for header sections


• Step 4: Click to turn ON to enable header section you want to use


• Step 5: Click to "settings" symbol like the below image




• Step 6: Save all changes

Header Back-up Options

Velo supports you with header back-up options. This means you can backup your header settings before creating the new settings, in case you want to get the old header settings, you completely can import it again.

Follow the below steps, you will can back-up your header settings

• Step 1: Login to your WordPress Admin


• Step 2: Navigate to Appearance >>> Theme Options and click to Header tab


• Step 3: You will see Header Back-up Options. To back-up header, you click to Export Header, then enter the name of your backup and wait until you see a notification "Backup success"

• Step 4: To import the old header settings, you click Import Header

• Step 5: Select header file you export, then click Import now

• Step 6: Save all changes

Vélo allows you to create unlimited number of sidebars. You can set each page with a different sidebar of your choice. Follow the next step to learn how to set up your sidebar

• Step 0: Make sure that you install and activate Custom sidebars plugin


• Step 1: Go to Appearance >>> Widgets


• Step 2: Click to Add new sidebar to start to create a new sidebar, fill the name of sidebar you want



• Step 3: Drag widgets into your sidebar and customize each widget

• Step 4: In order that sidebar you have created is shown on individual page/post, you follow the below steps:
1. Open the post/page in WP admin
2. Scroll until you see Page/Post options
3. Click to Page layout tab, you will see options to select the position of sidebar: left or right sidebar in "page layout" field
4. In "custom sidebar" field, you fill the name of sidebar you have created
5. Update or publish your page/post

To fill widgets for Footer, follow the steps below

• Step 1: Navigate to Appearance >> Widgets


• Step 2: You will see sidebars which are footer 1, footer 2, footer 3, footer 4, footer bottom. Then you drag widgets you want into each footer



• Step 3: You can set up Footer in Theme options, see the below sections to know more details

Make sure that you have installed WP Instagram widget plugin. To create top footer widget, you should follow the below steps:

• Step 1: Navigate to Appearance >> Theme options >> Footer


• Step 2: Turn on to enable top footer widget



• Step 3: Then, you navigate to Apearance >> Widget, you will see Top footer widget in Theme sidebars section


• Step 4: Drag and drop instagram in Available widgets section into Top footer widget and fill in your insta username.

• Step 5: You can see top footer on front-end

To setup Footer, Follow the steps below

• Step 1: Navigate to Appearance >> Theme Options >> Choose Footer tab to display Footer options.


• Step 2: There are seven Footer Sidebar Layout options for you selecting. See changes when you select different types of Footer Sidebar Layout at front-end Settings Below.


• Step 3: You can setup Footer background image by uploading an image file.


• Step 4: To select Footer background color you click to Select Color, choose any color you want to.


• Step 5: There are also options to choose Footer Background position (left, right, center, top or bottom), Footer Background repeat, Footer Background size.

Velo footer consists of the widget area and the copyright area. Both of these areas can be configured in theme options on the Footer tab. The widget area permit you to select to show 1, 2, 3 or 4 columns in the footer sidebar layout option, you can see some changes when you select different types of footer sidebar layouts.

To setup Footer, Follow the steps below

• Step 1: Navigate to Appearance >> Theme Options >> Choose Footer to display Footer options.


• Step 2: Copyright area, you will enter information into Footer copyright text area such as product name, author, year.



• Step 3: Footer Right Bottom area is to display payment method, by turning On and fill your link to enable payment method you want to display.

front-end setttings

Vélo provides you a great, number of sample pages and layout, which help you create an impressive website on your own:

• 1. About Us:

You can insert the following code into the back-end's visual section:

[vc_row background_setting="bg_color" dark_background_style="" background_img_repeat="no-repeat" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" scrolldown="true" css=".vc_custom_1437122460906{margin-top: -30px !important;margin-bottom: 0px !important;}" session_layout="no_wrap" background_gen_color="#bdb099"][vc_column width="1/1" background_setting="bg_color" dark_background_style="" background_img_position="" background_img_repeat="no-repeat" background_img_size="" background_img_animation="" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat"][vc_single_image image="1642" alignment="center" anm="" anm_name="fadeIn" anm_delay="1000" img_size="full"][/vc_column][/vc_row][vc_row background_setting="bg_color" dark_background_style="" background_img_repeat="no-repeat" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" scrolldown="" css=".vc_custom_1437194569541{margin-top: 0px !important;margin-bottom: 0px !important;padding-top: 0px !important;padding-bottom: 0px !important;}" background_gen_color="#ffffff" session_layout="no_wrap" class="image-banner"][vc_column width="1/2" background_setting="bg_image" dark_background_style="" background_img_repeat="no-repeat" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" css=".vc_custom_1437194825023{margin-top: 0px !important;margin-right: 0px !important;margin-bottom: 0px !important;margin-left: 0px !important;padding-top: 600px !important;padding-right: 0px !important;padding-bottom: 0px !important;padding-left: 0px !important;}" background_img="1640" background_img_position="right top" background_img_size="cover" class="middle-banner"][/vc_column][vc_column width="1/2" background_setting="bg_color" dark_background_style="" background_img_repeat="no-repeat" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" css=".vc_custom_1437122614444{padding-top: 100px !important;padding-right: 100px !important;padding-bottom: 100px !important;padding-left: 100px !important;}"][heading h="h1" underline="true" align="left" anm="" anm_name="fadeInRight" anm_delay="1000"]About Us[/heading][vc_column_text anm="" anm_name="bounce" anm_delay="2000"]Vélo Bicycle Company was founded in 1992 by a group of friends who were obsessed with bicycles. With a shared determination and vision, we set out to introduce high performance, stylish and affordable bicycles to the planet. Fast forward twenty three years and we’re still doing what we love — putting our passion for design, simplicity and community into every bicycle we create and working day and night at our headquarters to make you fall in love with your daily commute Whether rushing home from your office, the café to campus, or even riding on a tournament, your bicycle is a necessity. At Vélo, we want to share the blissful experience of riding a high-performance bicycle that leaves you with enough cash left in your pocket for your next adventure. On a Vélo, you’re set. Let’s go![/vc_column_text][/vc_column][/vc_row][vc_row background_setting="bg_color" dark_background_style="" background_img_repeat="no-repeat" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" scrolldown="" css=".vc_custom_1437123771134{padding-top: 100px !important;padding-bottom: 100px !important;}"][vc_column width="1/1" background_setting="bg_color" dark_background_style="" background_img_position="" background_img_repeat="no-repeat" background_img_size="" background_img_animation="" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat"][heading h="h1" underline="true" align="center" anm="" anm_name="fadeInDown" anm_delay="1000"]Our Services[/heading][vc_column_text anm="" anm_name="bounce" anm_delay="2000"] We have been living up to our promise we made two decades ago, that is to gain our clients' trust and we are not planning on breaking it ever in the future . [/vc_column_text][vc_row_inner][vc_column_inner el_class="" width="1/4"][iconbox layout="2" text_transform="inherit" icon_type="icon_fonts" icon="awesome-gears" border="dashed" anm="" anm_name="fadeInLeft" anm_delay="1000" title="Customization" icon_font_size="40" icon_color="#252525" fontsize="16"]You can design your own Vélo and we will assemble it. You'll have it within 1 week.[/iconbox][button target="_blank" icon_position="right" size="small" align="center" button_style="default" fullwidth="" pill="" d3="" anm="" anm_name="fadeIn" anm_delay="1000" title="Read More"][/vc_column_inner][vc_column_inner el_class="" width="1/4"][iconbox layout="2" text_transform="inherit" icon_type="icon_fonts" icon="awesome-credit-card" border="dashed" anm="" anm_name="fadeInLeft" anm_delay="1000" title="Hiring Bike" icon_font_size="40" icon_color="#252525" fontsize="16"]We also provide hiring bike service. You can book a bike right here in our website.[/iconbox][button target="_blank" icon="" icon_position="right" size="small" align="center" button_style="default" fullwidth="" pill="" d3="" anm="" anm_name="fadeIn" anm_delay="1000" title="Read More"][/vc_column_inner][vc_column_inner el_class="" width="1/4"][iconbox layout="2" text_transform="inherit" icon_type="icon_fonts" icon="awesome-car" border="dashed" anm="" anm_name="fadeInLeft" anm_delay="1000" title="Testing Ride" icon_font_size="40" icon_color="#252525" fontsize="16"]Don't know if a bike is for you or not? No worries! You can test it any time you want.[/iconbox][button target="_blank" icon="" icon_position="right" size="small" align="center" button_style="default" fullwidth="" pill="" d3="" anm="" anm_name="fadeIn" anm_delay="1000" title="Read More"][/vc_column_inner][vc_column_inner el_class="" width="1/4"][iconbox layout="2" text_transform="inherit" icon_type="icon_fonts" icon="awesome-magic" border="dashed" anm="" anm_name="fadeInLeft" anm_delay="1000" title="Repairation" icon_font_size="40" icon_color="#252525" fontsize="16"]We will adjust the bike you purchase from Vélo for as long as you own the bike.[/iconbox][button target="_blank" icon="" icon_position="right" size="small" align="center" button_style="default" fullwidth="" pill="" d3="" anm="" anm_name="fadeIn" anm_delay="1000" title="Read More"][/vc_column_inner][/vc_row_inner][/vc_column][/vc_row][vc_row session_layout="no_wrap" background_setting="bg_color" dark_background_style="" background_img_repeat="no-repeat" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" scrolldown="" css=".vc_custom_1437194590412{padding-top: 0px !important;padding-right: 0px !important;padding-bottom: 0px !important;padding-left: 0px !important;}" background_gen_color="#ffffff" class="image-banner"][vc_column width="1/2" background_setting="bg_color" dark_background_style="" background_img_repeat="no-repeat" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" css=".vc_custom_1437124321019{padding-top: 80px !important;padding-right: 100px !important;padding-bottom: 80px !important;padding-left: 100px !important;}"][heading h="h1" underline="true" align="left" anm="" anm_name="bounce" anm_delay="2000" class="testi-header"]Testimonial[/heading][k2t_slider style="style_1" single_item="1" auto_play="" stop_on_hover="" navigation="" pagination="" pagi_pos="top" pagi_style="1" lazyload="" items="1" items_desktop="1" items_tablet="1" items_mobile="1"][testimonial style="3" align="left" target="_blank" anm="" anm_name="bounce" anm_delay="2000" image="2125" name="Emily Stella" position="Buyer"]Your customer service is wonderful and I appreciate how timely my delivery was.Thank you for such a fantastic buying experience! I will continue to recommend your website to other people who looking for a greener way to get to work![/testimonial][testimonial style="3" align="left" target="_blank" anm="" anm_name="bounce" anm_delay="2000" image="2127" name="Emily Stella"]I just got my bike today, my roomie helped me pull it out of the box and I just went on my first ride… It is amazing, easy to use, easy to snap together, fits perfectly in my parking spot. Thank you so much for putting it together so perfectly![/testimonial][/k2t_slider][/vc_column][vc_column width="1/2" background_setting="bg_image" dark_background_style="" background_img_position="left bottom" background_img_repeat="no-repeat" background_img_size="cover" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" css=".vc_custom_1437194181102{margin-top: 0px !important;margin-right: 0px !important;margin-bottom: 0px !important;margin-left: 0px !important;padding-top: 600px !important;padding-right: 0px !important;padding-bottom: 0px !important;padding-left: 0px !important;}" background_img="1641" class="middle-banner"][/vc_column][/vc_row][vc_row background_setting="bg_color" dark_background_style="" background_img_repeat="no-repeat" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" scrolldown="" css=".vc_custom_1437126965997{padding-top: 50px !important;padding-bottom: 100px !important;}"][vc_column width="1/1" background_setting="bg_color" dark_background_style="" background_img_position="" background_img_repeat="no-repeat" background_img_size="" background_img_animation="" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat"][heading h="h1" underline="true" align="center" anm="" anm_name="bounce" anm_delay="2000"]Our Team[/heading][vc_column_text anm="" anm_name="bounce" anm_delay="2000" class="testi-header"] Meet our creative, hard-wording people. Had it not been for them we wouldn't be here today. [/vc_column_text][vc_row_inner][vc_column_inner el_class="" width="1/3"][member anm="" anm_name="bounce" anm_delay="2000" image="1643" name="Russel Tunner" role="Founder" facebook="#" twitter="#" pinterest="#" instagram="#"][/member][/vc_column_inner][vc_column_inner el_class="" width="1/3"][member anm="" anm_name="bounce" anm_delay="2000" image="1644" name="Linda Jackson" role="Sales Director" facebook="#" twitter="#" pinterest="#" instagram="#"][/member][/vc_column_inner][vc_column_inner el_class="" width="1/3"][member anm="" anm_name="bounce" anm_delay="2000" image="2121" name="Craig Henry" role="Designer" facebook="#" twitter="#" pinterest="#" instagram="#"][/member][/vc_column_inner][/vc_row_inner][/vc_column][/vc_row][vc_row session_layout="no_wrap" background_setting="bg_color" dark_background_style="" background_img_repeat="no-repeat" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_color="#f3f3f3" background_gen_mask_layer_repeat="no-repeat" scrolldown="" css=".vc_custom_1437195710532{margin-bottom: 0px !important;}"][vc_column width="1/1"][vc_row_inner css=".vc_custom_1436364954471{padding-top: 70px !important;padding-bottom: 70px !important;}" el_class="border"][vc_column_inner width="1/4"][counter style_type="1" border_style="solid" icon_type="icon_font" icon_border_style="solid" anm="" anm_name="bounce" anm_delay="2000" number="24622" title="COFFEE CUPS"][/vc_column_inner][vc_column_inner width="1/4"][counter style_type="1" border_style="solid" icon_type="icon_font" icon_border_style="solid" anm="" anm_name="bounce" anm_delay="2000" number="6134" title="BIKES SOLD"][/vc_column_inner][vc_column_inner width="1/4"][counter style_type="1" border_style="solid" icon_type="icon_font" icon_border_style="solid" anm="" anm_name="bounce" anm_delay="2000" number="7516" title="BIKES HIRED"][/vc_column_inner][vc_column_inner width="1/4"][counter style_type="1" border_style="solid" icon_type="icon_font" icon_border_style="solid" anm="" anm_name="bounce" anm_delay="2000" number="12023" title="HAPPY COSTUMERS"][/vc_column_inner][/vc_row_inner][/vc_column][/vc_row]
• 2. Under Construction:

You can insert the following code into the back-end's visual section:

[vc_row full_width="stretch_row_content_no_spaces" session_layout="no_wrap" background_setting="bg_color" dark_background_style="" background_img_repeat="no-repeat" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" id="simple-subscribe-style2"][vc_column width="1/1" background_setting="bg_color" dark_background_style="" background_img_repeat="no-repeat" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat"][vc_custom_heading text="UNDER CONSTRUCTION" font_container="tag:h2|font_size:60px|text_align:center|color:%23000000|line_height:1em" text_transform="initial" anm="" anm_name="bounce" anm_delay="2000" css=".vc_custom_1437150199870{margin-top: 88px !important;margin-bottom: 7px !important;}" class="under-construction" google_fonts="font_family:Montserrat%3Aregular%2C700|font_style:700%20bold%20regular%3A700%3Anormal"][vc_column_text anm="" anm_name="bounce" anm_delay="2000" class="align-center" css=".vc_custom_1437638960215{margin-bottom: 70px !important;}"] Something awesome is coming soon! We are working hard to improve our website and we'll ready to launch after [/vc_column_text][countdown style="square" align="center" day="Days" hour="Hours" minute="Mins" second="Secs" fontsize="48" time="2015-07-21-22-22-22" year="Years" month="Mons"][vc_column_text anm="" anm_name="bounce" anm_delay="2000" class="simple-subscribe-style2"][simpleSubscribeForm][/vc_column_text][vc_column_text anm="" anm_name="bounce" anm_delay="2000" css=".vc_custom_1438746793081{margin-top: 114px !important;}"] © COPYRIGHT 2015. POWERED BY WORDPRESS. VÉLO THEME BY SUNRISETHEME [/vc_column_text][/vc_column][/vc_row]
• 3. FAQ:

You can insert the following code into the back-end's visual section:

[vc_row full_width="stretch_row_content_no_spaces" session_layout="no_wrap" background_setting="bg_image" dark_background_style="" background_img_position="center center" background_img_repeat="no-repeat" background_img_size="cover" background_video_mute="" background_gen_auto_play="" background_gen_parallax="1" background_gen_mask_layer_repeat="no-repeat" scrolldown="" background_img="1572" class="banner-faq help-search" background_gen_mask_layer_opacity="0.5" background_gen_mask_layer_color="#000000" css=".vc_custom_1438663910714{padding-bottom: 100px !important;}"][vc_column width="1/1" background_setting="bg_color" dark_background_style="" background_img_position="" background_img_repeat="no-repeat" background_img_size="" background_img_animation="" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat"][vc_custom_heading text="Hi ! can we help you?" font_container="tag:h2|font_size:225%25|text_align:center|color:%23ffffff" google_fonts="font_family:Montserrat%3Aregular%2C700|font_style:700%20bold%20regular%3A700%3Anormal" text_transform="uppercase" anm="" anm_name="bounce" anm_delay="2000" class="help_title" css=".vc_custom_1437021729115{margin-top: 100px !important;margin-bottom: 30px !important;}"][vc_wp_search el_class="help-center"][/vc_column][/vc_row][vc_row full_width="" parallax="" parallax_image="" session_layout="" background_setting="bg_color" dark_background_style="" background_img_position="" background_img_repeat="no-repeat" background_img_size="" background_img_animation="" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" scrolldown="" css=".vc_custom_1437021071470{margin-top: 100px !important;margin-bottom: 100px !important;}" class="list-style1"][vc_column width="1/2" background_setting="bg_color" dark_background_style="" background_img_position="" background_img_repeat="no-repeat" background_img_size="" background_img_animation="" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" css=".vc_custom_1437020671410{margin-bottom: 50px !important;}"][vc_raw_html]JTNDdWwlMjBjbGFzcyUzRCUyMmxpc3QtaGVscC10b3BpYyUyMiUzRSUwQSUyMCUyMCUyMCUyMCUyMCUzQ2xpJTNFJTNDYSUyMGhyZWYlM0QlMjIlMjMlMjIlM0VIb3clMjBkbyUyMEklMjBvcmRlciUyMGZyb20lMjB5b3VyJTIwd2Vic2l0ZSUzRiUzQyUyRmElM0UlM0MlMkZsaSUzRSUwQSUyMCUyMCUyMCUyMCUyMCUzQ2xpJTNFJTNDYSUyMGhyZWYlM0QlMjIlMjMlMjIlM0VDYW4lMjB5b3UlMjBnaXZlJTIwbWUlMjBhJTIwc2hpcHBpbmclMjBxdW90ZSUyMG9uJTIwJTIydGhpcyUyMHByb2R1Y3QlMjIlMjB0byUyMG15JTIwc3RhdGUlM0YlM0MlMkZhJTNFJTNDJTJGbGklM0UlMEElMjAlMjAlMjAlMjAlMjAlM0NsaSUzRSUzQ2ElMjBocmVmJTNEJTIyJTIzJTIyJTNFV2hhdCUyMGlzJTIwdGhlJTIwc3RhdHVzJTIwb2YlMjBteSUyMG9yZGVyJTNGJTNDJTJGYSUzRSUzQyUyRmxpJTNFJTBBJTIwJTIwJTIwJTIwJTIwJTNDbGklM0UlM0NhJTIwaHJlZiUzRCUyMiUyMyUyMiUzRUhvdyUyMGxvbmclMjBkb2VzJTIwcHJvY2Vzc2luZyUyMGFuZCUyMHNoaXBwaW5nJTIwdGFrZSUzRiUzQyUyRmElM0UlM0MlMkZsaSUzRSUwQSUyMCUyMCUyMCUyMCUyMCUzQ2xpJTNFJTNDYSUyMGhyZWYlM0QlMjIlMjMlMjIlM0VEbyUyMHlvdSUyMHNoaXAlMjBpbnRlcm5hdGlvbmFsbHklM0YlM0MlMkZhJTNFJTNDJTJGbGklM0UlMEElMjAlMjAlMjAlMjAlMjAlM0NsaSUzRSUzQ2ElMjBocmVmJTNEJTIyJTIzJTIyJTNFSSUyMG5lZWQlMjB0byUyMHJldHVybiUyRmV4Y2hhbmdlLiUyMEhvdyUyMGRvJTIwSSUyMGdvJTIwYWJvdXQlMjB0aGlzJTIwcHJvY2VzcyUzRiUzQyUyRmElM0UlM0MlMkZsaSUzRSUwQSUyMCUyMCUyMCUyMCUyMCUzQ2xpJTNFJTNDYSUyMGhyZWYlM0QlMjIlMjMlMjIlM0VDYW4lMjBJJTIwcmVxdWVzdCUyMHRvJTIwZXhwZWRpdGUlMjBzaGlwbWVudCUzRiUzQyUyRmElM0UlM0MlMkZsaSUzRSUwQSUyMCUyMCUyMCUyMCUyMCUzQ2xpJTNFJTNDYSUyMGhyZWYlM0QlMjIlMjMlMjIlM0VJJTIwb3JkZXJlZCUyMGElMjBjb21wbGV0ZSUyMGJpa2UuJTIwSG93JTIwaXMlMjBpdCUyMHBhY2tlZCUzRiUyMEhvdyUyMG11Y2glMjBhc3NlbWJseSUyMGRvZXMlMjBpdCUyMHJlcXVpcmUlM0YlM0MlMkZhJTNFJTNDJTJGbGklM0UlMEElM0MlMkZ1bCUzRQ==[/vc_raw_html][/vc_column][vc_column width="1/2" background_setting="bg_color" dark_background_style="" background_img_position="" background_img_repeat="no-repeat" background_img_size="" background_img_animation="" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" css=".vc_custom_1437020607345{margin-bottom: 50px !important;}"][vc_column_text anm="" anm_name="bounce" anm_delay="2000"][heading h="h2" underline="true" align="left" anm="" anm_name="bounce" anm_delay="2000"]Popular articles[/heading][accordion style="1" anm="" anm_name="bounce" anm_delay="2000"][toggle open="true" anm="" title="Can you give me a shipping quote to my state?" acc_content="Please enter your full billing and shipping addresses on the designated areas during the Checkout process. By doing so, a shipping quote will automatically generate unique to your cart and Ship To location."][toggle acc_content="Certainly! Currently we offer FedEx Ground, 2-Day, and Standard Overnight, which are provided at the Secured Checkout page. Please take into consideration that processing will take roughly 24 - 48 hours and purchases submitted over the weekend will begin processing on Monday." open="" anm="" title=" Can I request to expedite shipment?"][toggle acc_content="Online purchases must be returned either by mail, or visit us at our new warehouse location in Irvine between the working hours of 9:00am-5:30pm PST. For the record, our retail locations will not be able to accept returning merchandise from the online shop." open="" anm="" title="I need to return/exchange an item. How do I go about this process?"][/accordion][/vc_column_text][/vc_column][/vc_row]
• 4. Contact us

You can insert the following code into the back-end's visual section:

[vc_row full_width="stretch_row_content_no_spaces" parallax="" parallax_image="" session_layout="no_wrap" background_setting="bg_image" dark_background_style="true" background_img_position="center top" background_img_repeat="no-repeat" background_img_size="" background_img_animation="" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" scrolldown="true" background_img="1571" background_gen_mask_layer_opacity="0.3" background_gen_mask_layer_color="#000000" class="contact-banner no-margin"][vc_column width="1/1" background_setting="bg_color" dark_background_style="true" background_img_position="" background_img_repeat="no-repeat" background_img_size="" background_img_animation="" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat"][vc_custom_heading text="Contact us" font_container="tag:h2|font_size:60px|text_align:center" google_fonts="font_family:Montserrat%3Aregular%2C700|font_style:700%20bold%20regular%3A700%3Anormal" text_transform="inherit" anm="" anm_name="bounce" anm_delay="2000" css=".vc_custom_1437019074734{margin-top: 145px !important;margin-bottom: 35px !important;}"][vc_column_text anm="" anm_name="bounce" anm_delay="2000" css=".vc_custom_1438012973840{margin-bottom: 400px !important;}"] PO Box CT16122 Collins Street West, Victoria 8007, Australia. Phone: +1 (2) 345 6789 Fax: +1 (2) 345 6789 Email: Support@sunrisethemes.com [/vc_column_text][/vc_column][/vc_row][vc_row full_width="stretch_row_content_no_spaces" session_layout="no_wrap" background_setting="bg_color" dark_background_style="" background_img_repeat="no-repeat" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" scrolldown="" class="no-margin contact-map" background_gen_color="#ffffff"][vc_column width="1/2" background_setting="bg_color" dark_background_style="" background_img_position="" background_img_repeat="no-repeat" background_img_size="" background_img_animation="" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" class="no-padding"][vc_column_text anm="" anm_name="bounce" anm_delay="2000"][google_map marker="true" traffic="" draggable="" infowindowdefault="" hidecontrols="" scrollwheel="" maptype="ROADMAP" address="New York" z="13" w="100%" h="700px" mapstype="grayscale" markerimage="1601"][/vc_column_text][/vc_column][vc_column width="1/2" background_setting="bg_color" dark_background_style="" background_img_repeat="no-repeat" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" css=".vc_custom_1437193212752{padding-top: 100px !important;padding-right: 100px !important;padding-left: 100px !important;}"][heading h="h1" underline="true" align="left" anm="" anm_name="bounce" anm_delay="2000"]Leave a message[/heading][vc_column_text anm="" anm_name="bounce" anm_delay="2000"]Please don't heristate to contact us for more information.[/vc_column_text][contact-form-7 id="4"][/vc_column][/vc_row]
• 5. Booking

You can insert the following code into the back-end's visual section:

[vc_row][vc_column width="1/1"][pricing separated="false"][pricing_column target="_blank" featured="false" featured_list="false" pricing_content=" VÉLO Model A123 02 Elitsed Eiusmods 01 Tempor Incididunt 02 Magnaliquas " title="Basic" price="19" price_per="day" unit="$" link="http://google.com" style="vertical" image="1844"][pricing_column target="_blank" featured="true" featured_list="false" pricing_content=" VÉLO Model A123 02 Elitsed Eiusmods 01 Tempor Incididunt 02 Magnaliquas " title="Premium" price="49" price_per="day" unit="$" link="http://google.com" style="vertical" image="1859"][pricing_column target="_blank" featured="false" featured_list="false" pricing_content=" VÉLO Model A123 02 Elitsed Eiusmods 01 Tempor Incididunt 02 Magnaliquas " title="Plus" price="29" price_per="day" unit="$" link="http://google.com" display_title="" style="vertical" image="1862"][/pricing][/vc_column][/vc_row][vc_row][vc_column width="1/1"][heading h="h2" align="center" anm="" anm_name="bounce" anm_delay="2000" underline="true"]Another Package[/heading][vc_column_text anm="" anm_name="bounce" anm_delay="2000"] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna. [/vc_column_text][pricing separated="false"][pricing_column target="_blank" featured="true" featured_list="false" pricing_content=" Lorem ipsum dolor sit amet, contur adicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. VÉLO Model A123 02 Elitsed Eiusmods 01 Tempor Incididunt 02 Magnaliquas " title="Premium" price="49" price_per="day" unit="$" link="http://google.com" display_title="" style="horizontal"][pricing_column target="_blank" featured="false" featured_list="false" pricing_content=" Lorem ipsum dolor sit amet, contur adicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. VÉLO Model A123 02 Elitsed Eiusmods 01 Tempor Incididunt 02 Magnaliquas " title="Plus" price="29" price_per="day" unit="$" link="http://google.com" display_title="" style="horizontal"][/pricing][/vc_column][/vc_row]
• 6. Test Ride

You can insert the following code into the back-end's visual section:

[vc_row background_setting="bg_color" dark_background_style="" background_img_repeat="no-repeat" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat" scrolldown="" css=".vc_custom_1438590053327{margin-top: 80px !important;}"][vc_column width="1/1" background_setting="bg_color" dark_background_style="" background_img_position="" background_img_repeat="no-repeat" background_img_size="" background_img_animation="" background_video_mute="" background_gen_auto_play="" background_gen_parallax="" background_gen_mask_layer_repeat="no-repeat"][heading h="h1" underline="true" align="center" anm="" anm_name="bounce" anm_delay="2000"]Another Package[/heading][vc_column_text anm="" anm_name="bounce" anm_delay="2000" css=".vc_custom_1438588246107{margin-bottom: 50px !important;}"] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna. [/vc_column_text][contact-form-7 id="2166"][/vc_column][/vc_row]

FEATURES

Theme Options

---

To customize the appearance of your site, you go to Appearance >>> Theme Options to configure. Below is the detail of how to use those functions.

General

• Step 1: Navigate to Appearance >>> Theme Options >>>General.


• Step 2: Show or Hide Breadcrumb.

• Step 3: You can upload logo for Login page and show/hide page loader

• Step 3: You can customize sidebar width

• Step 4: For Header code, Footer Code, custom CSS you can enter custom CSS or fill Google Analytics tracking code.

• Step 5: Finally, Save changes

Icons

• Favicon - Favicon is a small icon image at the topbar of your browser.

• Iphone icon - The iPhone icon is a file used for a web page icon on the iPhone. When someone bookmarks your web page or adds your web page to their home screen, this icon is used. If this file is not found, these products will use the screen shot of the web page, which often looks like no more than a white square.


• Iphone retina icon - The same as iPhone icon but for Retina iPhone.


• Ipad icon - The same as iPhone icon but for iPad.


• Ipad retina icon - The same as iPhone icon but for Retina iPad.

Offcanvas Sidebar

To setup Offcanvas Sidebar, Follow the steps below:

• Step 1: Navigate to Appearance >>> Theme Options >>> Offcanvas sidebar.


• Step 2: Check ON to show Offcanvas. Select the offcanvas sidebar position (left or right) and choose one of the sidebars you have created in Appearance >>> Widgets. For example "cs-4" sidebar. The "cs-4" stands for "the fourth custom sidebar" you create. More details, you can see Sidebar section.


front-end: This offcanvas sidebar is placed at the right of page


• Step 3: Besides, Vélo allows you to select Offcanvas sidebar background image, background repeat (No repeat, Repeat X, Repeat Y), background size (Auto, cover, contain), background color, text color, custom css.

Step 4: Finally, Save changes

Layout

• Step 1: Navigate to Appearance >>> Theme Options >>>Layout.


• Step 2: Layout tab in theme options is where you can customize content width. You can choose content width in the range from 940px to 1200px.

• Step 3: Finally, Save changes

TitleBar

• You can select titlebar layout (Justify or Center).


• Enter Page titlebar top padding, bottom padding, choose background image or color, position (Left Top, Left Center, Left Bottom, Right Top, Right Center, Right Bottom, Center Top, Center Center, Center Bottom).


• Check ON to turn background parallax, customize titlebar shadow opacity, titlebar overplay cpacity, titlebar clipmask opacity according to percentage.


• Enter titlebar custom content.

front-end setting

Style

• Step 1: Navigate to Appearance >>> Theme Options >>>Style.


• Step 2: Primary color: Select color for site in primary color (main color), select color for heading and text. Primary color is #bdb099

• Step 3: Link color: You can select color for link, link hover, footer text and footer link.


Footer text color: Default the color of footer text is #9b8c73


• Step 4: Menu color: You can set color for main menu and submenu.

• Step 5: Finally, Save changes

Typography

• Step 1: Navigate to Appearance >>> Theme Options >>>Typography.


• Step 2: You can choose a normal font or Google font for Navigation, Heading and Body.


1. Font Family

2. Headings Font Size

In this section, you can customize Font size for Heading types or Body.


3. General Font size

4. Font Type

• Step 3: Finally, Save changes

Blog category page

All the changes that have been made in this 'Blog' section of Theme Options will effect the entire website. That means if you make any adjustments in a certain page, it will overwrite options in Theme Options.

• Step 1: Navigate to Appearance >>> Theme Options >>>Blog.


• Step 2: Set up for blog layout
1. Blog layout: Right sidebar, left sidebar or no sidebar


2. Blog sidebar: Fill the name of sidebar you want to show (To create sidebar, you go to Appearance >>> Widget)


3. Blog style: There are 4 styles icluding large, grid, masonry, medium.

• Step 3: Blog options
1. Content or excerpt: select to display content or excerpt on the blog


2. Excerpt length: The number of displayed excerpt words


3. Infinite scroll: You can use Pagination number to navigate to the next page


4. Title link: You can show or hide title link


5. Post date: Enable to show published date information


6. Comments: Show the number of comments


7. Author: Show the name of author


8. "Readmore" link: Show the readmore button

• Step 4: Finally, Save changes

Blog category page

Single

NOTE: Similar to the 'Blog' section, all the changes that have been made in this 'Single' section of Theme Options will effect the entire website. That means if you make any adjustments in a certain page, it will overwrite options in Theme Options.

• Step 1: Navigate to Appearance >>> Theme Options >>> Single.


• Step 2: Select single layout such as right sidebar, left sidebar or no sidebar. Right sidebar will be selected by default.
1. Single post layout: You can choose right sidebar, left sidebar or no sidebar


2. Single custom sidebar: Enter the name of sidebar you have created in Appearance >>> Widgets. For example, "secondary-sidebar"

• Step 3: Set up meta information
1. Social share: Turn ON to show Facebook, Twitter, Google Plus, Linkedin, Tumblr, Email on single post


2. Tags: Turn ON to show tags on single post


3. Comment number: Turn ON to show the number of comments


4. Previous/Next link: Turn ON to show post navigation link


5. Author box: Turn ON to show Author box information


6. Related post: Turn ON to show related post on single post


7. Related post title: Fill in the name of related posts, for example "You may also like"


8. Number of related post: Fill in the number of related posts you want to show, for example "3". In case you want to show all related posts, you enter "-1"


9. Comment form: Turn ON to show comment form on single post

• Step 4: Finally, Save changes

front-end settings

WooCommerce

You can go to Shop to know more about Woocommerce customization.

404 Page

You can enter 404 Title, custom text, upload 404 image you want to show when users go to 404 page. Check ON to display subcribe newsletter form. But you need to install newsletter plugin.

Social

• Step 1: Navigate to Appearance >>> Theme Options >>>Social.


• Step 2: Social Tab in Theme Options is where you will insert your custom social media links you want to display. If you want to display Facebook icon, Twitter icon or Google+ icon in header or footer you need to insert the URL of your Facebook, Twitter, Google+ in the corresponding field.


• Step 3: To display icon title when you hover icons, you only need to turn On in the icon title field.

Backup Options

Step 1: Navigate to Appearance >>> Theme Options >>> Backup Options.

Step 2: In Backup Options tab you can use the two buttons backup options and restore options to backup your current options, and then restore it back at a later time. This is useful if you want to experiment on the options but would like to keep the old settings in case you need back.

• Backup and Restore Options: You can use two buttons below to back up your current options, and then restore it back at a later time. This is useful if you want to experiment on the options but would like to keep the old settings in case you need to get it back.
• Transfer Theme Options Data: You can tranfer all the saved options data between different installations by copying the text inside the text box. To import data from another installation, replace the data in the text box with the one from another installation and click "Import Options".

Page Options

---

Page Layout

• Page Layout: There are 3 page layout styles which are Right, Left and No Sidebar.


• Custom Sidebar: Fill in the name of custom sidebar you have created in Appearance >>> Widgets.


• Page sidebar width: Customize width of sidebar. The measuring unit is %


• Top padding of content: Set the measurement of top padding for layout.


• Bottom padding of content: Set the measurement of top padding for layout.

Page Title Bar

Page Titlebar: If you don't want to fill in the title name above, you can customize your page titlebar here. Beside some simply options, you can notice some special options in Grid:

• Title bar: Show or hide title bar. Default is show.
• Titlebar layout: Choose from justify or center for alignment of elements on titlebar.
• Titlebar font size: Set the size of your text in title area.
• Top Padding and Bottom Padding: It is a line at the top or bottom of your title area, which is different from padding of content.
• Background image: select image from "Media" or your computer. The size of image should be 1920x300px. Set your background image position among 9 available positions.
• Background color: Set your color in title area
• Background image position: set the position of image background from position list. Default is left top.
• Background zoom effect: True or False. If you choose True, your background will have zoom effect. Otherwise, set False. Default is False.
• Background parallax: True or False. If you choose True, your background will have nice paralax effect in title bar.
• Title opacity: adjust the opacity of titlebar
1. Shadow opacity: Shadow makes a dark area for titlebar here, highlighting your titlebar name. This is the setting to adjust the opacity of titlebar
2. Overlay opacity: An effect cover the surface of titlebar area with a coating. This is the setting to adjust the opacity of overlay
3. Clipmask opacity: This is the setting to adjust opacity of clipmask, an effect cleaves scope of title into small squares.
• Custom title content: You can create your content for title area instead of filling the title name above, which is the same as customizing post content: you can add image, media or using shortcodes.

Blog

You can select a specific category of posts for page. This feature only supports for blog page template

Post Options

---

Post Layout

• Post Layout: There are 3 post layout styles which are Right, Left and No Sidebar. Default is right sidebar
• Choose large post thumbnail for masonry layout only: Only select True or False
• Custom Sidebar: Fill in the name of custom sidebar you have created in Appearance >>> Widgets.

Post Metadata

• Show/hide tags: Select if you want to show or hide tags. Default is to show tags
• Show/hide authorbox: Select if you want to show or hide authorbox
• Show/hide related post: Select if you want to show or hide related post
• Show/hide categories: Select if you want to show or hide categories. Default is to show categories
• Show/hide post date: Select if you want to show or hide post date.

Post Format

Customize Post format if you choose one of these formats "video, audio, link, quote, gallery":

• For format "video", you have some options:
1. Video format url: you can only add link from Vimeo and Youtube
2. Video source: select video source: video link, upload local file, video embed code.
• For format "audio", you have some options:
1. Audio source: select audio source: soundcloud link or upload local file.
2. Link: insert soundcloud link, or link audio from other websites (option for format "Link" only, please fill in full http:// address).
• For format "quote", you have some options:
1. Quote author: fill the author name of the quote.
2. Author quote url: add author link.
3. Quote content: fill the quote.
• For format "gallery", you have some options:
1. Gallery format: add images, audio, video... from gallery.
2. Gallery auto play: True or False. If you choose True, your gallery will play in auto. Default is False.
3. Gallery duration time: fill duration time for your gallery. Default is 5000.
4. Gallery speed: custom the speed. Default is 300.
5. Gallery pagination: True or False. If you choose True, your gallery will be paginated. Default is False.
6. Gallery navigation: True or False. If you choose True, your post will have gallery navigation. Default is True.
7. Gallery mousewheel using: True or False. If you choose True, the gallery can be used by mousewheel. Default is True.

Row (Visual Composer)

---

You can use row to add elements, shortcodes and buil your own pages

• Step 1: Navigate to Pages >> Add New Page >> Backend Editor.


• Step 2: You can choose Add Element to add new row.

• Step 3: Vélo supports you a lot in customizing the row settings. You can set background for the row by selecting background type including background color, image, video.

• For Background image: You only upload the image you want to set background, after then setting background position, size, animation, repeat. Besides, if you want to parallax effect for background you only check to box, or create mask layer image by uploading an image file and set the attributes of image.

• For Background video: You can insert Youtube link and customize opacity, starting time, quality and the other attributes by selecting "Use Background video?" and fill in the video link..

• Step 4: In design options tab, this theme supports you in adjusting margin, border and padding. You will fill in the size you want to (unit: pixel) and set color for border.

SHORTCODES

Visual Composer is a very modern and useful feature of Vélo, it allows users to make a new page in a short time, simplifying shortcodes. If you like the traditional way to create your own page, you can always click to Classic Mode.

It is very easy to create your own page.

Step 1:

• Create a very new page by yourself, choose "Add element" to insert any rows, texts or shortcodes you want to show on your page or "Add text blog" to write text.
• Create new page based on available layouts: Landing page, Call to action page, feature list, description page, product page or service list.

Step 2: To custom each row, you choose options in the right of the row.

2.1. Edit this row:

Design option:
• Css: padding, border and margin.
• Color: color of border and background. Choose color from color palette.
• Theme_border: select theme from theme list: solid, dotted, dash, none.... Default is theme defaults.
• Theme_background: select theme from theme list: cover, contain, no repeat, repeat. Default is theme defaults.
• Box_controls: tick the checkbox if you want to simplify controls. Otherwise, deselect it.
General:
• Row_fullwidth: tick the checkbox if you want the row to have full width (no wrap content). Otherwise, deselect it.
• Background_type: background color, background image, background slider and background video
• Color" color of background. Choose color from color palette.
• ID: enter a unique ID for your button.
• Class: enter a unique class name for your button

2.2. Clone: make a clone from original element.

2.3. Delete: delete the element.

Step 3: Each element you choose will have different setting. The below is detail setting for each shortcode.

1.1. Button

• Text text you want to show inside the button.
• ULR (Link): the URL that the button should link to.
• Style: You can choose any style such as modern, classic, flat, outline, 3D, or custom.
• Shape: You can choose any shape such as rounded, round, square.
• Color: Choose color for your button.
• Size: button size. You can choose among mini, small, normal or large. Default is normal.
• Alignment: Inline, left, center or right. Default is inline.
• Add icon?: Check Yes if you want to add icon.
• CSS Animation: Select type of animation for element to be animated when it "enters" the browsers viewport (Note: works only in modern browsers). You can choose no, top to bottom, bottom to top, left to right, right to left or appear from center.
• Extra class name: Style particular content element differently - add a class name and refer to it in custom CSS.

1.2. Circle Button

• Button_name: You will fill in the name of button.
• Link to: the URL that the button should link to.
• Icon hover: choose an icon from the icon set.
• Button background color: You can select any custom color for button.

1.3. Text Block

Here are the parameters of this shortcode:

• Text: Enter text.
• Animation: tick the checkbox if you want to enable animation, then select kind of animation and fill animation time delay. Otherwise, deselect it.
• ID: enter a unique ID for your step.
• Class: enter a unique class name for your step.

1.4. Progress

Here are the parameters of this shortcode:

• Percent: should be a number from 0 – 100.
• Color: Color of the progress, background and text. You can choose any color from color palette.
• Title: the name/title of the progress
• Height: the height of progess bar.
• Striped: tick the checkbox if you want your progress to be striped. Otherwise, deselect it.
• ID: enter a unique ID for your step.
• Class: enter a unique class name for your step.

1.5. Icon

Here are the parameters of this shortcode:

• Icon library: You can these icon from font awesome, open iconic, typicons, entypo, linecons.
• Icon: an icon from the icon set.
• Color: selecting color for icons from colors that is available.
• Background style: that can be square, rounded or circle .
• Size: Size of icons can be normal, mini, small, large, extra large.
• Icon alignment: You can place icons to be left, right or center.
• URL (link): You can click to select URL and fill in the icon URL and title you want.
• CSS animation: To show animation, you can choose some styles that is available.

1.6. Icon box

Here are the parameters of this shortcode:

• Title: title/name of the iconbox.
• Font size: size of font title. Numeric value only. Unit is pixel.
• Color: color of the title, icon, icon background and background. You can choose any color from color palette.
• Text_transform: tranform of text: inherit, uppercase, lowercase, initial and capitalize.
• Sub_title: sub title you want to show below Title.
• Layout: select layout for your icon box: 1, 2 or 3. Default is 1.
• Type: choose icon type: Icon fonts or Graphics.
.
• Size: choose size of the icon. Numeric value only. Unit is pixel.
• Transparent:tick the checkbox if you want the icon to be transparent. Otherwise, deselect it.
• Border: tick the checkbox if you want icon to have border. Otherwise, deselect it.
• Link: the URL of “Learn more” button.
• Link_text: default is “Learn more”.
• Align: none, left, right or center. Default is none.
• Content: content you want to show inside box. You can insert image or audio too.
• Box_border: tick the checkbox if you want the box to have border. Otherwise, deselect it.
• Margin margin of top, right, bottom and left. Numeric value only. Unit is pixel.
• Animation: tick the checkbox if you want to enable animation, then select kind of animation and fill animation time delay. Otherwise, deselect it.
• ID: enter a unique ID for your step.
• Class: enter a unique class name for your step.

1.7. Icon list

Select shortcode Icon list, then choose small Icon inside Icon list.

• Icon: select icon from icon list.
• Color: select color of all of icon in icon list.
• Animation: tick the checkbox to enable animation, then choose style of animation and time delay (numeric value only, 1000 = 1sec).
• ID: enter a unique ID for your step.
• Class: enter a unique class name for your step.

1.8. Message Box

Here are the parameters of this shortcode:

Firstly, you have to choose from message box presets you want, it can be custom, informational, warning, successful, error

• Style: select the style for your message: solid, solid icon, outline, 3D.
• Shape: select the shape for your message: rounded, square, round.
• Text: content you want to show inside message box. You can insert image or audio too.
• Transparent: tick the checkbox if you want background to be transparent. Otherwise, deselect it.
• Close: tick the checkbox if you want message box is close. Otherwise, deselect it.
• Animation: tick the checkbox if you want to enable animation, then select kind of animation and fill animation time delay. Otherwise, deselect it.
• ID: enter a unique ID for your step.
• Class: enter a unique class name for your step.
• Icon: an icon from the icon set.

1.9. Heading

Here are the parameters of this shortcode:

• Title: name/title of heading.
• Heading_tag: h1, h2, h3, h4, h5 or h6. Default is h1.
• Heading Underline: True/false.
• Align: heading align: left, center or right. Default is left.
• Font: use any font from Google Font.
• Enable Animation: Check if you want to enable animation.
• ID: enter a unique ID for your step.
• Class: enter a unique class name for your step.

1.10. Custom Heading

Here are the parameters of this shortcode:

• Text: Enter text.
• Element tag: h3, h4, h5, h6, p or div. Default is h2.
• Text align: Select between left, right, justify and center.
• Font size: Enter font size.
• Line height: Enter line height.
• Text color: Select heading color.
• Font Family: Select font family.
• Font style: Default is 400 regular.
• Text Transform: Select inherit, lowercase, uppercase, initial or capitalize.
• Enable Animation: Check if you want to enable animation.
• ID: enter a unique ID for your step.
• Class: enter a unique class name for your step.

1.11. Pricing Table

Here are the parameters of this shortcode:

• Separated: True/false.
• ID: enter a unique ID for your step.
• Class: enter a unique class name for your step.