Enigma HTML5 Template Documentation

Thank you for purchasing our template. If you have any questions regarding our product feel free to visit our support forum

Getting Started

Unzip files from archive and you will find Html folder. Inside you'll find following files and folders:

/css - folder with css files
/fonts - folder with icon fonts
/img - folder with all images
/js - folder with jQuery script files
/revolution - folder with Slider Revolution plugin
contact.php - file for contact form

Note: Contact form will not work offline. You must upload your website on a server with support of PHP and PHP mail() function.

Contact Form

Open contact.php with any text editor and paste your email address in line 4. Save it.

$to = "testemail@gmail.com"; // Your email here

Note: Contact form will not work offline. You must upload your website on a server with support of PHP and PHP mail() function.

For DreamHost users

If you can't receive email, open contact.php and remove line 46:

$headers = 'From: ' . $mail .''. "\r\n".

Google Map

Paste your address in data-address attribute in the Google map div


      <div id="google-map" class="gmap" data-address="V Tytana St, Manila, Philippines"></div>

API key

Starting from July 2016, Google maps API will require a key, which you can get free. Just follow the instructions - here
When you have your key, paste it in Google maps script


      <script type="text/javascript" src="http://maps.google.com/maps/api/js?key=PASTE-YOUR-KEY-HERE"></script>

Google map script

The Google map code is located after all other scripts in the bottom part of html.


    <!-- jQuery Scripts -->
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js"></script>
    <script type="text/javascript" src="js/gmap3.js"></script>
    <script type="text/javascript" src="js/plugins.js"></script>
    <script type="text/javascript" src="js/twitterFetcher_min.js"></script>
    <script type="text/javascript" src="revolution/js/jquery.themepunch.tools.min.js"></script>
    <script type="text/javascript" src="revolution/js/jquery.themepunch.revolution.min.js"></script>
    <script type="text/javascript" src="js/rev-slider.js"></script>
    <script type="text/javascript" src="js/scripts.js"></script>

    <!-- Google Map -->
    <script type="text/javascript">
      $(document).ready( function(){

        var gmapDiv = $("#google-map");
        var gmapMarker = gmapDiv.attr("data-address");

        gmapDiv.gmap3({
          zoom: 16,
          address: gmapMarker,
          oomControl: true,
          navigationControl: true,
          scrollwheel: false,
          styles: [
            {
            "featureType":"all",
            "elementType":"all",
              "stylers":[
                { "saturation":"0" }
              ]
          }]
        })
        .marker({
          address: gmapMarker,
          icon: "img/map_pin.png"
        })
        .infowindow({
          content: "V Tytana St, Manila, Philippines"
        })
        .then(function (infowindow) {
          var map = this.get(0);
          var marker = this.get(1);
          marker.addListener('click', function() {
            infowindow.open(map, marker);
          });
        });
      });
    </script>

To get Lat/Long, here is the - great service

Full list of features can be found - here

Changing Colors

There are 2 ways to change main color of theme

Option 1

Manually change all color values in color.css Open text editor and change the colors value.

Option 2

Using Sass. The process described here - link

Changing Icons

To change icons follow these steps.

Step 1.

Choose desired icon in the list - link

Step 2.

Get the class name of the icon

Step 3.

Paste the class in icon

Youtube Background Video

To setup Youtube background video find Revolution BACKGROUND VIDEO LAYER. Paste your domain address into origin parameter.

Make sure that there is no slash at the end of the domain address. Correct format is:


      data-videoattributes="version=3&enablejsapi=1&html5=1&hd=1&wmode=opaque&showinfo=0&ref=0;;origin=http://yourdomain.com;"

Now you can copy and paste id of the video into this parameter


      data-ytid="RIQqVqQs9Xs"

Credits

Support

If you have any question feel free to visit our Support Forum