Docly
Welcome to docbuzz ! Get familiar with the Stripe products and explore their features:
Thank you for purchasing Docly - Documentation Service HTML5 Template. 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 or put a ticket at Support Center. Thankyou so much!
Template Features
HTML Structure
The html template uses Latest Bootstrap v4.0.0 with valid HTML5 tags. This theme is a responisve layout with 4 column Support column. All of the information in content area is nested within a class and comes with predefined classes.
Basic Grid HTML
For a simple two column layout, create a .container and add the appropriate number of .col-md* columns.
<div class="container">
<div class="col-lg-4">...<div>
<div class="col-lg-8">...<div>
<div>
Header Title
Welcome to docbuzz ! Documentation and more.
<div class="shortcode_title">
<h2>Header Title<h2>
<p><span>Welcome to docbuzz !<span> Documentation and more.<p>
<div>
Nesting Columns
<div class="container">
<div class="row">
<div class="col-lg-3">Level 1<div>
<div class="col-lg-7 col-md-8">Level 2<div>
<div class="col-lg-2 col-md-4">Level 3<div>
<div>
<div>
CSS Files Structure
Mainly three main CSS files are used in this theme. The first one bootstrap.css, second one is style.css which for this template and third one is responsive.css to control responsive layouts.
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/slick/slick.css">
<link rel="stylesheet" href="assets/slick/slick-theme.css">
<link rel="stylesheet" href="assets/elagent-icon/style.css">
<link rel="stylesheet" href="assets/niceselectpicker/nice-select.css">
<link rel="stylesheet" href="assets/animation/animate.css">
<link rel="stylesheet" href="assets/prism/prism.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/responsive.css">
Jquery And Javascript
jQuery is a Javascript library that greatly reduces the amount of code that you must write.Most of the animation in this site is carried out from the customs scripts. There are a few functions worth looking over.
<script src="js/jquery-3.2.1.min.js"><script>
<script src="assets/bootstrap/js/popper.min.js"><script>
<script src="assets/bootstrap/js/bootstrap.min.js"><script>
<script src="assets/slick/slick.min.js"><script>
<script src="js/parallaxie.js"><script>
<script src="js/TweenMax.min.js"><script>
<script src="js/jquery.wavify.js"><script>
<script src="js/anchor.js"><script>
<script src="assets/wow/wow.min.js"><script>
<script src="assets/niceselectpicker/jquery.nice-select.min.js"><script>
<script src="assets/tooltipster/js/tooltipster.bundle.min.js"><script>
<script src="js/main.js"><script>
Tutorial
Logo
Lets start updating the template. Open index.html file and follow the steps.
<a class="navbar-brand sticky_logo" href="index.html">
<img src="img/logo-w.png" srcset="img/logo-w2x.png 2x" alt="logo">
<img src="img/logo.png" srcset="img/logo-2x.png 2x" alt="logo">
<a>
NavMenu
This is the basic structure.
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto mr-auto menu">
<li class="nav-item dropdown submenu active">
<a class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Home
<a>
<ul class="dropdown-menu">
<li class="nav-item active"><a href="index.html" class="nav-link">Home One<a><li>
<li class="nav-item"><a href="index-2.html" class="nav-link">Home Two<a><li>
<li class="nav-item"><a href="index-3.html" class="nav-link">Home Three<a><li>
<ul>
<li>
<li class="nav-item"><a class="nav-link" href="about.html">About<a><li>
<li class="nav-item dropdown submenu">
<a class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Departments
<a>
<ul class="dropdown-menu">
<li class="nav-item"><a href="service.html" class="nav-link">Department<a><li>
<li class="nav-item"><a href="service-details.html" class="nav-link">Department Single<a><li>
<ul>
<li>
<li class="nav-item dropdown submenu">
<a class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Pages
<a>
<ul class="dropdown-menu">
<li class="nav-item"><a href="faq.html" class="nav-link">Faq<a><li>
<li class="nav-item"><a href="404.html" class="nav-link">404<a><li>
<li class="nav-item"><a href="comingsoon.html" class="nav-link">Coming Soon<a><li>
<ul>
<li>
<li class="nav-item dropdown submenu">
<a class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Blog
<a>
<ul class="dropdown-menu">
<li class="nav-item"><a href="blog.html" class="nav-link">Blog List<a><li>
<li class="nav-item"><a href="blog-single.html" class="nav-link">Blog Details<a><li>
<ul>
<li>
<li class="nav-item"><a class="nav-link" href="contact.html">Contact<a><li>
<ul>
<ul class="list-unstyled navbar-nav">
<li><a href="#" class="btn_effect">GET APPOINMENT<a><li>
<ul>
<div>
- This Template included revolution slider jquery version to replace the content or use it please see the Flex sldier documentation
- You can find the documentation here Slick Slider Docs
Support
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 any queries, please feel free to contact us at Support Center.