Getting Started

🙏 Thank you for purchasing 🙏
Fizmo - Landing Page Templates

Introduction

Thank you for purchasing the Fizmo! We’re pleased you found what you were looking for. Our goal is to ensure you're always satisfied with your purchase. We hope you will easily create an outstanding website using our template.

Before proceeding with the template installation, we recommend following the steps listed in this guide. We have included all the necessary information, guidelines, and details you will need to use the Fizmo template effectively.

If you can't find the answer you're looking for, we encourage you to reach out to us through our support portal. Please generate a ticket through our support portal, and you will hear back from us very soon.

Directory Structure

Extract the zip file you received after purchase and you would find the exact below files and folders:

├── html
    ├── src directory
        ├── assets
            ├── fonts
            ├── images
            ├── js
            └── scss
                ├── _custom-variable.scss
                ├── app.scss
                ├── bootstrap.scss
                ├── custom.scss
                └── icons.scss
        ├── partials
            ├── body.html
            ├── head-css.html
            ├── main.html
            ├── title-meta.html
            └── vendor-scripts.html
        └── all html pages
        └── contact.php
    ├── gulpfile.js
    ├── package.json
    └── yarn.lock
For Developers

You can boost your development with Fizmo on:

  • Bootstrap
  • Gulp
  • Yarn
  • SASS
Browser Compatibility
  • Chrome (Windows, Mac, Linux)
  • Firefox (Windows, Mac, Linux)
  • Safari (Mac)
  • Microsoft Edge
  • And other WebKit browsers

Setup

We are using gulp which allows to have complete automatation for build flow. In case if you don't know - Gulp is a toolkit for automating painful or time-consuming tasks in development workflow, so you can stop messing around and build something. You can read it more about it here.

Prerequisites

Please follow below steps to install and setup all prerequisites:

  • Nodejs

    Make sure to have Node.js installed & running on your computer. If you already have installed Node on your computer, you can skip this step if your existing node version is greater than 18. We suggest you to use LTS version of Node.js.

  • Yarn

    Make sure to have the Yarn installed & running on your computer. If you already have installed Yarn on your computer, you can skip this step. We suggest you use Yarn instead of NPM.

  • Gulp

    Make sure to have the Gulp installed & running on your computer. If you already have installed gulp on run command npm install -g gulp from your terminal.

  • Git

    Make sure to have Git installed globally & running on your computer. If you already have installed git on your computer, you can skip this step.

Installation

After you finished with the above steps, you can run the following commands into the terminal/command prompt from the root directory of the project to run the project locally or build for production use:

To setup Template, follow below mentioned steps:

  • Install Prerequisites

    Make sure to have all above prerequisites installed & running in your computer

After you finished with above steps, you can run the following commands to run project locally or build for production use:

Command Description
yarn install This would install all the required dependencies in the node_modules folder.
gulp Runs the project locally, starts the development server and watches for any changes in your code, including your HTML, javascript, sass, etc. The development server is accessible at http://localhost:3000.
gulp build Generates a /dist directory with all the production files.
SCSS: We suggest you do not change any scss files from the assets/scss/custom folders because getting new updates will break your SCSS changes if any you have made. We strongly suggest you use a custom.scss file and use that instead of overwriting any template's custom scss files.

Light Mode

To have Light mode enabled, Keep your html element with data attribute data-bs-theme="light".
E.g. <html data-bs-theme="light"> to have Dark layout.

Dark Mode

To have Dark mode enabled, Keep your html element with data attribute data-bs-theme="dark".
E.g. <html data-bs-theme="dark"> to have Dark layout.

RTL Mode

To have RTL mode enabled, replace the reference of bootstrap-rtl.min.css, app-rtl.min.css and in the <html dir="rtl">. Because it will set to default the LTR version.

📦 Credits / Plugins

We extend our heartfelt gratitude to the ingenious creators behind the exceptional products and plugins that serve as alternatives in the Fizmo project.

Plugins Url
Bootstrap http://getbootstrap.com/
Bootstrap Validator https://github.com/1000hz/bootstrap-validator
imagesLoaded https://imagesloaded.desandro.com/
Isotope Layout https://isotope.metafizzy.co/
Isotope Layout https://isotope.metafizzy.co/
jQuery https://jquery.com/
jQuery Backstretch https://github.com/jquery-backstretch/jquery-backstretch
Parallax.js https://github.com/pixelcog/parallax.js/
jquery.mb.YTPlayer https://github.com/pupunzi/jquery.mb.YTPlayer
Simple Text Rotator https://github.com/peachananr/simple-text-rotator
Magnific Popup https://dimsemenov.com/plugins/magnific-popup/
Owl Carousel https://owlcarousel2.github.io/OwlCarousel2/
Particles JS https://github.com/VincentGarreau/particles.js
Remix Icon https://remixicon.com/
Typed JS https://github.com/mattboldt/typed.js

Support

Once again thank you for your purchase. We'll be happy to answer the the questions you have related to the template. In case if you have any suggestion or feature, request please feel free to contact us, We'll try to implement it and will release as part of future updates.

Thanks for purchasing template and for supporting our work. If we fail here in this documentation, please e-mail us imbulltheme@gmail.com. If you have a spare time, please go and rate my template. We will appreciate that.

Stay Awesome!

- BullTheme

Changelog

v1.0.0 - 10 October 2024

  • Initial released