Travelwp WordPress Theme Documentation

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!

I. To install our theme, you can do so in one of two ways:

1. The Simple : 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.”

Remember to Install and activate Physcore.

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.

II. Setup theme

You will be directed to Welcome to Travel WP. Select the Next step to continue.

Then select your Site Name and Site Description.

Enter the purchase code and check I agree that my purchase code and user data will be stored by physcode.com. Select Submit to complete activating the theme.

To use the theme’s functions, you need to Install Required Plugins here:

Sip a cup of coffee and wait for the installation.

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.

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. Woo setting You can set Archive product and Single product here.
5. Tour setting
6. Social sharing
7. Styling
8. Typography In 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.
9. FooterThe section contains settings for footer: Background Color, Text Color, Font Size, Title Color and Font Size Title
10. Newsletter
    If you want to make some custom CSS you can insert them to CSS Code box.
11. Custom CSS
    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.
12. 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.

When you add widget for the footer, you need add extra class of bootstrap (Ex: col-sm-3)

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

1. 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.

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. You can configure Interary to add and change content. You can add shortcodes to add content:

Please click Get Lat Long from Address. You can enter Address and find Latitude, Longitude. That will help you connect the correct address with google map.

To display weather in tour, you need to go to Woocommerce -> Settings -> Tour -> Single tour -> Find your API key -> register your account -> then you will have API key.

You can create your own single tour page in Thim Elementor. Please use the Weather Tours widget.

In Elementor, you can create a single tour with our Travelwp tab assigned widget. Then you can assign Conditions to it.

– 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.

– Tour Information, you can set Language, Transport, Accommodation, Meals, Group size.

– Tour FAQ, where you can create frequently asked customer questions about the tour.

First you need to create Attributes in the Product tab and product destinations.

You need to go to Thim Elementor -> All templates -> Add new.

You can go to Thim Elementor Kit and choose our available templates.

Once you have edited the layout to your liking, you need to copy the shortcode.

Go back to the created Attributes -> edit product destination -> add shortcode.

Next, you go to Thim Elementor -> All templates -> Archive tour -> Add new templates. You can use our available templates.

After using our widget to build the template, you need to edit the condition. Select the Attribute you created earlier.

To use layouts for product destinations you need to drag the Attribute Destination Content widget.

As a result, you will have a layout of each different destination.

You can add Flash Tours Sale widget to Tour:

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

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 

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

You can also change the text color and background color for the tour type here:

After changing the background color

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;
}

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;
}

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

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 ) );

You need config as images below:

1. Fix cart empty

And

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

The latest theme update information will be displayed in Dashboard -> TravelWP. At the same time, you can also update the theme there.

Additionally, you can also update the theme in Appearance -> Theme.

If you want to translate your site to another language, please follow steps:
1. Install Loco Translate plugin to your site.

2. Go to Dashboard -> Loco Translate. At that, you can select the theme, plugins to translate to your website.

3. Create a language and translate.

If you want to build multi-language you can use WPML plugin.

You can go to Dashboard -> TravelWP -> Plugins -> Revolution Slider -> Install Now and Activate