You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
612 lines
26 KiB
612 lines
26 KiB
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<meta charset="utf-8" /> |
|
<title>Bizzpro - Digital Corporate Business Creative Html Template</title> |
|
<!-- Stylesheets --> |
|
<link href="css/bootstrap.css" rel="stylesheet" /> |
|
<link href="css/style.css" rel="stylesheet" /> |
|
<link href="css/scrollbar.css" rel="stylesheet" /> |
|
<!-- Responsive --> |
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> |
|
<meta |
|
name="viewport" |
|
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" |
|
/> |
|
<!--[if lt IE 9 |
|
]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script |
|
><![endif]--> |
|
<!--[if lt IE 9]><script src="js/respond.js"></script><![endif]--> |
|
</head> |
|
|
|
<body> |
|
<!--Page Wrapper--> |
|
<div class="page-wrapper"> |
|
<!--Sidebar--> |
|
<aside id="sidebar"> |
|
<!--Toggle Button--> |
|
<div class="button-container clearfix"> |
|
<div class="menu-toggle flaticon-menu10"></div> |
|
</div> |
|
|
|
<!--Menu Box--> |
|
<div class="menu-box"> |
|
<!--Logo--> |
|
<br /> |
|
<div class="logo text-center"> |
|
<a href="#"><img src="logo.png" alt="img"></a> |
|
</div> |
|
|
|
<!--Sticky Menu--> |
|
<nav class="sticky-menu"> |
|
<ul> |
|
<li class="current"> |
|
<a href="#introduction" |
|
><span class="fa fa-arrow-right"></span |
|
>Introduction </a> |
|
</li> |
|
<li> |
|
<a href="#html-structure" |
|
>HTML Structure <span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#css-structure" |
|
>CSS Files and Structure <span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#javascript" |
|
>Javascript <span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#contact-form" |
|
>Contact Form Settings<span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#required-file" |
|
>Required File<span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#logo-area" |
|
>Logo<span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#about-area" |
|
>About area<span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#service-area" |
|
>Fact Area<span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#video-area" |
|
>Video Area<span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#faq-area" |
|
>Featured Area<span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#testimonial-area" |
|
>testimonial Area<span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#team-area" |
|
>CTA Area<span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#service-area" |
|
>Service Area<span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#blog-area" |
|
>blog Area<span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#footer-area" |
|
>Footer Menu<span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#copyright-area" |
|
>Copy Right<span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#Feature-card" |
|
>Features <span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#sources-credits" |
|
>Sources and Credits <span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
<li> |
|
<a href="#support" |
|
>Support <span class="fa fa-arrow-right"></span |
|
></a> |
|
</li> |
|
</ul> |
|
</nav> |
|
</div> |
|
|
|
<div class="copyright">Copyright © <a href="#">Bizzpro</a> 2024</div> |
|
</aside> |
|
|
|
<div id="content-section"> |
|
<!--Introduction Section--> |
|
<section class="section introduction" id="introduction"> |
|
<div class="sec-title"> |
|
<h2>Intoduction</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<h2>Bizzpro</h2> |
|
<h3>Bizzpro - Digital Corporate Business Creative Html Template</h3> |
|
|
|
<div class="separator"></div> |
|
|
|
<strong>Created :</strong> 1/1/2024 <br/> |
|
<strong>Last Update :</strong> 1/1/2024 <br/> |
|
<strong>By :</strong> wowtheme7<br /> |
|
|
|
<br /> |
|
<p> |
|
Thank you for purchasing <strong>Bizzpro</strong> Digital Corporate Business Creative Html 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 .<br />Thank you so much! |
|
</p> |
|
</div> |
|
</section> |
|
|
|
<!--HTML Structure--> |
|
<section class="section html-structure" id="html-structure"> |
|
<div class="sec-title"> |
|
<h2>HTML Structure</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<h3> |
|
The html template uses Latest <strong>Bootstrap 5</strong> 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. |
|
</h3> |
|
|
|
<div class="html-code"> |
|
<img src="images/html-sample.png" alt="image html"/> |
|
</div> |
|
<br> |
|
<br> |
|
<div class="html-code"> |
|
<h2>Output</h2> |
|
<br> |
|
<img src="images/output.png" alt="image html"/> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
<!--CSS Structure--> |
|
<section class="section css-structure" id="css-structure"> |
|
<div class="sec-title"> |
|
<h2>SASS Files and Structure</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<h3> |
|
Mainly three main CSS files are used in this theme. The first one |
|
<strong>bootstrap.css</strong>, second one is |
|
<strong>style.css</strong> which for this template and third one is |
|
<strong>responsive.css</strong> to control responsive layouts. |
|
</h3> |
|
<p> |
|
If you would like to edit a specific section of the site, simply find |
|
the appropriate label in the CSS file, and then scroll down until you |
|
find the appropriate style that needs to be edited. |
|
</p> |
|
<h2>We used SASS for better productivity</h2> |
|
<p> |
|
Instead of working with large css file we break them into three pieces |
|
</p> |
|
<p> |
|
<strong>Elements:</strong> We keep every modular elements style in this |
|
folder. Module files are name according to their class name. For naming |
|
convention we used BEM method. |
|
</p> |
|
<p><strong>General:</strong> General styles are written here.</p> |
|
<p><strong>Sections:</strong> Section specific styles are written here.</p> |
|
|
|
<div class="html-code"> |
|
<br> |
|
<img src="images/css.png" alt="image html"/> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
<!--Javascript--> |
|
<section class="section javascript" id="javascript"> |
|
<div class="sec-title"> |
|
<h2>Jquery and javascript</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<h3>This theme imports three types of Javascript files.</h3> |
|
<ul> |
|
<li>jQuery</li> |
|
<li>Custom scripts <strong>(custom.js)</strong></li> |
|
<li>Scripts for google map <strong>(custom.js)</strong></li> |
|
<li>Use Some plugins file</li> |
|
<br /> |
|
<li> |
|
<strong>jQuery</strong> is a Javascript library that greatly reduces |
|
the amount of code that you must write. |
|
</li> |
|
<li> |
|
Most of the animation in this site is carried out from the customs |
|
scripts. There are a few functions worth looking over. |
|
</li> |
|
</ul> |
|
<br /> |
|
<p> |
|
In addition to the custom scripts, I have implemented few "tried and |
|
true" plugins to create the effects. This plugin is packed, so you won't |
|
need to manually edit anything in the file. The only necessary thing to |
|
know is how to call the method |
|
</p> |
|
|
|
<div class="html-code"> |
|
<br> |
|
<img src="images/js.png" alt="image html"/> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
<!--contact-form Settings--> |
|
<section class="section map-settings" id="contact-form"> |
|
<div class="sec-title"> |
|
<h2>Contact form Structure</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<div class="html-code"> |
|
<img src="images/contact.png" alt="image html"/> |
|
</div> |
|
<br> |
|
<br> |
|
<h2>Output</h2> |
|
<br> |
|
<div class="html-code"> |
|
<img src="images/output2.png" alt="image html"/> |
|
</div> |
|
<br> |
|
</div> |
|
</section> |
|
|
|
<!--required-file--> |
|
<section class="section map-settings" id="required-file"> |
|
<div class="sec-title"> |
|
<h2>Required File</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<h2>Required Css</h2> |
|
<br> |
|
<div class="html-code"> |
|
<img src="images/required-css.png" alt="image html"/> |
|
</div> |
|
<br> |
|
<br> |
|
<div class="html-code"> |
|
<h2>Required Js</h2> |
|
<br> |
|
<img src="images/required-js.png" alt="image html"/> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
<!--logo Structure--> |
|
<section class="section map-settings" id="logo-area"> |
|
<div class="sec-title"> |
|
<h2>Logo Structure</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<div class="html-code"> |
|
<img src="images/logo.png" alt="image html"/> |
|
</div> |
|
<br> |
|
<br> |
|
<div class="sec-content"> |
|
<h2>Output</h2> |
|
<br> |
|
<div class="html-code"> |
|
<img src="images/output3.png" alt="image html"/> |
|
</div> |
|
<br> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
<!--about Structure--> |
|
<section class="section map-settings" id="about-area"> |
|
<div class="sec-title"> |
|
<h2>About Structure</h2> |
|
</div> |
|
<br /> |
|
<div class="sec-content"> |
|
<h2>About area</h2> |
|
<br> |
|
<div class="html-code"> |
|
<img src="images/about.png" alt="image html"/> |
|
</div> |
|
</div> |
|
<br> |
|
<div class="sec-content"> |
|
<h2>Output</h2> |
|
<br> |
|
<div class="html-code"> |
|
<img src="images/output4.png" alt="image html"/> |
|
</div> |
|
<br> |
|
</div> |
|
|
|
</section> |
|
|
|
<!--service Structure--> |
|
<section class="section map-settings" id="service-area"> |
|
<div class="sec-title"> |
|
<h2>Fact Area Structure</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<div class="html-code"> |
|
<img src="images/fact.png" alt="image html"/> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
<!--video Structure--> |
|
<section class="section map-settings" id="video-area"> |
|
<div class="sec-title"> |
|
<h2>Video Area Structure</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<div class="html-code"> |
|
<img src="images/video.png" alt="image html"/> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
<!--faq Structure--> |
|
<section class="section map-settings" id="faq-area"> |
|
<div class="sec-title"> |
|
<h2>Featured Area Structure</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<div class="html-code"> |
|
<img src="images/featured.png" alt="image html"/> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
<!--testimonial Structure--> |
|
<section class="section map-settings" id="testimonial-area"> |
|
<div class="sec-title"> |
|
<h2>testimonial Area Structure</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<div class="html-code"> |
|
<img src="images/testimonial.png" alt="image html"/> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
<!--team Structure--> |
|
<section class="section map-settings" id="team-area"> |
|
<div class="sec-title"> |
|
<h2>CTA Area Structure</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<div class="html-code"> |
|
<img src="images/cta.png" alt="image html"/> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
<!--team Structure--> |
|
<section class="section map-settings" id="service-area"> |
|
<div class="sec-title"> |
|
<h2>Course Area Structure</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<div class="html-code"> |
|
<img src="images/service.png" alt="image html"/> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
<!--blog Structure--> |
|
<section class="section map-settings" id="blog-area"> |
|
<div class="sec-title"> |
|
<h2>blog Area Structure</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<div class="html-code"> |
|
<img src="images/blog.png" alt="image html"/> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
<!--Footer Structure--> |
|
<section class="section map-settings" id="footer-area"> |
|
<div class="sec-title"> |
|
<h2>Footer Menu Structure</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<div class="html-code"> |
|
<img src="images/footer.png" alt="image html"/> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
<!--Footer Structure--> |
|
<section class="section map-settings" id="copyright-area"> |
|
<div class="sec-title"> |
|
<h2>Copy Right Structure</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<div class="html-code"> |
|
<img src="images/copyright.png" alt="image html"/> |
|
</div> |
|
</div> |
|
</section> |
|
|
|
<!--Feature area--> |
|
<section class="section sources-credits" id="Feature-card"> |
|
<div class="sec-title"> |
|
<h2>Features</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<ul> |
|
<li>SASS File Included</li> |
|
<li>100% pixel perfect design</li> |
|
<li>Clean and Simple Style</li> |
|
<li>Smooth transition effects.</li> |
|
<li>Cross Browser Optimization.</li> |
|
<li>Google font.</li> |
|
<li>Compatible Browsers – IE9+, Chrome, Safari, Opera, Firefox</li> |
|
<li>Documentation – Yes</li> |
|
<li>License – GPL</li> |
|
<li>Version – 1.0.0</li> |
|
<li>Columns – 4</li> |
|
<li>Files Included -html, JS, css</li> |
|
<li>User Friendly Code</li> |
|
<li>Easy to customize</li> |
|
<li>W3C Validation</li> |
|
<li>Clean & Modern Design</li> |
|
<li>CSS3 animations</li> |
|
<li>Full Responsive</li> |
|
<li>SEO friendly code</li> |
|
</ul> |
|
</div> |
|
<div class="sec-title"> |
|
<h2>Pages</h2> |
|
</div> |
|
<br /> |
|
<div class="sec-content"> |
|
<ul> |
|
<li>3 Homepages</li> |
|
<li>About</li> |
|
<li>Service</li> |
|
<li>Service Details</li> |
|
<li>Project</li> |
|
<li>Project Details</li> |
|
<li>Blog</li> |
|
<li>Blog Details</li> |
|
<li>Contact</li> |
|
</ul> |
|
</div> |
|
|
|
</section> |
|
|
|
<!--Sources and Credits--> |
|
<section class="section sources-credits" id="sources-credits"> |
|
<div class="sec-title"> |
|
<h2>Sources and Credits</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<h3> |
|
Fonts Used int the template are google fonts, you can find theme on |
|
Google Fonts API |
|
</h3> |
|
|
|
<p><strong>Font Used:</strong></p> |
|
<ul> |
|
<li><a href="https://fonts.google.com/specimen/Inter+Sans">"Inter", sans-serif;</a></li> |
|
</ul> |
|
|
|
<ul class="source-files"> |
|
<li><a href="http://www.getbootstrap.com/" target="_blank" title="Bootstrap">Bootstrap</a></li> |
|
<li><a href="https://fonts.google.com/" target="_blank" title="Google Fonts">Google Fonts</a></li> |
|
<li><a href="https://fontawesome.com/v 5.15.2/">Font Awesome</a></li> |
|
</ul> |
|
|
|
|
|
<br> |
|
Every Code is properly commented for Editing Ease. |
|
</div> |
|
</section> |
|
|
|
<!--Support--> |
|
<section class="section support" id="support"> |
|
<div class="sec-title"> |
|
<h2>Support</h2> |
|
</div> |
|
|
|
<br /> |
|
<div class="sec-content"> |
|
<h3> |
|
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. <strong>wowtheme7@gmail.com</strong> |
|
</h3> |
|
|
|
<p>Email Us at : <a href="#">wowtheme7@gmail.com</a></p> |
|
</div> |
|
</section> |
|
</div> |
|
</div> |
|
<!--End pagewrapper--> |
|
|
|
<script src="js/jquery.js"></script> |
|
<script src="js/bootstrap.min.js"></script> |
|
<script src="js/jquery.nav.js"></script> |
|
<script src="js/jquery.scrollTo.js"></script> |
|
<script src="js/scrollbar.js"></script> |
|
<script src="js/script.js"></script> |
|
</body> |
|
</html>
|
|
|