NahaCivan Documentation

  • Name: NahaCivan
  • Version: 3.0.0
  • Author: Alissio
  • Live Preview: View Demo
  • Support: alissioteam@gmail.com

Thank you for purchasing NahaCivan.
You can find the detailed information about the template in this document.
If you have any questions that are beyond the scope of this help file,
please feel free to email via the Profile page.

1. Introduction

You are a shining owner of a regular license based on Photography Portfolio HTML Template.

NahaCivan is a responsive template for developers to create clean and modern website with ease.

We would like to thank you for choosing NahaCivan and for being our loyal customer. You are entitled to get free updates to this product + exceptional support (as per market policy) from the author directly.

We made NahaCivan from the ground-up with flexibility in mind.
Each element of NahaCivan is extremely customizable, where you can make NahaCivan to reflect your own branding styles.

The guide gives you detailed methodologies about how you can customize NahaCivan and make it fit your brand perfectly!
Please go through the documentation carefully to understand how this product is made and how to edit this properly.
Basic HTML and CSS knowledge is required to customize.

1.1 What's Included

After purchasing NahaCivan on themeforest.net with your Envato account, go to your Download page.
Do not directly upload the zip file you downloaded from Themeforest. To begin, unzip the Themeforest file you just downloaded which contains the following files:

  • documentation folder contains what you are reading now.
  • css, scss, js, img, video, fonts folders contains assets files.
  • .html HTML files.

Key features:

  • Completely Responsive Design Optimized viewing on desktop, tablet and mobile devices.
  • Easy Customization Customize each slide to meet your unique requirements and preferences.
  • Beautiful Appearance on Any Device Great user experience on any screen size or resolution.
  • Advanced Animation Effects Eye-catching transitions between slides.
  • Cross-Browser Compatibility Seamless functionality on multiple browsers.
  • Fast Loading Speed Optimized user experience with fast loading times.
  • User-Friendly Interface Easy to use and navigate.

Other features:

  • Build with Bootstrap 5.3.3
  • Supported Swiper Slider 4.4.1
  • Fully Responsive Layout
  • W3C Valid code 100%
  • Gallery Pages Included
  • Fast Page Load
  • Developer Friendly Code
  • Cross Browser Support
  • Pixel Perfect Design
  • Comfortable Mobile Navigation
  • Fixed Header
  • SEO Optimized
  • Google Fonts
  • Font Awesome Icons
  • It is very easy to use
  • Better Dedicated Support (response within 24 hours)
  • Free Regular Lifetime Updates
  • Well, Extensive Documentation
  • And much more …

2. Files Organization

Ensure the project folder is well-structured:

  nahacivan/
  ├── documentation/                # Documentation File
  ├── demo/                         # Demo Files
  │       ├── home1                 # Home Version 1
  │       │   ├── .html             # Example Slider HTML
  │       │   └── src/              # Assets folder, html files
  │       │        └── assets/      # CSS, JS, Images and Fonts files
  │       │            ├── css/
  │       │            ├── js/
  │       │            ├── img/
  │       │            └── fonts/
  │       ├── home1-dark            # Home Version 1 - Dark
  │       │    ├── .html            # Example Slider HTML
  │       │    └── src/             # Assets folder, html files
  │       │        └── assets/      # CSS, JS, Images and Fonts files
  │       │            ├── css/
  │       │            ├── js/
  │       │            ├── img/
  │       │            └── fonts/
  │       └── home2                # Home Version 2
  │           ├── .html            # Example Slider HTML
  │           └── src/             # Assets folder, html files
  │               └── assets/      # CSS, SCSS, JS, Images, Video, Fonts and Source files
  │                   ├── css/
  │                   ├── scss/
  │                   ├── js/
  │                   ├── img/
  │                   ├── video/
  │                   ├── fonts/
  │                   └── source/  # Source Files (Unminified JS, CSS)
  └── README.txt                   # Basic Info & Licensing

3. Usage Example

Basic HTML Structure for NahaCivan:

  
  <!--wrapper start-->
  <div class="wrapper">
    <!--== Start Preloader Content ==-->
    <div class="preloader-wrap">
      <div class="preloader">
        <span class="dot"></span>
        <span class="dot dot-clone"></span>
      </div>
    </div>
    <!--== End Preloader Content ==-->

    <!--== Start Header Wrapper ==-->
    <header class="header-area transparent sticky-header">
      ...
    </header>
    <!--== End Header Wrapper ==-->
    
    <main class="main-content">
      <!--== Start Hero Area Wrapper ==-->
      <section class="home-slider-area">
        ...
      </section>
      <!--== End Hero Area Wrapper ==-->
  
      <!--== Start About Area Wrapper ==-->
      <section class="about-area about-default-area">
        ...
      </section>
      <!--== End About Area Wrapper ==-->
  
      <!--== Start Portfolios Area Wrapper ==-->
      <section class="portfolio-area portfolio-default-area">
        ...
      </section>
      <!--== End Portfolios Area Wrapper ==-->

      <!--== Start Service Area Wrapper ==-->
      <section class="service-area service-default-area">
        ...
      </section>
      <!--== End Service Area Wrapper ==-->
      
      <!--== Start Team Area Wrapper ==-->
      <section class="team-area team-default-area pb-150">
        ...
      </section>
      <!--== End Team Area Wrapper ==-->

      <!--== Start Footer Area Wrapper ==-->
      <footer class="footer-area">
        ...
      </footer>
      <!--== End Footer Area Wrapper ==-->
    </main>

    <!--== Scroll Top Button ==-->
    <div id="scroll-to-top" class="scroll-to-top"><span class="fa fa-angle-up"></span></div>

    <!--== Start Login Modal ==-->
    <div class="aside-login-form-wrap aside-login-form-wrap-one">
      ...
    </div>
    <!--== End Login Modal ==-->

    <!--== Start Register Modal ==-->
    <div class="aside-login-form-wrap aside-login-form-wrap-two">
      ...
    </div>
    <!--== End Register Modal ==-->

    <!--== Start Side Menu ==-->
    <aside class="off-canvas-wrapper">
      ...
    </aside>
    <!--== End Side Menu ==-->
  
    <!--== Start Aside Menu ==-->
    <div class="aside-menu-wrap">
      ...
    </div>
    <!--== End Aside Menu ==-->
  </div>

4. Code Standards

  • Validate all HTML and CSS using tools like the W3C Validator.
  • Write clean, well-commented JavaScript code and follow best practices.

5. CSS Structure

  
    <!-- Swiper -->
    <link rel="stylesheet" href="assets/css/swiper.min.css">

    <!-- Bootstrap -->
    <link href="assets/css/bootstrap.min.css" rel="stylesheet">

    <!-- Style -->
    <link rel="stylesheet" href="assets/css/style.min.css">

    <!-- Animate -->
    <link rel="stylesheet" href="assets/css/animate.min.css">

6. Fonts Include

Google Fonts imported inside style.min.css file

  
    <link href="https://fonts.googleapis.com/css?family=Poppins:300,400,400i,500,600,700,800" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Big+Shoulders+Display:300,400,500,600,700,800,900" rel="stylesheet">

7. JavaScript Structure

  
  <!-- Jquery -->
  <script src="js/jquery-main.js"></script>

  <!-- Swiper -->
  <script src="js/swiper.min.js"></script>

  <!-- Light Gallery -->
  <script src="js/lightgallery.min.js"></script>

  <!-- Custom -->
  <script src="js/custom.min.js"></script>

8.1 Change Site Title

To change your Site Title open the index.html in your editor and go to the title tag.

  
  <title>NahaCivan - Photography Portfolio Bootstrap 5 Template Preview</title>

9. Testing

  • Cross-Browser Compatibility: Tested on Chrome, Firefox, Edge, and Safari.
  • Responsivenes: Ensure it works seamlessly on mobile, tablet, and desktop devices.
  • Performance Optimization: Minify CSS/JS files and optimize assets for faster loading times.

10. Sources and Credits

The product uses following resources by third parties.

11. Support

For any questions or issues, please contact our support team:

Email: alissioteam@gmail.com

Included in Free Support Scope:

  • Fixing bugs
  • Helping clients in changing site contents by sending instructions that couldn’t be covered by documentation

NOT Included in Free Support Scope:

  • Any type of custom changes
  • Any type of request to update clients’ site contents

Paid Support Scope:

Paid support is not a part of Free Support when you purchase the template from themeforest. We understand that some clients need custom changes while using our template. For that we kept an option for paid support which includes:

  • Custom change request
  • Custom pages
  • Custom features

We kept a flat rate for our paid support which is $35/hour.

Before seeking support, please...

  • Make sure your question is a valid item issue and not a customization request.
  • Make sure you have read through the documentation or any related video guides before asking support on how to accomplish a task.

12. Regular Updates

We’re always improving our skills and knowledge so we’re making changes regularly. From bug fixes to new awesome features, updates generally come at least twice a month. 

  V. 3.0.0 – 08.05.2025
  - Added: Home Page 2
  - Improved: Documentation

  V. 2.0.1 – 14.01.2025
  - Added: Home Page 1 - Dark version
  - Fixed: Google Fonts imported inside style
  - Improved: Documentation

  V. 1.0.0 – 12.07.2024
  - Initial release

13. Thanks

Once again thank you for purchasing one of our Templates.

Best Regards
Alissio