Tetonix Personal Documentation

1. Introduction

The Personal Theme is a fully responsive, modern, and customizable HTML template designed for individuals, freelancers, and professionals looking to build a strong online presence. It includes sections for showcasing portfolios, services, testimonials, about, blogs, skills, achievements, contact forms, and more.

1.1. What's Included

After purchasing wooprex template on wooprex.com with your Wooprex account, go to your Download page. You can choose to download wooprex template only or the entire wooprex template package which contains the following files:

Fully Responsive Design: Optimized for all devices.
Modern & Clean UI: Sleek, professional, and user-friendly design.
Easy Customization: Modify styles, fonts, and colors easily.
Cross-Browser Compatibility: Works on Chrome, Firefox, Safari, and Edge.

2.1. Folder Structure

Here you will find the folder structure of the entire template (HTML, CSS, JS, SASS, and etc).

2.2. HTML Architecture

The main contents are inside the 'body' tag divided into differentt section (i.e. header, banner, services,... footer etc.). The general template structure is the same throughout the template. Here is the general structure:

2.3. SASS & CSS Architecture

We are using SASS and the structure is given above already. Here is the outlook of the SASS file and these compiled to (styles.css) under assets/css/ folder

2.4. JavaScript Architecture

There is a file named "wooprex-script.js". The entire custom js has been written here. We used both vanila javaScript and JQuery plugin to customize. We also used so many libraries (Swiper, Gsap, CounterUp, Magnific Popup, SimpleParallax, and etc). The common structure is below: