Project Overviewlink

Residem is a set of static website templates designed for single-property/apartment scenarios, featuring multiple pages including homepage, room showcase, facility introduction, news updates, contact form, and booking functionality. Built on the Bootstrap framework, the template provides a complete responsive layout and interactive components, suitable for hotels, B&Bs, or long-term rental apartments to quickly build a showcase website.

Tech Stacklink

• Bootstrap 5 — Responsive layout framework
• Swiper.js — Carousel/slideshow component
• Google Fonts — Jost (heading font), DM Sans (body font)
• Font Awesome 4/6 + Elegant Icons — Icon libraries
• PHP — Used only for booking.php form processing

Project Structurelink

residemhtml-10/Residem/Residem HTML/
├── index.html                    # Main homepage
├── 01_single-property-2.html      # Single property homepage variant
├── 02_apartment-*.html           # Apartment interior pages collection
├── 03_apartment-rent-onepage.html
├── booking.php                   # Booking form processing
├── css/
│   ├── bootstrap.min.css         # Bootstrap core
│   ├── style.css                 # Main stylesheet (with complete variable system)
│   ├── coloring.css              # Color scheme
│   └── swiper*.css               # Carousel component styles
├── js/
│   ├── designesia.js             # Main interaction script
│   ├── custom-swiper-*.js        # Carousel configuration
│   └── validation-*.js           # Form validation
├── images/
└── video/

Core File Descriptionlink

• index.html — Main homepage, includes navigation, carousel, property introduction, and complete first-screen structure
• css/style.css — Main stylesheet, defines a complete CSS variable system (fonts, colors, spacing, buttons, etc.)
• js/designesia.js — Core template interaction logic (navigation, scroll effects, theme switching, etc.)
• js/custom-swiper-1.js — Fade transition carousel configuration, 4-second auto-play
• js/custom-swiper-2.js — Slide transition carousel configuration with pagination navigation
• booking.php — Booking form backend processing file

Quick Startlink

Since this is a pure static template, simply open index.html directly in your browser to preview the full effect. For booking functionality, deploy the project to a PHP-supported web server (e.g., Apache/Nginx + PHP environment) and access booking.php.

Usage Suggestionslink

The template provides multiple homepage and interior page variants. Choose the corresponding HTML file as a starting point based on your actual property type. When replacing the logo and color scheme, primarily modify the image files in the images/ directory and the color variables in css/coloring.css.