Files
demo_sites/templates/template_4/documentation/index.html
2026-05-17 18:29:30 -05:00

307 lines
16 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<link href="assets/bootstrap.min.css" rel="stylesheet" />
<link href="assets/app.css" rel="stylesheet" />
<script src="assets/bootstrap.min.js"></script>
</head>
<body>
<div class="container-fluid">
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container-fluid">
<a class="navbar-brand" href="#">Home</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#navbar">Navbar</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#slider">Slider</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#about">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#services">Services</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#pricing">Pricing</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#clients">Clients</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#team">Team</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#testimonials">Testimonials</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#blog">Blog</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#newsletter">Newsletter</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#contact">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<p class="pt-5">The template uses the below 3rd party libraries:</p>
<ul>
<li>
<a href="https://getbootstrap.com/" target="_blank">Bootstrap 5.1.3</a>
</li>
<li>
<a href="https://github.com/michalsnik/aos" target="_blank">Aos 2.3.4</a>
</li>
<li>
<a href="https://github.com/twbs/icons" target="_blank">Bootstrap Icons 1.11.3</a>
</li>
</ul>
<a name="navbar"></a>
<h3>Navbar</h3>
<ul>
<li>the logo displayed in the navbar section is at <code>asset/img/logo.png</code></li>
<li>the code related to the navbar section can be found below the <code>navbar section start</code> comment
<div>
<img src="assets/img/navbar.png" />
</div>
</li>
<li>the navbar links can be found below the <code>navbar links</code> comment
<div>
<img src="assets/img/navbar-links.png" />
</div>
</li>
</ul>
<a name="slider"></a>
<h3>Slider</h3>
<p></p>
<ul>
<li>the slider displays images located in <code>assets/img/slides/</code> directory</li>
<li>images are loaded through css</li>
<li>the code related to the slider section can be found below the <code>slider section start</code> comment</li>
<li>the code and text associated with each slide is below the comment <code>first slide</code>, <code>second slide</code> and <code>third slide</code>
<div>
<img src="assets/img/slider.png" />
</div>
</li>
<li>the slider section uses the following images:
<ul>
<li>
<a href="https://pixabay.com/photos/job-office-team-business-internet-5382501/" target="_blank">https://pixabay.com/photos/job-office-team-business-internet-5382501/</a>
</li>
<li>
<a href="https://pixabay.com/photos/startup-start-up-people-593341/" target="_blank">https://pixabay.com/photos/startup-start-up-people-593341/</a>
</li>
<li>
<a href="https://pixabay.com/photos/teamwork-cooperation-brainstorming-3213924/" target="_blank">https://pixabay.com/photos/teamwork-cooperation-brainstorming-3213924/</a>
</li>
</ul>
</li>
</ul>
<a name="about"></a>
<h3>About</h3>
<ul>
<li>images related to the about section are stored in <code>assets/img/about/</code> directory</li>
<li>the code related to the about section can be found below the <code>about section start</code> comment
<div>
<img src="assets/img/about.png" />
</div>
</li>
<li>
the about section uses the following image - <a href="https://pixabay.com/photos/people-girls-women-students-2557396/" target="_blank">https://pixabay.com/photos/people-girls-women-students-2557396/</a>
</li>
</ul>
<a name="services"></a>
<h3>Services</h3>
<ul>
<li>images related to the services section are stored in <code>assets/img/services/</code> directory</li>
<li>the code related to the services section can be found below the <code>services section start</code> comment</li>
<li>the text related to each service can be found below the comment <code>first service</code>, <code>second service</code> and <code>third service</code>
<div>
<img src="assets/img/services.png" />
</div>
</li>
</ul>
<a name="pricing"></a>
<h3>Pricing</h3>
<ul>
<li>the code related to the pricing section can be found below the <code>pricing section start</code> comment</li>
<li>the text related to each pricing option can be found below the comment <code>first pricing option</code>, <code>second pricing option</code> and <code>third pricing option</code>
<div>
<img src="assets/img/pricing.png" />
</div>
</li>
</ul>
<a name="clients"></a>
<h3>Clients</h3>
<ul>
<li>images related to the clients section are stored in <code>assets/img/clients/</code> directory</li>
<li>the code related to the clients section can be found below the <code>clients section start</code> comment
<div>
<img src="assets/img/clients.png" />
</div>
</li>
<li>the clients section uses the following images:
<ul>
<li>
<a href="https://uxwing.com/airtel-logo-icon/" target="_blank">https://uxwing.com/airtel-logo-icon/</a>
</li>
<li>
<a href="https://uxwing.com/jio-logo-icon/" target="_blank">https://uxwing.com/jio-logo-icon/</a>
</li>
<li>
<a href="https://uxwing.com/bsnl-logo-icon/" target="_blank">https://uxwing.com/bsnl-logo-icon/</a>
</li>
<li>
<a href="https://uxwing.com/vivo-mobile-logo-icon/" target="_blank">https://uxwing.com/vivo-mobile-logo-icon/</a>
</li>
</ul>
</li>
</ul>
<a name="team"></a>
<h3>Team</h3>
<ul>
<li>images related to the team section are stored in <code>assets/img/team/</code> directory</li>
<li>the code related to the team section can be found below the <code>team section start</code> comment</li>
<li>the data associated with each team member (name, surname, phone and email) can be found below the comment <code>first team member</code>, <code>second team member</code>, <code>third team member</code> and <code>fourth team member</code>
<div>
<img src="assets/img/team.png" />
</div>
</li>
<li>the team section uses the following images:
<ul>
<li>
<a href="https://pixabay.com/photos/smile-work-business-success-5047506/" target="_blank">https://pixabay.com/photos/smile-work-business-success-5047506/</a>
</li>
<li>
<a href="https://pixabay.com/photos/woman-confident-happy-1564001/" target="_blank">https://pixabay.com/photos/woman-confident-happy-1564001/</a>
</li>
<li>
<a href="https://pixabay.com/photos/model-businessman-corporate-2911329/" target="_blank">https://pixabay.com/photos/model-businessman-corporate-2911329/</a>
</li>
<li>
<a href="https://pixabay.com/photos/woman-asian-model-portrait-girl-5772021/" target="_blank">https://pixabay.com/photos/woman-asian-model-portrait-girl-5772021/</a>
</li>
</ul>
</li>
</ul>
<a name="testimonials"></a>
<h3>Testimonials</h3>
<ul>
<li>images related to the testimonials section are stored in <code>assets/img/testimonials/</code> directory</li>
<li>the code related to the testimonials section can be found below the <code>testimonials section start</code> comment</li>
<li>the text associated with each client can be found below the comment <code>first testimonial</code>, <code>second testimonial</code>, <code>third testimonial</code> and <code>fourth testimonial</code>
<div>
<img src="assets/img/testimonials.png" />
</div>
</li>
<li>the testimonials section uses the following images:
<ul>
<li>
<a href="https://pixabay.com/photos/adult-casual-caucasian-glasses-1851571/" target="_blank">https://pixabay.com/photos/adult-casual-caucasian-glasses-1851571/</a>
</li>
<li>
<a href="https://pixabay.com/photos/woman-work-office-whiteboard-4702060/" target="_blank">https://pixabay.com/photos/woman-work-office-whiteboard-4702060/</a>
</li>
<li>
<a href="https://pixabay.com/photos/background-career-caucasian-4969590/" target="_blank">https://pixabay.com/photos/background-career-caucasian-4969590/</a>
</li>
<li>
<a href="https://pixabay.com/photos/adult-bald-beard-corporate-1868750/" target="_blank">https://pixabay.com/photos/adult-bald-beard-corporate-1868750/</a>
</li>
</ul>
</li>
</ul>
<a name="blog"></a>
<h3>Blog</h3>
<ul>
<li>images related to the blog section are stored in <code>assets/img/posts/</code> directory</li>
<li>the code related to the blog section can be found below the <code>blog section start</code> comment</li>
<li>the header and text associated with each post can be found below the comment <code>first post</code>, <code>second post</code> and <code>third post</code>
<div>
<img src="assets/img/blog.png" />
</div>
</li>
<li>the blog section uses the following images:
<ul>
<li>
<a href="https://pixabay.com/photos/software-development-guest-post-4165307/" target="_blank">https://pixabay.com/photos/software-development-guest-post-4165307/</a>
</li>
<li>
<a href="https://pixabay.com/photos/stairs-building-businessmen-6133971/" target="_blank">https://pixabay.com/photos/stairs-building-businessmen-6133971/</a>
</li>
<li>
<a href="https://pixabay.com/photos/laptops-meeting-businessmen-593296/" target="_blank">https://pixabay.com/photos/laptops-meeting-businessmen-593296/</a>
</li>
</ul>
</li>
</ul>
<a name="newsletter"></a>
<h3>Newsletter</h3>
<ul>
<li>the php script related to the newsletter is called <code>newsletter.php</code>
<ul>
<li><code>$to_email</code> - e-mail address to which the newsletter request will be sent</li>
<li><code>$subject</code> - e-mail subject (default: <code>a user is asking for a newsletter</code>)</li>
<li><code>$body</code> - e-mail content (default: <code>user xxx@xxx is asking for a newsletter</code>, where <code>xxx@xxx</code> is a user's e-mail address)</li>
</ul>
</li>
<li>the text and form related to the newsletter section can be found below the <code>newsletter section start</code> comment
<div>
<img src="assets/img/newsletter.png" />
</div>
</li>
</ul>
<a name="contact"></a>
<h3>Contact</h3>
<ul>
<li>the php script related to the newsletter is called <code>contact.php</code>
<ul>
<li><code>$to_email</code> - e-mail address to which the newsletter request will be sent</li>
<li><code>$subject</code> - e-mail subject (default: <code>a user has completed the contact form</code>)</li>
<li><code>$body</code> - an e-mail content (default: <code>a user xxx@xxx has completed the contact form: yyy</code> where <code>xxx@xxx</code> is a user's e-mail address and <code>yyy</code> is a message sent by a user)</li>
</ul>
</li>
<li>the text and form related to the contact section can be found below the <code>contact section start</code> comment</li>
<li>the logo displayed in the contact section is at <code>asset/img/logo-white.png</code></li>
<li>social links can be found below the <code>social links</code> comment</li>
<li>the contact information (address, phone number) can be found below the <code>contact information</code> comment</li>
<li>to change the location of Google Map, replace the <code>src</code> attribute in the <code>iframe</code> tag below <code>google map</code> comment
<div>
<img src="assets/img/contact.png" />
</div>
</li>
</ul>
</div>
</body>
</html>