Created: 19/10/2021
By: Amentotech
Email: help.amentotech@gmail.com
Thank you for purchasing our template. If you have any questions that are beyond the scope of this help file, please feel free to create a ticket on our help desk here. Thanks so much!
Follow the steps below to get started with your Site Template:
Main-files/HTML Folder to find all the Templates FilesHTML/css - Extra Stylesheets FolderHTML/images- Images FolderHTML/js - Javacripts FolderHTML/index.html - Index File/HomepageJournal Follows A Simple Coding Structure. Here Is The Sample:
<!doctype html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9" lang=""> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="zxx"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>BootStrap HTML5 CSS3 Theme</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="apple-touch-icon" href="apple-touch-icon.png">
<link rel="icon" href="images/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="css/aos.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/all.css">
<link rel="stylesheet" href="css/linearicons.css">
<link rel="stylesheet" href="css/themify-icons.css">
<link rel="stylesheet" href="css/owl.carousel.min.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body class="lo-homepage lo-overxhidden">
<!-- LOADER START -->
<div class="lo-preloader" style="display: none;">
<div class="lo-preloader_holder" style="display: none;">
<img src="images/favicon.png" alt="laoder img">
<div class="lo-loader"></div>
</div>
</div>
<!-- LOADER END -->
<!-- COLOR PICKER START -->
<div class="lo-colorpicker">
<a href="javascript:void(0)" class="lo-colorhandle"><i class="ti-settings fa-spin"></i></a>
<span>Dark Theme</span>
<div class="lo-on-off">
<input type="checkbox" id="changecolor" name="record-project-video" value="0">
<label for="changecolor"><i></i></label>
</div>
</div>
<!-- COLOR PICKER END -->
<!-- HEADER START -->
<header class="lo-header">
<div class="container-fluid">
<div class="lo-headerwrap">
<strong class="lo-logo">
<a href="index.html"><svg id="Logo" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 949.41 146.38"><defs><style>.cls-1{fill:#2d2d2d;}.cls-1,
.cls-2{fill-rule:evenodd;}.cls-2{fill:#ff005a;}</style></defs><path id="_01"
data-name=" 01" class="cls-1" d="M0,143.19h110.4v-36.6H47.19V3.19H0Zm123,
0h47.2V3.19H123Zm162-140v63.6l-53.2-63.6H193v140h46V79.59l53.2,63.6H331V3
.19Zm161,140h54.6l-58.8-78.4,56-61.6h-51.4l-46,50.8V3.19H354v140h46.4v-34.6L411,
96.79Zm272-63.6,53.2,63.6H810V3.19H764v63.6L717.9,11.69m161.49,95.9V89.19h59.
2v-34h-59.2V38.79h67.4V3.19H833v140h116.4v-35.6Z"/><path id="_02" data-name="
02" class="cls-2" d="M504.49,33.89q-8.1,16.5-8.1,39.3t8.1,39.3m0,0q8.1,16.5,
22.4,25.2t32.9,8.7h0q18.6,0,32.9-8.7t22.4-25.2q8.1-16.5,8.1-39.3t-8.1-39.3q-8.
1-16.5-22.4-25.2T559.79,0q-18.6,0-32.9,8.7t-22.4,25.2m55.3,74.7q-16,0-16-35.
4t16-35.4q16,0,16,35.4t-16,35.4Zm67.8-105.4v35.6h24v104.4h47.2V3.19Zm123,
140h-33v-40"/></svg></a>
</strong>
<nav class="lo-navbar navbar-expand-xl">
<button id="overlay" class="navbar-toggler" type="button" data-toggle="collapse"
aria-expanded="false" aria-label="Toggle navigation">
<i class="lnr lnr-menu"></i>
</button>
<div class="collapse navbar-collapse">
</div>
</nav>
<div class="lo-headerwrap__right">
<div class="lo-postbtns sub-menu-holder">
<a data-target="#sub-menu-holder" class="lo-btn" role="list"
data-toggle="collapse" aria-expanded="false">Wanna Talk?<i
class="fas fa-caret-down"></i></a>
<ul id="sub-menu-holder" class="lo-dropmenu sub-menu collapse">
<li><a href="tel:0800111222333" class="lo-talk"><span>
Let’s Talk</span><em>0800 111 222 333</em></a></li>
<li><a href="mailto:tech@mailurl.com" class="lo-talk"><span>Say Hello
</span><em>tech@mailurl.com</em></a></li>
</ul>
</div>
</div>
</div>
</div>
</header>
<!-- HEADER END -->
<!-- BANNER START -->
<div class="lo-homebanner">
<div class="lo-bannerhead">
<div class="container">
<div class="row">
<div class="col-lg-11">
<div class="lo-bannerhead_title">
<h1>We're Your <em>Creative Agency</em> Located In <a href=
"Javascript:void(0)" class="typing" id="typing"></a> Since 2012</h1>
</div>
</div>
</div>
</div>
<div class="lo-aside">
<div class="lo-asideline"><span>Follow Us</span></div>
<ul class="lo-socialicons">
<li><a href="javascript:void(0)" class="lo-behance"><i
class="fab fa-behance"></i></a></li>
<li><a href="javascript:void(0)" class="lo-pinterestp"><i
class="fab fa-pinterest-p"></i></a></li>
<li><a href="javascript:void(0)" class="lo-dribbble"><i
class="fab fa-dribbble"></i></a></li>
</ul>
</div>
</div>
<div class="lo-bannerimgholder">
<div class="lo-bannerimg">
<div class="lo-imageswrap">
</div>
</div>
<div class="lo-effectwrap">
<a href="javascript:void(0);" class="lo-amazingshow">
<span>AMAZING SHOWREEL <em>+</em></span>
</a>
<div class="lo-effect"></div>
</div>
</div>
</div>
<!-- BANNER END -->
<!-- OVERLAY NAVIGATION START -->
<div class="overlay lo-overlay">
<div class="lo-overlayholder">
<span class="iconclose ti-close"></span>
<div class="lo-ovlerlaynavigation">
<div class="container">
<div class="row lo-overlayspace">
<div class="col-12">
<nav class="overlay-menu">
<ul>
<li class="lo-overlaydropdown">
</li>
<li>
<a href="about.html">About</a>
</li>
<li>
<a href="services.html">Services</a>
</li>
<li class="lo-overlaydropdown">
</li>
<li class="lo-overlaydropdown">
</li>
<li>
<a href="contact.html">Contact</a>
</li>
<li class="lo-overlaydropdown">
</li>
</ul>
</nav>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- OVERLAY NAVIGATION END -->
<!-- MAIN START -->
<main class="lo-main overflow-hidden">
<!-- COUNTER SECTION START -->
<section class="lo-main-section lo-section-counter" data-aos="fade-up">
<div class="container">
<div class="row">
<div class="col-sm-12 col-lg-7">
<div class="lo-heading">
<div class="lo-heading_title">
<h2>Our valuable stats are amazingly insane</h2>
</div>
<div class="lo-heading_description">
<p>Consectetur adipisicing elit sed do eiusmod tempor incididunt ut
labore etdolore magna aliqua enim ad minim eniam quis nostrud
exercitation ullamco laborisn nisi ut aliqup exean commodo consequat
duis aute iruren.</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-6 col-lg-3">
<div class="lo-count">
<h3>
<span>+</span>
<em class="counter-value" data-count="13"></em><i>m</i>
</h3>
<span>Our users</span>
</div>
</div>
<div class="col-sm-6 col-lg-3">
<div class="lo-count lo-count-active">
<h3>
<span class="lo-countpercentage">%</span>
<em class="counter-value" data-count="98.60"></em>
</h3>
<span>Client feedback</span>
</div>
</div>
<div class="col-sm-6 col-lg-3">
<div class="lo-count">
<h3>
<span>+</span>
<em class="counter-value" data-count="46"></em><i>k</i>
</h3>
<span>Portfolio items</span>
</div>
</div>
<div class="col-sm-6 col-lg-3">
<div class="lo-count">
<h3>
<span>+</span>
<em class="counter-value" data-count="120"></em><i>k</i>
</h3>
<span>Cups of coffee</span>
</div>
</div>
</div>
</div>
</section>
<!-- COUNTER SECTION END -->
<!-- BRAND SECTION START -->
<div class="lo-main-section" data-aos="fade-up">
<div class="lo-brand-explore">
<div class="container-fluid theme-container">
<div class="lo-exploreholder">
<ul class="lo-explore">
</ul>
</div>
</div>
<div class="container-fluid">
<div class="lo-barrands">
<figure><img src="images/barnds/barands.jpg" alt="image"></figure>
<ul>
<li><img src="images/barnds/barrand1.png" alt="image"></li>
<li><img src="images/barnds/barrand2.png" alt="image"></li>
<li><img src="images/barnds/barrand3.png" alt="image"></li>
<li><img src="images/barnds/barrand4.png" alt="image"></li>
<li><img src="images/barnds/barrand5.png" alt="image"></li>
<li><img src="images/barnds/barrand6.png" alt="image"></li>
<li><img src="images/barnds/barrand7.png" alt="image"></li>
</ul>
</div>
</div>
</div>
</div>
<!-- BRAND SECTION END -->
<!-- PORTFOLIO SECTION START -->
<section class="lo-main-section" data-aos="fade-up">
<div class="container">
<div class="row justify-content-center">
<div class="col-sm-12 col-lg-8">
<div class="lo-heading lo-headingtwo">
<div class="lo-heading_title">
<h2>Our Striking Portfolio</h2>
</div>
<div class="lo-heading_description">
<p>Consectetur adipisicing elit sed do eiusmod tempor incididunt ut
labore etdolore magna aliqua enim ad minim eniam quis nostrud
exercitation ullamco laborisn nisi ut aliqup exean</p>
</div>
</div>
</div>
</div>
<div class="lo-imagegallery">
<div class="row grid">
<div class="col-md-6 col-xl-4 grid-sizer"></div>
<div class="col-lg-6 col-xl-8 grid-item">
<div class="lo-strikimg">
<figure class="lo-imgtime"><img src="images/portfolio/img1.jpg"
alt="image"></figure>
<div class="lo-strikimg_title">
<h3>Time challenge photoshoot</h3>
<a href="javscript:void(0)">www.brandtitle.uk</a>
</div>
<div class="lo-strikimg_description">
<i class="ti-arrow-top-right lo-right"></i>
<div class="lo-effect"></div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-4 grid-item">
<div class="lo-strikimg">
<figure><img src="images/portfolio/img-07.jpg" alt="image"></figure>
<div class="lo-strikimg_title">
<h3>3D laptop replica</h3>
<a href="javscript:void(0)">www.replicamakeover.com</a>
</div>
<div class="lo-strikimg_description">
<i class="ti-arrow-top-right"></i>
<div class="lo-effect"></div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-4 grid-item">
<div class="lo-strikimg lo-strikimg-acitve">
<figure><img src="images/portfolio/img-08.jpg" alt="image"></figure>
<div class="lo-strikimg_title">
<h3>Art & caligraphy</h3>
<a href="javscript:void(0)">www.artmania2020.biz</a>
</div>
<div class="lo-strikimg_description">
<i class="ti-arrow-top-right"></i>
<div class="lo-effect"></div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-4 grid-item">
<div class="lo-strikimg">
<figure><img src="images/portfolio/img-09.jpg" alt="image"></figure>
<div class="lo-strikimg_title">
<h3>Luxx - the interior</h3>
<a href="javscript:void(0)">www.Luxxint.org</a>
</div>
<div class="lo-strikimg_description">
<i class="ti-arrow-top-right"></i>
<div class="lo-effect"></div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-4 grid-item">
<div class="lo-strikimg">
<figure><img src="images/portfolio/img-10.jpg" alt="image"></figure>
<div class="lo-strikimg_title">
<h3>Work desk mockup</h3>
<a href="javscript:void(0)">www.mockingdesk.au</a>
</div>
<div class="lo-strikimg_description">
<i class="ti-arrow-top-right"></i>
<div class="lo-effect"></div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-4 grid-item">
<div class="lo-strikimg">
<figure><img src="images/portfolio/img6.jpg" alt="image"></figure>
<div class="lo-strikimg_title">
<h3>Urban typist</h3>
<a href="javscript:void(0)">www.typisting.in</a>
</div>
<div class="lo-strikimg_description">
<i class="ti-arrow-top-right"></i>
<div class="lo-effect"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- PORTFOLIO SECTION END -->
<!-- RATING SECTION START -->
<div class="lo-main-section container-fluid">
<ul class="lo-rattingcoment" data-aos="fade-up">
<li>
<div class="lo-comment">
<figure><img src="images/comment/img1.png" alt=""></figure>
<div class="lo-comment_title">
<div class="lo-commenttitle_heading">
<h4><a href="javascript:void(0);">Jenell kothari</a></h4>
<a href="javascript:void(0)">www.themefores.net</a>
</div>
<div class="lo-featureRating"><span class="lo-featureRating__stars
lo-featureRating_starsV2"><span></span></span></div>
</div>
<div class="lo-comment_description">
<p>“ Consectetur adipisicing elit sed doit eiusmod cididunt labore et dolore
magna aliqua.”</p>
</div>
</div>
</li>
<li>
<div class="lo-comment">
<figure><img src="images/comment/img2.png" alt=""></figure>
<div class="lo-comment_title">
<div class="lo-commenttitle_heading">
<h4><a href="javascript:void(0);">Babette stumpff</a></h4>
<a href="javascript:void(0)">www.urlwebhere.com</a>
</div>
<div class="lo-featureRating"><span class="
lo-featureRating__stars lo-featureRating_starsV2"><span></span></span></div>
</div>
<div class="lo-comment_description">
<p>“Eiusmod tempor incideunt ut labore et dolore magna aliqua enim ad minim
veniam anostrud exercitation ullamco laboris nisiut aliquip.”</p>
</div>
</div>
</li>
<li>
<div class="lo-comment">
<figure><img src="images/comment/img3.png" alt=""></figure>
<div class="lo-comment_title">
<div class="lo-commenttitle_heading">
<h4><a href="javascript:void(0);">Denyse diego</a></h4>
<a href="javascript:void(0)">www.somerandom.biz</a>
</div>
<div class="lo-featureRating"><span class="lo-featureRating__stars"
><span></span></span></div>
</div>
<div class="lo-comment_description">
<p>“Commodo consequat duis aute irure dolor in reprehenderit in voluptate
velit esse cillumae dolore eu fugiat nulla pariatur.”</p>
</div>
</div>
</li>
<li>
<div class="lo-comment">
<figure><img src="images/comment/img4.png" alt=""></figure>
<div class="lo-comment_title">
<div class="lo-commenttitle_heading">
<h4><a href="javascript:void(0);">Stephane greve</a></h4>
<a href="javascript:void(0)">www.linkslonely.com</a>
</div>
<div class="lo-featureRating"><span class="lo-featureRating__stars
lo-stars"><span></span></span></div>
</div>
<div class="lo-comment_description">
<p>“Excepteur sint occaecat cupidat non proident sunt in culpa qui
officia.”</p>
</div>
</div>
</li>
</ul>
</div>
<!-- RATING SECTION END -->
<!-- SLIDER SECTION START -->
<section class="lo-main-section" data-aos="fade-up">
<div class="container">
<div class="row justify-content-center">
<div class="col-sm-12 col-lg-8">
<div class="lo-heading lo-headingtwo">
<div class="lo-heading_title">
<h2>Meet our tech guys</h2>
</div>
<div class="lo-heading_description">
<p>Consectetur adipisicing elit sed do eiusmod tempor incididunt ut
labore etdolore magna aliqua enim ad minim eniam quis nostrud
exercitation ullamco laborisn nisi ut aliqup exean</p>
</div>
</div>
</div>
</div>
<div id="lo-meettechslider" class="owl-carousel lo-meettechslider lo-nav">
<div class="item">
<div class="lo-meettech">
<figure>
<img src="images/slider/img1.jpg" alt="Image Description">
</figure>
<div class="lo-creativetitle">
<h3><a href="javacript:void(0);">Brian luxton</a></h3>
<span>Expert Brain Stormer</span>
</div>
</div>
</div>
<div class="item">
<div class="lo-meettech lo-meettech-active">
<figure>
<img src="images/slider/img2.jpg" alt="Image Description">
</figure>
<div class="lo-creativetitle">
<h3> <a href="javacript:void(0);">Della shawn</a></h3>
<span>The Show Stopper</span>
</div>
</div>
</div>
<div class="item">
<div class="lo-meettech">
<figure>
<img src="images/slider/img3.jpg" alt="Image Description">
</figure>
<div class="lo-creativetitle">
<h3> <a href="javacript:void(0);">Eric weingarten</a></h3>
<span>The Code Slinger</span>
</div>
</div>
</div>
<div class="item">
<div class="lo-meettech">
<figure>
<img src="images/slider/img4.jpg" alt="Image Description">
</figure>
<div class="lo-creativetitle">
<h3> <a href="javacript:void(0);"> Hermelinda bridgett</a></h3>
<span>Founder & CEO</span>
</div>
</div>
</div>
<div class="item">
<div class="lo-meettech">
<figure>
<img src="images/slider/img5.jpg" alt="Image Description">
</figure>
<div class="lo-creativetitle">
<h3> <a href="javacript:void(0);"> Hermelinda bridgett</a></h3>
<span>Founder & CEO</span>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- SLIDER SECTION END -->
</main>
<!-- MAIN END -->
<!-- FOOTER START -->
<footer class="lo-footer lo-footervtwo">
<div class="lo-topfooter">
<div class="container">
<div class="row justify-content-center">
<div class="col-sm-12 col-lg-8">
<div class="lo-topfooter_title">
<h2>Made Up Your Mind?</h2>
<span>Let’s Get To Work Now 😉</span>
</div>
<div class="lo-topfooter_description">
</div>
<div class="lo-topfooter_input">
<input type="email" placeholder="Enter You Email" class="form-control">
<a href="javascript:void(0);" class="lo-btn">Contact Me</a>
</div>
<em>Let us contact you. just drop your email above *</em>
</div>
</div>
</div>
</div>
<div class="lo-bottomfooter">
<div class="container">
<div class="row">
<div class="col-12">
<div class="bottom-navbar">
<div class="lo-bottomfooter_left">
<p>Copyright © 2021, Made Direct From <em>❤</em></p>
</div>
<nav class="lo-bottomfooter_right">
<ul>
<li><a href="about.html">About</a></li>
<li><a href="services.html">Service</a></li>
<li><a href="portfolio-grid.html">Portfolio</a></li>
<li><a href="news-grid.html">News</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</div>
</div>
</div>
</div>
</div>
</footer>
<!-- FOOTER END -->
<script src="js/vendor/jquery.min.js"></script>
<script src="js/vendor/jquery-library.js"></script>
<script src="js/vendor/bootstrap.min.js"></script>
<script src="js/vendor/owl.carousel.min.js"></script>
<script src="js/vendor/typed.min.js"></script>
<script src="js/vendor/aos.js"></script>
<script src="js/vendor/masonry.pkgd.min.js"></script>
<script src="js/vendor/jquery.paroller.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>
CSS / SASS and JS are important part of the website. We've included all the styling in main.css for frontend, All the styling are inside the SASS files, witch are compiling in main.css. In order to compile sass files into css file you need to install node.js then install this command npm install -g sass and then for the frontend run this command sass --watch scss/main.scss:css/main.css And we done main.js file code with proper commenting to avoid more http request to server and to make website faster. Inside HTML > CSS you can find main.css which contains all the css.
<link rel="stylesheet" href="css/main.css">
Bootstrap.css Inside HTML > CSS you can find bootstrap.css which is the main part of the website as Taskbot based on Bootstrap v4.3.1 it is recommended to include bootstrap.css file right before main.css file.
<link rel="stylesheet" href="css/bootstrap.css">
main.js Inside HTML > JS you can find main.js which contains all the custom and plugins code used in website.
<script src="js/main.js"></script>
The Logo Container can be found in the Sidebar Container - logo
<strong class="lo-logo">
<a href="index.html"><svg id="Logo" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 949.41 146.38"><defs><style>.cls-1{fill:#2d2d2d;}.cls-1,
.cls-2{fill-rule:evenodd;}.cls-2{fill:#ff005a;}</style></defs><path
id="_01" data-name=" 01" class="cls-1" d="M0,143.19h110.4v-36.6H47.19V3.19H0Zm123,0h47
.2V3.19H123Zm162-140v63.6l-53.2-63.6H193v140h46V79.59l53.2,63.6H331V3.19Zm161,
140h54.6l-58.8-78.4,56-61.6h-51.4l-46,50.8V3.19H354v140h46.4v-34.6L411,
96.79Zm272-63.6,53.2,63.6H810V3.19H764v63.6L717.9,11.69m161.49,95.9V89.19h59.2v-34h-59
.2V38.79h67.4V3.19H833v140h116.4v-35.6Z"/><path id="_02" data-name=" 02"
class="cls-2" d="M504.49,33.89q-8.1,16.5-8.1,39.3t8.1,39.3m0,0q8.1,16.5,22.4,25.2t32.9,
8.7h0q18.6,0,32.9-8.7t22.4-25.2q8.1-16.5,8.1-39.3t-8.1-39.3q-8.1-16.5-22.4-25.2T559.79,
0q-18.6,0-32.9,8.7t-22.4,25.2m55.3,74.7q-16,0-16-35.4t16-35.4q16,0,16,35.4t-16,
35.4Zm67.8-105.4v35.6h24v104.4h47.2V3.19Zm123,140h-33v-40"/></svg></a>
</strong>;
NOTE The Logo Image's maximum width can be 180px and maximum height can be 60px
You can change your Website's Color Scheme in an instant. You simply need to change the Color Code in the scss/abstracts/_variables.scss file & you are good to go.
Colors are defined with $theme-color and $sec-theme-color in scss/abstracts/_variables.scss you can change the variable value to change the theme and secondary colors
Now simply change the Codes according to your requirements
Change your Fonts on the Fly as we have included fonts in scss/abstracts/_variables.scss file. LinkOne uses 3 Fonts namely: 'Montserrat', sans-serif 'Source Sans Pro', sans-serif 'Libre Baskerville', serif from the Google Fonts Library. You can find the Linking to the Font Files in the scss/base/_base.scss file
@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital@1&family
=Montserrat:wght@400;500;600;700&family=Source+Sans+Pro:ital@0;1&display=swap');
In order to change the Fonts, you will need to Edit the Above Links with your Custom Font if you plan to use a Google Font or Remove it complete if you plan to use a Self Hosted font. Here is an Example for using Self Hosted Fonts.
<nav class="lo-navbar navbar-expand-xl">
<button id="overlay" class="navbar-toggler" type="button" data-toggle="collapse"
aria-expanded="false" aria-label="Toggle navigation">
<i class="lnr lnr-menu"></i>
</button>
<div class="collapse navbar-collapse">
<ul class="navbar-nav lo-navbarnav">
<li class="menu-item-has-children">
<a href="javascript:void(0);">Main</a>
<ul class="sub-menu">
<li class="menu-item-has-children">
<a href="javascript:void(0);">Home</a>
<ul class="sub-menu">
<li><a href="index.html">Home V1</a></li>
<li><a href="indexvtwo.html">Home V2</a></li>
<li><a href="indexvthree.html">Home V3</a></li>
<li><a href="indexvfour.html">Home V4</a></li>
</ul>
</li>
<li class="menu-item-has-children">
<a href="javascript:void(0);">News</a>
<ul class="sub-menu">
<li>
<a href="news-grid-v1.html">News Grid V1</a>
</li>
<li>
<a href="news-grid.html">News Grid V2</a>
</li>
<li>
<a href="news-single.html">News Single</a>
</li>
</ul>
</li>
<li>
<a href="404.html">404</a>
</li>
<li>
<a href="coming_soon.html">Coming Soon</a>
<a href="coming_soon_v1.html">Coming Soon V Two</a>
</li>
</ul>
</li>
<li class="menu-item-has-children">
<a href="javascript:void(0);">Portfolio</a>
<ul class="sub-menu">
<li>
<a href="portfolio-grid.html">Portfolio Grid</a>
</li>
<li>
<a href="portfolio-grid-modren.html">Portfolio Grid Modren</a>
</li>
</ul>
</li>
<li><a href="services.html">Services</a></li>
<li><a href="contact.html">Contact</a></li>
<li class="">
<a href="about.html">About</a>
</li>
</ul>
</div>
</nav>
LinkOne boasts of a huge number of handy Pages which are quite powerful, flexible, functional & easy to use. Setting up pages is very easy & Self Explanatory. Here is the List of Pages included with LinkOne
index.htmlindexvtwo.htmlindexvthree.htmlindexvfour.htmlservices.htmlabout.htmlcoming_soon_v1.htmlcoming_soon.htmlnews-grid.htmlnews-grid-v1.htmlnews-singles.htmlportfolio-grid.htmlportfolio-grid-modren.htmlcontact.html404.htmlEach of the above mentioned Pages are easily extendable, flexible & easy to use. You can find the sample codes in their respective files. We are explaining a few of them for your Reference.
Setup content you want to stand out. You can use Parallax Images or HTML5 Videos as Sections.
Setting Up Sections:
Setup your Sections outside the .container element. sections padding-top and padding-boottom is 50px by default but you can change it by adding handy classes like p-0, pt-4 etc.
Light Section:
<section class="lo-main-section"">
</section>
You can add Embedded Google Maps to any Page using the following setup:
In order to change a Google Map go to Google Map. Then search your desire location then click on share Button. A popup opens then select Embed a map tab then click on COPY HTML in order to copy embeded code and paste into your HTML file
<div class="lo-contactmap">
<iframe src="https://www.google.com/maps/embed?></iframe>
</div>
We've used Font Awesome icons , themify-icons. and Linearicons.
Released on 19 October 2021
- Released LinkOne Template