STP Resume

Introduction

STP Resume is a well-designed, responsive html5 template based on twitter bootstrap for personal portfolio, advisors, profile and all kinds business people. The professional template is an important part of personal branding and marketing efforts. It is an ideal choice to easily create the personal portfolio website.

Installation

Follow the steps below to get started with your stp-resume Site Template:

  1. Open the package/stp-resume_html Folder to find all the Templates Files
  2. You will need to Upload these files to your Web Server using FTP in order to use it on your Website.
  3. Make sure you upload the required files/folders listed below:
    • stp-resume_html/css – Extra Stylesheets Folder
    • stp-resume_html/fonts – Required Fonts Folder
    • stp-resume_html/images – Images Folder
    • stp-resume_html/js – Javacripts Folder
    • stp-resume_html/stpmail.php – Required PHP File For Contact Form
    • stp-resume_html/style.css – Main Stylesheet File but you can add all of your custom code here
    • stp-resume_html/index.html – Index File/Homepage
    • The other files can be used according to your preferences.
  4. You’re now good to go..! Start adding your Content and show off your Brand New Beautiful Website in style.

No Images From Demo

The images shown in the live preview are for demonstration purposes only and are not included in the download package.

Typography

In index.html file on line 21,22 you can found the google fonts added. You can edit/replace here.

<!-- Google Web Fonts -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600|Work+Sans:300" rel="stylesheet">

Also you can call the font family using css for any item you want:

font-family: 'Open Sans', sans-serif;
font-family: 'Work Sans', sans-serif;

Customization

All of our code you can found in index.html But if you want to change the column setting Bootstrap & add icon using Fontawesome.

Item Code
Header
<!-- user image -->
<div class="stp-user-img">
<img src="images/user.jpg">
</div>
<!-- user image -->
<!-- user bio -->
<div class="stp-user-bio">
<!-- Add title and sub-title -->
</div>
<!-- user bio -->
<!-- header social -->
<ul class="stp-social">
<li class="social"><a href="url"></a></li>
</ul>
<!-- header social -->
Content
<!-- Heading -->
<div class="stp-heading">
<h2 class="stp-title">here it's goes...</h2>
<p class="stp-sub-title">here it's goes...</p>
</div>
<!-- Heading -->
<!-- feature widget -->
<div class="stp-feature">
<i class="fa fa-dot-circle-o" aria-hidden="true"></i>
<h3 class="stp-feature-title">title...</h3>
<p class="stp-feature-content">Content...</p>
</div>
<!-- feature widget -->
<!-- recent project wrapper -->
<ul class="stp-filtered list-inline" id="stp-project-filtered">
<li class="stp-filter active" data-filter="all">All</li>
<li class="stp-filter" data-filter="one">One</li>
</ul>
<div id="stp-projects">
<!-- project -->
<div class="COLUMNCLASS stp-project one">
<figure class="stp-project-detals">
<img src="IMAGE URL" class="img-responsive" alt="project">
<figcaption class="stp-project-overlay">
<a href="LINK" title="project url">ICONCLASS</a>
</figcaption>
</figure>
</div>
<!-- project -->
</div>
<!-- job widget -->
<div class="stp-jobs">
 <p class="stp-job-time">Time...</p>
 <h2 class="stp-job-title">Title...</h2>
 <p class="stp-company">Name...</p>
 <p class="stp-job-content">Content...</p>
 <ul class="stp-job-list">
 <li>Item...</li>
 </ul>
</div>
<!-- job widget -->
<!-- skill bar -->
<div class="stp-skill progress">
 <div class="progress-bar progress-bar-striped active" role="progressbar"
 aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 85%">
 <span class="stp-skill-title">Title...</span>
 </div>
</div>
<!-- skill bar -->
<!-- degree -->
<div class="stp-degree">
 <p class="stp-degree-year">Time...</p>
 <h2 class="stp-degree-title">Title...</h2>
 <p class="stp-degree-detail">Details...</p>
</div>
<!-- degree -->
<!-- working widget -->
 <div class="stp-working">
 <img src="URL" class="img-responsive">
 <h3 class="stp-working-title">Title...</h3>
 </div>
<!-- working widget -->
<!-- testimonial -->
<blockquote>
 <p>Content...</p>
 <footer>name...</footer>
</blockquote>
<!-- testimonial -->
<!-- blog post -->
<div class="stp-post">
 <img src="URL" class="img-responsive">
 <div class="spt-overlay">
 <h2 class="stp-post-title">Title...</h2>
 <p class="stp-post-details"><span class="stp-post-date">Date...</span>
 <span class="stp-posted-in">Catagories...</span></p>
 </div>
</div>
<!-- blog post -->
Form Open stpmail.php and go to the line: 20; You can found $recipient = "no-reply@themesplugin.com";. Just chnage the email. Also, you can change those error messsage and subject from this file as well like on line 23 $subject = "New contact from $name"; Messages on 37, 41, 47
Map As we used Google Map V3 so that you have to get a google map api ket first Google Map Apis. Then open js/map.js file from the template directory.
Place your latitude & longitude here:

On line: 6
center: new google.maps.LatLng
(22.957890738863462, 89.47894901807705),

On line: 31 to 39
var locations = [[
'ThemesPlugin.com',
'Free & Premium Bootstrap, Html5, Joomla,
Wordpress, Responsive template & plugins provider.',
'+8801918376720',
'hithemeplugin@gmail.com',
'http://www.themesplugin.com',
22.957890738863462, 89.47894901807705,
'images/map_marker.png'
]];

Then open your index.html and go to the line: 794 then add your google map API key here:

<!-- google map -->
<script src='https://maps.googleapis.com/maps/api/js?
key=YOURAPIKEYHERE&sensor=false&extension=.js'></script>
Footer You can add your copyright text and social link here. It’s as simple as that 🙂

You can add your style in style.css file. It will work with priority. Fell free to use our forum for help. Hope you can like out the template. Please share as much as you can. Then it will pay us for our hard work.