Hedone - html template

This theme is a one-column layout. The general template structure is the same throughout the template. Here is the general structure. All sections are with html comment above them.

If you would like to edit the color, font, or style of any elements in one of these columns, you would do the following:

.head-h3 {font-size: someValue;} 

If you find that your new style is not overriding, it is most likely because of a specificity problem. Scroll down in your CSS file and make sure that there isn't a similar style that has more weight.

I.E.

.white-background .head-h3 {font-size: someValue;}

So, to ensure that your new styles are applied, make sure that they carry enough "weight" and that there isn't a style lower in the CSS file that is being applied after yours.

Hedone template import six CSS files. Two main theme files are hedone.css and colors.css.

<link href="assets/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/css/animations.css" rel="stylesheet" type="text/css"/>
<link href="assets/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
<link href="assets/css/owl.carousel.custom.css" rel="stylesheet" type="text/css"/>
<link href="assets/css/hedone.css" rel="stylesheet" type="text/css"/>
<link href="assets/css/colors.css" rel="stylesheet" type="text/css"/>

File /assets/css/hedone.css contains all stylings for the theme. At the begining of the file is a table of contents. This is a place where you can edit styling. I suggest you overide default theme style at the end of this file.

/*
 * Table of contents:
 * 
 * 1.Helpers
 * 2.Elements
 * 3.Hero section
 * 4.About section
 * 5.Counter section
 * 6.Team Member
 * 7.Video section
 * 8.Our services
 * 9.Brand slider
 * 10.Projects
 * 11.Progress section
 * 12.Blog listing section
 * 13.Subscribe section
 * 14.Footer
 * 15.Background video section
 * 16.nav-pills
 * 17.Pricing table
 * 18.Contact section
 * 19.Ajax loader
 * 20.Lightbox map
 * 21.Fullscreen homepage
 * 22.Blueimp Gallery
 * 23.Single post
 * 24.YoutubePopup
 * 25.Main Navigation
 * 26.Media Query
 */

If you would like to edit a specific section of the site, simply find the appropriate label in the CSS file, and then scroll down until you find the appropriate style that needs to be edited.

Second file /assets/css/color.css contain theme main color. In this file you can find and change color of elements.

/* * @main-color: #fcc900; */
.slider-line{ background-color: #fcc900; }
.quote{ border-color: #fcc900; }
.facts-name{ color: #fcc900; }

etc.

This theme imports four main Javascript files.

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Bootstrap v3.3.7-->
<script src="assets/js/bootstrap.min.js"></script>
<!-- PLUGINS -->
<script src="assets/js/plugins.js" type="text/javascript"></script>
<!-- MAIN JS -->
<script src="assets/js/main.js" type="text/javascript"></script>

1. jQuery is a Javascript library that greatly reduces the amount of code that you must write.
2. Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.
3. Plugins for animation, masonry effects, background-video, responsive iframe etc.
4. Main.js scripts contain function, plugins initialize and handle javascript event.For example:

   var mapOverlay = $('.map-overlay');
   $('#lightbox-map').on('click', function (e) {
       e.preventDefault();
       mapOverlay.show();
   });
   $('.map-overlay-bg').click(function () { mapOverlay.hide(); });
   

I've included php files in /lib/PHPMailer-master/ and in /ajax/ directories.

1. PHPMailer is a full-featured email creation and transfer class for PHP
2. /ajax/ directory include two files: contact-form.php and subscribe.php

In /ajax/contact-form.php file find below code and set your email address instead of YOUREMAILADDRESS.

$mail = new PHPMailer;
$mail->setFrom($email, $fName); // set from address
$mail->addAddress('YOUREMAILADDRESS');// Add a recipient
$mail->isHTML(true); // Set email format to HTML
$mail->Subject = 'Contact';
$mail->Body = $message;

Theme used the following images, icons or other files as listed.

• Images: Gratisography
• Icons: FontAwesome
• Fonts: Google Fonts

Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.

Zarioza