+
+
+

Satner Portfolio Html5 Responsive Template

+
+
+ +

Welcome To Satner Portfolio Html5 Responsive Template

+

Firstly, a huge thanks for purchasing this theme, your support is truly appreciated!

+

This document covers the installation and use of this theme and often reveals answers to common problems and + issues - read this document thoroughly if you are experiencing any difficulties. If you have any questions that + are beyond the scope of this document, feel free to email at support@colorlib.com + Thank you so much!

+
+ +
+

Template Features

+ +
    +
  • Clean & Simple Design
    • +
  • HTML5 & CSS3
    • +
  • Fully Responsive Design
    • +
  • PHP/Ajax Powered Working Contact Form
    • +
  • All files are well commented
    • +
  • Cross Browser Compatible with IE11+, Firefox, Safari, Opera, Chrome
    • +
  • Extensive Documentation
    • +
+
+
+ +
+
+

Satner Portfolio Html5 Responsive Template

+
+

Installing Template.

+ +
+
    +
  1. After unzip the download pack, you'll found a Template Folder with all the files.
    2. +
  2. You can view this Template in any browser, you can display or edit the Template without an internet + connection.(May not wotrk fonts and google map).
    3. +
  3. The only section that will not work is the Contact Section which contains PHP code and requires a server + environment for send messages.
    4. +
  4. Now go to your cpanel or open your FTP Client (like Filezilla) + and upload the content of the Template on your server root.
    5. +
  5. Once the files are done uploading go to www.yourdomainname.com/index.html
    6. +
+
+ +
+
+

Template Structure

+

All information within the main content area is nested within a body tag. The general template + structure is pretty the same throughout the template. Here is the general structure of main page (index.html).

+ 
+					                

+						                
+					                

+					                

+						                

+							                
+						                

+						                

+							                
+						                

+						                

+							                
+						                

+					                

+					                

+						                
+					                

+
+
+
+

CSS Files and Structure

+

These are the css files that are loaded into templates in Head Section.

+ 
+					
+					
+					
+					
+					
+					
+					
+					
+
+ +

Google Web Fonts

+ +

By default, the template loads this font from Google Web Font Services, you can change the font with the one + that suits you best.

+ + 
+					
+					 
+
+ +

Remember to change the font into main.css

+
+ +
+

Javascript Files and Structure

+ +

These are the list of Javascript files that are loaded into templates in end of the Body + Section. + + 

+						
+						
+						
+						
+						
+						
+						
+						
+						
+						
+						
+						
+						
+						
+						
+
+
+ +
+

Contact Form

+

This is a PHP Script for sending messages to your email, you should replace support@colorlib.com + to your email to start receive messages.

+ 
+						                    $to = 'demo@site.com'; // replace this mail with yours
+						    $firstname = $_POST["fname"];
+						    $email= $_POST["email"];
+						    $headers = 'MIME-Version: 1.0' . "\r\n";
+						    $headers .= "From: " . $email . "\r\n"; // Sender's E-mail
+						    $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
+						    $message ='
+							        
+								            
+							        
+							        
+						    
'.$firstname.'  '.$laststname.'
Email: '.$email.'
';
+						    if (@mail($to, $email, $message, $headers))
+						    {
+						        echo 'The message has been sent.';
+						    }else{
+						        echo 'failed';
+						    }
+
+
+
+

Subscription Form

+

Replace this action with your own mailchimp post URL. Don't remove the "". Just paste the url inside "".

+ 
+						        

+							        //Replace this action with your own mailchimp post URL. Don't remove the "". Just paste the url inside "".
+						        

+					        

+
+
+
+

Video Tutorial

+ +
+ +
+
+
+

Source and Credit

+
+ +
+
+