Travelwp WordPress Theme Documentation

Get started

From the entire PhysCode team, we want to personally thank you for purchasing Travel WordPress Theme! We’re incredibly excited to get it into your hands, and we invite you to check out our documentation below. We strongly encourage all of our customers to register at our member center for access to tutorials, our member forum, updates, and more!

Installation

A) To install our theme, you can do so in one of two ways:

1. The Simple, No-Brainer, Piece of Cake Way: Upload the travelwp.zip file via the WordPress Admin Panel. To do so, go to “Appearance” > “Themes” in the menu, then select the “Install Themes” tab at the top of the page. Once you are at this page, select “Upload,” then “Choose File” to locate the .zip folder on your computer. After doing so, select “Install Now.”

2. The Roll Up Your Sleeves and Use a Little Elbow Grease Method: Uncompress the travelwp.zip file and upload the template contents to the /wp-content/ themes/ directory of your WordPress installation via your chosen FTP client.

Neither method has an advantage over the other, it is simply a matter of preference

B) To Install Require plugins

After you have installed the theme with two ways above you need installing require plugins. You can do that with steps:

  1. Go to Appearance -> Install Plugins (the menu only shows when your site needs installing or updating require plugins).
  2. Install or update plugins and activate them.

When you finish the section you have finished install theme and plugin. Now you need to install demo data or setup other elements, following other sections below.

Import Demo

The first way: Import by one-click 

Go to “Theme Options -> Demo importer” then choose demo you want to import

Note: If your Website had WordPress Importer Plugin was Activated, please Deactivate this Plugin before executing Import.

The second way: Import by XML Files

Step 1: Go to Tools -> Import

Step 2: Choose “WordPress” if your site has not install import plugin yet then click “Run Importer“.

If your site installed import plugin you click “Run Importer

Step 3: Choose XML file in “travelwp/inc/admin/demo_importer/demo-data/…” folder from download package on ThemeForest then click  “Upload file and import” button.  EX:  You can import Demo 1 you choose file content.xml in folder “travelwp/inc/admin/demo_importer/demo-data/Video Slider

Step 4: Import Revo Slider, You go to Slider Revolution -> Import Slider and Choose file .zip in “travelwp/inc/admin/demo_importer/demo-data/…” EX:  You can import Demo 1 you choose file video_slider.zip in folder “travelwp/inc/admin/demo_importer/demo-data/Video Slider

Step 5: Import Widget, You can install plugin “Widget Importer & Exporter” after that Rename file “widgets.json” in “travelwp/inc/admin/demo_importer/demo-data/…” to “widgets.wie” and go to Tools -> Widget Importer & Exporter choose file “widgets.wie” and import widgets.

Step 6: You go to Settings -> Reading in Front Page Displays choose A static page (select below)

 

Setup Menu

  1. Create a new menu
  2. Create menu items
  3. Check Primary Menu
    You need to check “Primary Menu” to show the menu at main menu area.

Theme Options

All site setting will configuration in theme options. So you need to understand all options before start configuration your site.

  1. General SettingsYou can change logo, sticky logo and set logo size in this setting tab.
  2. Header Setting
    The setting tab contains configuration for Main menu, Sub menu and Mobile Menu.
    You can configure background, text menu color, text menu color active … This section you can config show or hidden the sticky menu.
  3. Display Settings

    No 1,2 is configurations for Blog page
    1, You can set blog page with sidebar left, sidebar right or no sidebar.
    2, Set Background image or Background color for blog page heading area and set text color
    No 3, 4 is configurations for Archive page. Configurations is similar as Blog page
    No 5,6 is configurations for single post or page.
  4. TypographyIn typography settings, you can set primary color. The color will active to active menu, hover and heading H1, H2, H3 ..
    Beside you also can set font body, font title and font size for your site.
  5. FooterThe section contains settings for footer: Background Color, Text Color, Font Size, Title Color and Font Size Title
  6. Custom CSS
    If you want to make some custom CSS you can insert them to CSS Code box.
  7. Demo Importer
    You can import our demo data with only one click. Your site is similar as our demo so you only need to change data to run your site.
  8. Import / Export
    You can import or export all settings from Theme options or to Theme options. Please sure about Import  action because all settings will replace by new settings.

Tour Settings

To Tour Settings page you go to WooCommerce -> Settings-> Tours. You will see “General” and “Search Tours”

    1. General settings.
      – Tours Page: this page will show all tours on your site. You need to create a page and choice it in this option.
      – Redirect to page after Booking tour.
      – Tour Expired: This option allows showing expired tours on tour page or no.
      – Location Options: Config Google map use iframe of google map or use google map with Latitude and Longitude
      – Google API: You need to configure Google API key to set google map width latitude and longitude  for each tour.
      – Separate Ticket for Adult, Children: If you want to set separate tour price for children and adults. You need to turn on this.
      – Price percent child/adult (%): You can set rate price child per adult to here. The system will auto calculate children tour price based on adults tour price.
    2. Search Tours settings.
      At that has only one option to configure attributes that will show in search form.

How to create a tour

To create a tour you go to Products and click Add Product.

  1. Tour name
  2. You need to select product type that is tour and interesting in some tab as image above.
    In Tour Booking, You can input regular price and sale price and child Price.
    In Tour Tab, You can config Interary and Location
    Dates and Price: Config date disable and set price for date
    Tour Variations: You can add more variations for tour 

    Group Discount: If you create 2 discount boxes, and for the first box, you set up 5 customer with 10% discount and for another box, 10 customer with 20% discount. When customers book smaller than 10 travellers, they will get 10% off. However, if they book for 10, 11, 12 ( and so on ) customer, they will get 20% off.
    In Attributes, you can set attributes for the tour

Create Attribute

– How to create destination, month and config it for form search, config missing Find a tour of Destination

Add List product attributes

After created attributes success. Add shortcode “Show tours of attribute” like the image to your page

And config that, ex: we want to show List destination of the tour, we’ll config like image 

Set thumbnail image and Heading Background Image for Attribute

Go to Products > Attributes > Configure terms then edit term you want like below image:

How to hidden fields in Booking form

When support we got the question “How to hidden field in Booking form” from some clients. So we created the section to introduce to do that. Please follow steps:

  1. You need to install the latest version of the theme and travel booking plugin.
  2. Activate child theme. In the package we included the child theme, you can use it to install on your site.
  3. Add the below code to functions.php in child theme

— Hidden field Fist Name

add_filter('tb_show_first_name', 'func_hide_first_name');
function func_hide_first_name($show) {
 $show = false;
 return $show;
}

— Hidden field Last Name

add_filter('tb_show_last_name', 'func_hide_last_name');
function func_hide_last_name($show) {
 $show = false;
 return $show;
}

— Hidden field Email

add_filter('tb_show_email', 'func_hide_email_field');
function func_hide_email_field($show) {
 $show = false;
 return $show;
}

— Hidden field Phone

add_filter('tb_show_phone', 'func_hide_phone_field');
function func_hide_phone_field($show) {
 $show = false;
 return $show;
}

— Hidden field Date

add_filter('tb_show_date_book', 'func_hide_date_book');
function func_hide_date_book($show) {
 $show = false;

 return $show;
}

How to add new tabs for tour or product

We got the question from some clients so we create a section on documentation about this.
The first way: First, we want to say “Thank You” to Nilambar Sharma – Author’s Woocommerce Product Tabs plugin on wordpress.org.
Woocommerce Product Tabs plugin works very well with WooCommerce product, but it doesn’t work with a custom product data type. So we make some change on that plugin to work with the tour. You can download it at http://physcode.com/plugins/woocommerce-product-tabs.zip

The second way: Use plugin Custom Product Tabs for WooCommerce

** Remove a tab. You can add custom code below to file functions.php of theme

add_filter( 'tour_booking_default_product_tabs', 'remove_tour_booking_tabs', 98 );
function remove_tour_booking_tabs( $tabs ) {
unset( $tabs['location_tab'] );          // Remove the location  tab
return $tabs;
}

Travel Personal Information

Add fields information for each ticket adults/children on the page Checkout

How to add custom Font for Typography

We will try adding “Bagatela Regular” fonts to Redux Framework
#1. Step 1:
Copy the fonts with the format (.ttf, .otf, .woff, .eot, .woff2) in the directory wp-content/themes/travelwp-child/fonts
#2. Step 2:
Create a new file fonts.css located in the directory wp-content/themes/travelwp-child/fonts and copy the following code in that file.

@font-face {
font-family: "Bagatela-Regular";
font-style: normal;
font-weight: 500;
src: url("Bagatela-Regular.eot"); /* IE9 Compat Modes */
src: url("‘"Bagatela-Regular.eot?#iefix"’") format(’embedded-opentype’), /* IE6-IE8 */
url("Bagatela-Regular.woff2") format("woff2"), /* Super Modern Browsers */
url("Bagatela-Regular.woff") format("woff"), /* Pretty Modern Browsers */
url("Bagatela-Regular.ttf") format("truetype"), /* Safari, Android, iOS */
}

You need to change “Bagatela-Regular” with the font name you want to install
#3. Step 3:
in file functions.php of child theme you add the custom code below:

function travelwp_redux_custom_fonts( $custom_fonts ) {
return array(
"Custom Fonts" => array(
"Bagatela-Regular" => "Bagatela-Regular",
)
);
}
add_filter( 'redux/travelwp_theme_options/field/typography/custom_fonts', 'travelwp_redux_custom_fonts' );

#5. Step 4:
Add this code after the line #7

wp_enqueue_style( 'custom-font', get_stylesheet_directory_uri() . '/fonts/fonts.css', array( $parent_style ) );

Fix WPML

You need config as images below:

1. Fix cart empty

And

2. Fix theme don’t show correct tours by language

Update Theme

How to translate WordPress theme, plugins

How to activate Revolution Slider, Visual Composer

How to update plugin visual composer

Update Visual Composer:

  1. Go to Plugin -> Deactive plugin Visual Composer
  2. Click to Update Require
  3. Active plugin Visual Composer
Suggest Edit