Thank you for purchasing our product. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!
Intrinsic Template has a lot of features and functionality:
Intrinsic Portfolio - Template file structure:
The template is built with the mobile first approach. It is responsive and uses the Bootstrap grid system. Base layout includes sections.
<!DOCTYPE html>
<html lang="en">
<head>
<!--CSS includes-->
</head>
<body>
<!-- Preloader
================================================== -->
<div class="preloader">
</div><!-- /preloader -->
<!-- Header
================================================== -->
<header class="site-header sticky-header">
</header><!-- /.page-header -->
<!-- Section Block
================================================== -->
<section class="section-block-class" id="section-block-id">
<!-- Title Row -->
<!-- Content Row -->
// All Section Are Going at Same Role
</section><!-- /.section-block -->
<!-- Page Footer
================================================== -->
<footer class="site-footer">
</footer><!-- /.site-footer -->
<!-- JavaScript Files
================================================== -->
<script>
//JS plugins includes
</script>
</body>
</html>
You can use whatever text editor you like, even default Text Editor in the OS. But we recommend using the one with the syntax highlighting such as:
If you are not satisfied with the default font, you can choose from hundreds of ones from the Google Fonts. After you are happy with the selected font, click SEE SPECIMEN. You'll be redirected to font detail, Then click SELECT THIS FONT. Popup window will show with text "1 Family Selected" - click it. Then you can customize your selection by clicking Customize. All necessary things are included at the popup. After that copy this code -
<link href="https://fonts.googleapis.com/css?family=Dosis:200,300,400,500,600,700,800" rel="stylesheet">
And also the CSS font family names.
There is two method of how to change the main color. 1st Just by replacing the HEX color value in the style.css (simple) and 2nd by installing node.sj and PostCSS (advanced). Here is a simple way.
Let say, that you want to change the default red color to blue one:
Or with scss color variable you can change your color code and variables
If you want to change the specific section style then we know will all popular browser here is an inspect source option where we can able to find out the CSS selector easily. and with the right side, we can able to find where the CSS stays. So after finding then we can add our CSS codes
if This template has following javascript plugins:
all these files are located in js folder, And our custom js is located in assets/ js folder in the root directory.
Like CSS and HTML, our JavaScript codes on our main.js file are also well organized and well commented.
Here are two Different Code Blocks, One is regular plugin activation script and another is Google Map Callback Functions. We are talking about some plugin things as like -
This plugin is used for creating slider/carousels from list of images or even HTML elements. Carousel must be wrapped in owl-carousel class.
Example: Carousel with 3 visible slides, 30px margin, auto play, infinite loop and 5s pause.
<div class="owl-carousel" data-owl-items="3" data-owl-margin="30" data-owl-autoplay="1" data-owl-loop="1" data-owl-autoplay-timeout="2000"> <img src="assets/img/1.jpg"> <img src="assets/img/2.jpg"> <img src="assets/img/3.jpg"> </div>
We include some fallback script at function JS. So after API key, you can put your callback style of google maps
/* ---------------------------------------------
Content Loading
--------------------------------------------- */
contentLoading: function() {
$("body").imagesLoaded( function() {
$('.preloader').delay(2000).fadeOut('slow');
setTimeout(function() {
//After 2s, the no-scroll class of the body will be removed
$('body').removeClass('no-scroll');
$("body").addClass("loading-done");
}, 2000); //Here you can change preloader time
// Page Animation Script
$("[data-animate]").scrolla({
mobile: true
});
});
See all code include with separate comments. So we hope you can get it, if you aren't able to do it then please contact us, We try our best to help you
/*======================================================================= Template Name: Intrinsic Personal Portfolio Template URI: https://htmlguru.net/intrinsic/ Author: HTMLguru Author URI: http://htmlguru.net Description: It is a Multipurpose HTML5 Portfolio Template. Which is a unique feature and user competitive feature. Version: 1.0 ======================================================================= */
We are thankful for...
Once again, thank you so much for purchasing this product. As we said at the beginning, We'd be glad to help you if you have any questions relating to this product. No guarantees, but we'll do our best to assist. If you have a more general question relating to this product on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.
HTMLguru