Files Structure & Setup

Follow the steps below to get started with your Site Template:

1. Open the template-files Folder to find all the Templates Files
2. You will need to Upload these files and folders on your Web Server to use it on your Website.
3. Make sure you upload the required files/folders listed below:
   • template-files/source/fonts - Directory of Local Fonts Files
   • template-files/source/images - Directory of Images files
   • template-files/source/plugins - Directory of Plugins
   • template-files/source/scripts - Directory of JavaScripts files
   • template-files/source/styles - Directory of Main Stylesheet Files
   • template-files/*.html - Html Files

Installation

Checkout Official TailwindCSS Documentation if you need.

---

System Requirements

• Node.js 16.8.0 or later
• MacOS, Windows (including WSL), and Linux are supported

---

Install dependencies in your project:

Nevigate to `template-files/` then open terminal and install dependencies by running

    npm install
    # or
    yarn  # if you have Yarn installed

---

Run `npm run dev` or `yarn dev`

to start development server in your local machine

    npm run dev
    # or
    yarn dev  # if you have Yarn installed

Now you can use LiveServer in your VSCode
or directly open your HTML file in your browser to see preview.

Html Structure

Favicon Changing

Logo Changing

Update the image src or replace the image from `source/images/` directory

Banner content

Footer Information

Update footer links and social links.

Contact form Update

Update contact email at main.js file.

CSS Files & Structure

CSS Files

Changing Font

This template uses total 2 fonts 'Outfit' Font family from the Google Fonts Library and 'Melodrama' As local font. To change the Font, you will need to Edit the root variable in 'base.css' file.

Javascript Files & Structure

Javascript Files

Sources & Credits

I've used the following images, icons or other files as listed.

• TailwindCSS
• Google Fonts
• unsplash(Photos)