banner

1. Introduction

We would like to thank you for choosing Touriza Template.

We made Touriza from the ground-up with flexibility in mind. Each element of Touriza is extremely customizable, where you can make Touriza to reflect your own branding styles.

The guide gives you detailed methodologies about how you can customize Touriza and make it fit your brand perfectly!

1.1. What's Included

After purchasing Touriza template on go to your Download page. You can choose to download Touriza template only or the entire Touriza template package which contains the following files:

Touriza
  • Touriza: A HTML template file.
  • documentation: This folder contains what you are reading now.
File Structure:
  • Page Structure:
  • Component Structure:

1.2. Font

                                @import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
                                @import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
                                @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
                            

1.3. Source File (CSS)

                                <!-- swiper css -->
                                <link rel="stylesheet preload" href="assets/css/plugins/swiper.min.css" as="style">
                                <!-- Custom Font css -->
                                <link rel="stylesheet preload" href="assets/fonts/custom-font.css" as="style">
                                <!-- magnific popup css -->
                                <link rel="stylesheet preload" href="assets/css/plugins/magnific-popup.css" as="style">
                                <!-- metismenu css -->
                                <link rel="stylesheet preload" href="assets/css/plugins/metismenu.css" as="style">
                                <!-- bootstrap css -->
                                <link rel="stylesheet preload" href="assets/css/vendor/bootstrap.min.css" as="style">
                                <!-- bootstrap css -->
                                <link rel="stylesheet preload" href="assets/css/vendor/animate.css" as="style">
                                <!-- odometer css -->
                                <link rel="stylesheet preload" href="assets/css/plugins/odometer.css" as="style">
                                <!-- fontawesome css -->
                                <link rel="stylesheet preload" href="assets/css/plugins/fontawesome.min.css" as="style">
                                <!-- Nice Select css -->
                                <link rel="stylesheet preload" href="assets/css/plugins/nice-select.css" as="style">
                                <!-- Custom css -->
                                <link rel="stylesheet preload" href="assets/css/style.css" as="style">
                            

1.4. Source File (JS)

                            <!-- jquery js -->
                            <script defer src="assets/js/plugins/jquery.min.js"></script>
                            <script defer src="assets/js/plugins/bootstrap.min.js"></script>
                            <script defer src="assets/js/plugins/metismenu.js"></script>
                            <script defer src="assets/js/vendor/jqueryui.js"></script>
                            <script defer src="assets/js/vendor/waypoint.js"></script>
                            <script defer src="assets/js/plugins/swiper.js"></script>
                            <script defer src="assets/js/plugins/smoothscroll.js"></script>
                            <script defer src="assets/js/vendor/wow.js"></script>
                            <script defer src="assets/js/plugins/odometer.js"></script>
                            <script defer src="assets/js/plugins/magnific-popup.js"></script>
                            <script defer src="assets/js/plugins/isotop.js"></script>
                            <!-- contact form js -->
                            <script defer src="assets/js/plugins/contact-form.js"></script>
                            <script defer src="assets/js/main.js"></script>
                        

3.1. Change Site Title and Favicon

To change your Site title and Favicon open the Touriza in your editor and go to the location by following screenshot which are given bellow.

doc

3.2. Change Logo

To change your Site Logo open the Touriza in your editor and go to the location by following screenshot which are given bellow.

doc

3.3. Customize Menu

To customize your Site Menu open the Touriza in your editor and go to the location by following screenshot which are given bellow.

doc

4.1. Header

From the located file in the image you can customize you site header layout

doc

4.2. Footer

Here is the file where you can customize your footer

doc

4.3. Global Color (SCSS)

To change Touriza Global Color using SCSS

doc

4.3. Global Color (CSS)

To change Touriza Global Color using CSS

doc

4.5. Content

To customize your Site Content open the Touriza in your editor and go to the location by following screenshot which are given bellow.

Page Content:

doc

5. Support

Support Scope

Included in Free Support Scope:

  • Fixing bugs
  • Helping clients in changing site contents by sending instructions that couldn’t be covered by documentation

NOT Included in Free Support Scope:

  • Any type of custom changes
  • Any type of request to update clients’ site contents