Project Overviewlink

OpenCity is a responsive HTML5 website template designed for city/municipal government agencies. It includes four homepage variants and complete inner pages such as About, Blog, Services, Team, Events, and Contact. Built with the Bootstrap framework, the template supports modern browsers and is suitable for building government portals, city introductions, or public service websites.

Tech Stacklink

• Bootstrap 5.0.2 (responsive layout framework)
• jQuery (DOM manipulation and interaction)
• Owl Carousel (carousel component)
• AOS (scroll animations)
• Font Awesome / Flaticon (icons)
• Google Fonts (Poppins + Manjari fonts)

Project Structurelink

opencityhtml-10/OpenCity Pack/
├── Doc/                         # Template documentation
│   ├── index.html
│   ├── css/
│   │   ├── bootstrap.css
│   │   ├── font-awesome.css
│   │   ├── scrollbar.css
│   │   └── style.css
│   ├── fonts/
│   └── images/
└── OpenCity/                    # Main template directory
    ├── index.html               # Homepage main file
    ├── index-2/3/4.html          # Homepage variants
    ├── about.html               # About Us
    ├── blog.html                 # Blog list
    ├── contact.html              # Contact
    ├── services.html             # Services
    ├── team.html                 # Team members
    ├── event.html                # Events list
    ├── css/                      # All stylesheets
    │   ├── style.css             # Main stylesheet
    │   ├── bootstrap.css
    │   ├── responsive.css
    │   └── ...
    ├── js/                       # All scripts
    │   ├── main.js               # Core interaction logic
    │   ├── aos.js
    │   └── ...
    ├── fonts/
    └── images/

Key Files Descriptionlink

• OpenCity/index.html — Main homepage entry, includes top navigation, slideshow, core feature sections
• OpenCity/css/style.css — Main stylesheet defining the site-wide visual style and component styles
• OpenCity/js/main.js — Core interaction logic, includes preloader animation, navigation toggle, form validation, carousel initialization
• OpenCity/css/responsive.css — Multi-device responsive adaptation styles
• Doc/index.html — Official template documentation explaining HTML structure and customization methods

Quick Startlink

This is a pure static template with no dependencies to install. Simply open OpenCity/index.html in your browser to preview the full effect. To run with a local server:

# Using Python 3
python -m http.server 8080

# Or use the VS Code Live Server extension

Usage Suggestionslink

• The homepage offers four style variants (index.html ~ index-4.html), which can be selected or combined based on actual needs
• The template includes a contact form (#contact-form) that requires integration with a backend service or third-party form platform
• All image assets are located in the images/ directory; when replacing them, maintain the same paths or update references in CSS/HTML accordingly