Fallow

TailwindCSS Portfolio Template

Created : 15/04/2023
By :QuomodoTheme
Email : Support Email
Support Forum : Support

Thank you for purchasing Fallow - Tailwindcss Portfolio Template. If you have any questions that are beyond the scope of this help file, please feel free to email, via my user page contact form or put a ticket at Support Center .
Thank you so much!

Template Features

Responsive layout (desktops, tablets, mobile devices)
Tailwindcss 3.3.0
6 Different Home Page
3 Different Color Theme
40+ Inner Pages
Clean and Minimal design
Customizable Components
Clean & Well Commented Codes
Using Reusable Components
Responsive Navigation Menu
Portfolio, Portfolio Details, Contacts
Product Designer, Graphics Designer, Developer, Teacher, Photographer and Lawyer
Blog Grid, Blog Sidebar, Blog Details
FREE Lifetime Updates

HTML Structure

The html template uses Latest TailwindCSS V3.3.1 with valid HTML5 tags. This theme has a responsive layout with 4 column support. All of the information in content area is nested within a class and comes with predefined classes.

Basic Grid HTML

For a simple two column layout, create a .gird and .gird-cols* and add the appropriate number of .col-span* columns.

Given this example, we have .col-span-2 and .col-span-8, making for 12 total columns and a complete row.


    ...
    ...

How do you work with tailwindcss ?

step 1: Install dependencies with run this command:

 npm i or npm install

step 2: Then run command development:

 npm run dev

step 3: Change tailwindcss classes or add new style in

./root
|- index.html
|- index-designer.html
|- index-dev.html
|- index-teacher.html
|- index-lawyer.html
|- blog.html
|- blog-sidebar.html
|- blog-details.html
|- portfolio-grid.html
|- portfolio-details.html
|- input.css
|- more ..

Step 4: When your changes done and template ready for production then run command

npm run build

Fonts

Add your font in this folder . By default, the template loads this font from Google Web Font Services, you can change the font with the one that suits you best.

./root
|- input.css

                @import url("https://fonts.googleapis.com/css2?family=Work+Sans:wght@300;400;500;600;700;800;900&display=swap");

Jquery and javascript

This theme imports three types of Javascript files.

1. jQuery
2. Custom scripts (main.js)
3. Some jQuery Based Plugins

All the js included under

./roots
|- /assets
  |- /js
    |- /...
    |- /...
    |- /...
    |- /script.js

The vendor folder includes all thrid-party scripts like jQuery and jQuery Based Plugins

The version of jQuery included is

jQuery version v3.6.0

All of the plugin initailization and implementation is included inside

./roots
|- assets
  |- /js
    |- /script.js

You can change any of the plugin behavior or functionality from the file.

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

Tutorial

LOGO

Lets start updating the template. Open index.html file and follow the steps.

Most of the updates are same for all pages. So will explain once here.

Sources and Credits

Fonts Used int the template are google fonts, you can find theme on Google Fonts API

Fonts Used are :

Work Sans

Sliders Used Are :

Swiper slider(can be located in js folder)

Support

Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have any queries, please feel free to contact us at Support Center.

Email Us at : [email protected]

Custom Order

For any custom order (web ui design, app design, HTML template Development, WordPress Theme Development or WordPress Plugin Development) please contact us

Email Us at : [email protected]