Entrada - Adventure Tour & Travel HTML5 Template

Once you purchase and download the theme - unzip the folder and you will find a folder called Entrada. Inside this folder, there are 3 folders named "entrada", "documentation" and "PSD". The main html working folder is "entrada". An overview of the folder structure is given below.

Folder Structure

## Theme Folder stucture: ##


	entrada 
        /build 										
            -/scss
                -/base
                    _base.scss
                    _colors.scss
                    _typography.scss
                -/components
                -/fonts
                -/layout
                    _header.scss
                    _sidebar.scss
                    _footer.scss
                -/modifiers
                    _custom-variables.scss
                    _mixins.scss
                -/pages
                -/skins
                -/vendors
                    -/bootstrap
                _bootstrap-custom.scss
                bootstrap.scss
                main.scss
                theme-v2.scss 

        /css										
        	-/fonts
        	-/skins
        		color-1.css
        		color-2.css
        		color-3.css
    		bootstrap.css
    		main.css
    		theme-v2.css
        /fonts
            -/icomoon 
        /img  
        -/js
        -/php
            send_email.php
            subscribe.php
        -/sourceimages
        -/vendors
            -/animate
            -/bootstrap
            -/fancybox
            -/flag
            -/font-awesome
            -/jquery-ui
            -/revolution
            -/stellar
		-/videos
        grunt-settings.js
        Gruntfile.js
        package.json
        index.html
        about.html etc.

				        

HTML Structure - #back to top

This template is based on Bootstrap 3 framework. Learn about Bootstrap 3 here.

CSS Structure - #back to top

A properly organized sass structure divided into multiple folders for development while creating one single CSS file for production has been our top priority. Hence you will find every component in its own sass file for ease of customization. After making all the changes - just run "grunt dist" for css output. If you want to edit the css instead of sass, chose the theme that you want to work with, and you will find it labelled with each section. Now you can easily jump to specific section by searching for, lest say, "2. Header" in your code editor.

Header/Footer - #back to top

Header, Footer, Sidebar and boxed layouts etc. are defined in build >> scss >> layout folder. From here, you can customize the header and footer section or other relevant elements which affects sites layout behaviour.

Javascript/jQuery - #back to top

All external javascript libraries are inside -/vendors folder while the settings are inside -/js folder. The jquery.main.js file located inside "js" folder has all the initializers and if you wanted to customize any js module, this is where you will find and customize them.

Retina Ready Images - #back to top

To display retina image on retina devices - all you have to do is add high resolution image that is two times in dimension with @2x. For example, if you have an image with 40x40 dimension named img1.jpg you will need to add same image with 80x80 dimension named img1@2x.jpg in exact same location where your original image is. For more information, please have a look at:
Learn about Retina JS

Layout Options- #back to top

You can have boxed layout with color background, image background or even pattern background by just adding a simple class to your pages body tag as shown below:

body class="boxed-layout"

body class="boxed-layout bg-image"

body class="boxed-layout bg-pattern"

Font Awesome - #back to top

Head over to https://fortawesome.github.io/Font-Awesome/icons/ Now just copy the font you would like from this page, e.g. fa-search-plus and use it in code as shown below:

Custom/Icomoon Fonts - #back to top

Icomoon font css is located at css/fonts/icomoon/icomoon.css To simply use the fonts, head over to icon-font.php Now just copy the font you would like from this page, e.g. icon-family and use it in code as shown below:

Vector Icons - #back to top

All custom vector icons are located inside img >> icons and you can use it in code as shown below. You can add as many fonts as you like to this custom icon set through Icomoon Fonts App

Animations - #back to top

For animations we have used Animate CSS and WOW JS
First, head over to https://daneden.github.io/animate.css/ and chose the animation effect you like. And then use the class with wow to show the effect on scroll. For example, if you like animations on slideInRight, add the example class below to animate any element.

class="wow slideInRight"

Parallax Settings - #back to top

All parallax settings are inside build >> scss >> components >> _parallax.scss Similarly, all parallax background images are inside build >> scss >> components >> _parallax-images.scss
Apart from adding your own images, you can customize things like opacity, scroll speed etc. for individual parallax like testimonials (default), services block and banners from here.

Mailchimp Intigration - #back to top

The “Newsletter Subscription” in footer is integrated with mail chimp. First you need to signup with mail chimp. Then you need to open php >> subscribe.php where you need to place your own $apiKey and $listId. Once thats done - you are all set to create your newsletter list on mail chimp and start getting subscribers emails.
To configure the validation and messages, please go to js >> mailchimp.js
Learn more about Mailchimp
Find your Mailchimp API Keys

Ajax Contact Form - #back to top

The contact form on contact.php page is pre configured to work out of the box. To set it to receive contact form messages in your own inbox, head over to php >> send_email.php and around line 4, replace

							$to = ‘support@mail.com';

							with 

							$to = ‘your-own-email@your-own-domain.com’;
						

Elements - #back to top

The Elements section is a new feature in Version 1.2.0 Inside build >> scss >> components folder, you will find _elements.scss which contains all the css rules for elements. We have used a class .demo-wrapper to contain elements in most cases as this is for demo purposes to show how this element can be integrated. So you can use .demo-wrapper class along with rest of html to place the code exactly as it is - or leave demo-wrapper class and style it with another class.

Site Search - #back to top

The search form with auto completion has autofill property already configured. To add tags that people can use to search the site - please go to js >> jquery.main.js and around line 92, add or edit the tags to populate search form suggestions during site search.

Revolution Slider Options - #back to top

We have included a premium revolution slider with our template. The revolution slider is one of the most popular jQuery slider plugins and you can find a lot of tutorials online for this plugin including videos. We have also included the documentation along with latest version of Revolution Slider which you will find in the main download folder.

Site Upload to Live Server - #back to top

After you have modified the template to suit your needs and you are ready to show your site to the world, you can just delete following folders/files and uplaod the rest to your server.

						Files and Folders to be Deleted before going live.
							-/build
							-/sourceimages
							grunt-settings.js
					        Gruntfile.js
					        package.json
					        csscomb.json
						

Please remember you have purchased a very affordable theme and you have not paid for a full-time web design agency. Occasionally we will help with small tweaks, but these requests will be put on a lower priority due to their nature. Support is also 100% optional and we provide it for your connivence, so please be patient, polite and respectful.

Please visit our profile page or ask question @waituk

• * Responding to questions or problems regarding the item and its features
• * Fixing bugs and reported issues
• * Providing updates to ensure compatibility with new software versions

• * Customization and installation services
• * Support for third party software and plug-ins

• * Make sure your question is a valid Theme Issue and not a customization request.
• * Make sure you have read through the documentation and any related video guides before asking support on how to accomplish a task.
• * Make sure to double check the theme comments section on items page.
• * If you have customized your theme and now have an issue, back-track to make sure you didn't make a mistake. If you have made changes and can't find the issue, please provide us with your changelog.
• * Almost 80% of the time we find that the solution to people's issues can be solved with a simple "Google Search". You might want to try that before seeking support. You might be able to fix the issue yourself much quicker than we can respond to your request.
• * Make sure to state the name of the theme you are having issues with when requesting support via ThemeForest.

• https://www.dollarphotoclub.com/Gallery/Pj5ilIkZfrk6SWjhyCzE83niYXSkia1x

• http://www.videvo.net/video/flying-between-the-clouds/2161

Note: All icons used in the theme are from the noun project, flag icons and fontawesome. You can legally use any of the icon included with the theme and add your own icons from noun project for free (attribution required in some cases).

• Font Awesome: http://fortawesome.github.io/Font-Awesome/
• Material Icons: https://design.google.com/icons/
• The Noun Project: https://thenounproject.com/

• Subtle Patterns: http://subtlepatterns.com/