alithemes

Multipurpos Digital Agency HTML Template

DOCUMENTATION

  • Doc version: 1.0.0
  • Created: 01 November 2023
  • Last update: 01 November 2023

OVERVIEW

Nivia stands as a sleek and contemporary HTML Bootstrap template, tailored to cater to the needs of SaaS, startup, and agency companies. This versatile template is an excellent choice for a wide array of businesses, including digital agencies, IT firms, CRM providers, marketing agencies, human resource software developers, project management teams, and collaboration tool creators, as well as any other startup or SaaS ventures.

Designed with meticulous care and a focus on responsiveness, Nivia presents a comprehensive and professional solution for your SaaS company's website requirements. It serves as the ideal foundation for crafting a cutting-edge website design tailored to the unique character of your technology and SaaS startup.

Key Highlights

Distinctive and Premium Design: Nivia is a testament to modern design principles and an exceptional user experience. Its clean, intuitive, and engaging interface ensures that your visitors can effortlessly explore your website. The template's responsive design guarantees a stunning appearance on any device, whether it's a desktop or a smartphone, ensuring an optimal user experience.

Customization and User-Friendliness: Nivia is built with Gulp, Pug, and Sass, making it a breeze to personalize. You can easily modify colors, typography, layout, and content to harmonize with your brand's style.

SEO-Focused: Nivia has search engine optimization (SEO) at its core. This ensures that your SaaS website is well-prepared for search engines to discover, index, and rank your content, enhancing your online visibility.

Optimized for Speed: Fast-loading web pages are crucial for retaining visitors and achieving high search engine rankings. Nivia is meticulously designed for performance optimization, ensuring swift page loading and delivering a seamless user experience.

Perfectly Responsive: In today's world, where over 50% of internet users access websites via smartphones or tablets, a responsive website is a necessity, not a luxury. Nivia's flawless responsive design ensures that users can explore your website regardless of their device.

Elegant Animations: Nivia includes enchanting interactions and appearance animations on all its pages and sections, leaving a lasting impression on your visitors as they navigate your website.

Always Up-to-Date: Nivia was crafted using the latest features and technologies, and it will receive regular updates to incorporate the most recent advancements in the future. This commitment to staying current ensures that your website remains at the forefront of technological innovation.

Moreover, our HTML solution provides a set of features designed to make your website more sustainable:

  • Gulp Module Bundler
  • PUG source files
  • SCSS source files
  • Figma Deign files
  • W3C valid coding
  • SEO-ready layout
  • Bunny fonts
  • Retina Ready
  • Pixel Perfect Design
  • Cross-browser support
  • Fully Responsive Layout
  • Well Documented
  • ...and many more...

We have a dedicated support center for all of your support needs. It includes our Documentation and Ticket system for any questions you have. We usually get back to you within 12-24 hours.

We are continuing to work hard to develop this item, more homepages and more great features will be added. You only need to buy 1 time and get lifetime updates.

What You Get

  1. All Gulp development
  2. HTML template (built from Gulp)
  3. Figma Design file (Only Desktop version)
  4. Documentation

Note

- All images are just used for Preview Purpose Only. They are not part of the template and maybe NOT included in the final purchase files.
- This is not a WordPress theme, It is a HTML5 template

Change log

                                    VERSION 1.0
                                    - First release.
                                 

STRUCTURE

Products Files Structure

When you run 'gulp' a directory named 'dist' will be created, which is the template directory compiled from Gulp, the directory structure is as follows:

  • /assets
    • /css
      • /plugins
      • /vendors
      • /style.css
      • style.css.map
    • /fonts
    • /uicons
      • /uicons-regular-rounded.eot
      • /uicons-regular-rounded.woff
      • /uicons-regular-rounded.woff2
    • /imgs
      • /page
      • /slider
      • /template
        • /icons
    • /js
      • /plugins
      • /vendor
      • /main.js
  • /index.html
  • /index-2.html
  • /index-3.html
  • /.........

Development Source Code

Gulp Development Files Structures

To develop, please run 'gulp', then 'gulp serve' a directory named 'dist' will be created, the development directory structure is as follows:

  • /src
    • /assets
      • /css
      • /fonts
      • /imgs
      • /js
      • /scss
    • /views
      • /components
      • /layouts
      • /mixins
      • /pages
      • /section
      • /index.pug
  • /.gitignore
  • /gulpfile.js
  • /package.json

HTML Structure

All information within the main content area is Niviaed within a body tag. The general template structure is pretty the same throughout the template. Here is the general structure of main page (index.html).

                                            
                                        

CSS Structure

These are the css files that are loaded into templates in Head Section.

                                            
                                        

Import Bunny fonts

                                            
                                        

Import third party CSS library

You can find this in: src/assets/scss/vendors/_vendors-import.scss

                                            
                                        

JS Structure

These are the list of Javascript files that are loaded into templates in end of the Body Section.

You can find this in: src/views/components/scripts.pug

                                            
                                        

Gulp Dependencies

package.json

                                            "devDependencies": {
                                                "browser-sync": "^2.27.10",
                                                "gulp": "^4.0.2",
                                                "gulp-autoprefixer": "^6.1.0",
                                                "gulp-clean": "^0.4.0",
                                                "gulp-concat": "^2.6.1",
                                                "gulp-pug": "^5.0.0",
                                                "gulp-sass": "^5.1.0",
                                                "sass": "^1.62.1"
                                              },
                                              "dependencies": {
                                                "gulp-cached": "^1.1.1"
                                              }
                                        

Technologies used

  • Pug/Jade https://pugjs.org (This is a template engine and is a fastest way to write HTML)
  • Sass http://sass-lang.com/ (This is a CSS preprocessor which is used to write styles)
  • Gulp 4 https://gulpjs.com (A module bundler to manager all the dependencies of your website)

Developing & Compiling

  • Start the `development server` of the project with `npm run build`, then `npm run dev`
  • run the command `yarn run build` and the production build is going to be generated in the `dist` folder.

UPDATE

Important Note:

- Backup your website and template folders completely to make sure you have a restore point in case of any complications.

Update using FTP

  1. Download the latest version of the template to your device.
  2. Connect to your hosting via FTP software
  3. Upload the template folder you unzipped to your site folder
  4. You should be asked to confirm overwriting of this folder and its contents. Confirm the overwrite.

SOURCES & CREDITS

THANK YOU

Thank you so much for using this template.

- AliThemes Team -