Project Overview
Consulo is a Bootstrap 5 multi-page HTML template designed for enterprise clients and professional business services. It includes multiple complete pages such as Home, About Us, Blog, Services, Projects, Team, and Pricing. Built-in interactive features include a sticky navigation bar, scroll animations, and a responsive drawer menu, making it suitable as a base template for corporate websites or consulting company showcase sites.
Tech Stack
- Bootstrap 5 (responsive layout framework)
- Native HTML5 / CSS3 / JavaScript
- Custom Web Components (StickyHeader, ScrollTop, DrawerOpener)
- Google Fonts (Inter + Poppins)
- AOS (Animate On Scroll library)
Project Structure
consulohtml-10/Consulo HTML/
├── index.html # Home page entry
├── about.html # About Us
├── blog.html # Blog
├── blog-list.html # Blog list page
├── blog-details.html # Blog details
├── services.html # Services list
├── service-details.html # Service details
├── project.html # Project showcase
├── project-details.html # Project details
├── team.html # Team members
├── team-details.html # Member details
├── pricing-plan.html # Pricing plans
├── contact.html # Contact Us
├── faq.html # Frequently Asked Questions
├── error.html # Error page
├── privacy-policy.html # Privacy Policy
├── terms-condition.html # Terms & Conditions
└── assets/
├── css/ # Compiled stylesheets
├── scss/ # SCSS source files (customizable variables)
├── js/
│ ├── main.js # Core interaction logic
│ └── vendor.js # Third-party dependencies
└── img/ # Image assets
Core File Description
index.html— Home page template featuring Hero section and services showcaseassets/js/main.js— Implements Web Components for sticky navigation, scroll-to-top button, and drawer menuassets/css/style.css— Main stylesheet defining the complete design system variables (colors, fonts, spacing, etc.)assets/scss/— SCSS source directory for customizing the theme by modifying variablescontact.html— Contains contact form layout; form submission logic requires backend integrationassets/css/base.css— CSS base reset and utility classes
Quick Start
- Open
consulohtml-10/Consulo HTML/index.htmldirectly in a browser to preview all pages - To modify styles, it is recommended to recompile using SCSS source files:
- Install dependencies:
npm install - Compile SCSS:
npm run sass
- Install dependencies:
- The template uses Google Fonts CDN; no additional font installation is required
Usage Suggestions
This template is suitable for quickly building a corporate website. The page structure is complete but lacks backend logic; interactive features such as the contact form require custom backend integration. The template styles are centrally managed through CSS variables, allowing quick adjustments to brand colors and fonts by modifying the :root variables at the top of assets/css/style.css.
