Project Introductionlink

Donacion is a static HTML website template designed for charitable organizations, providing complete pages for fundraising, events, volunteer recruitment, and more. The template includes 3 homepage styles and over a dozen pages such as blog, events, and donations, making it suitable for quickly building an official website for a public welfare organization. It is entirely based on HTML/CSS/JS and can be deployed without build tools.

Tech Stacklink

• HTML5 / CSS3 (single-file styles)
• Bootstrap 5 (layout and components)
• jQuery (interaction logic)
• Swiper (carousel/slider)
• MeanMenu (mobile navigation)

Project Structurelink

donacionhtml-10/
├── documentation/          # Official documentation
│   └── index.html
└── donacion/              # Template main body
    ├── index.html          # Homepage (3 styles: index, index-2, index-3)
    ├── about.html          # About Us
    ├── blog.html           # News list
    ├── blog-details.html   # News details
    ├── cause.html          # Charity projects
    ├── cause-details.html  # Project details
    ├── event.html          # Event list
    ├── event-details.html  # Event details
    ├── volunteer.html      # Volunteers
    ├── volunteer-details.html
    ├── donation.html       # Online donation
    ├── contact.html        # Contact
    ├── mission.html        # Mission
    ├── faq.html            # FAQ
    └── assets/
        ├── css/main.css    # All styles
        ├── js/main.js      # Interaction scripts
        └── mail.php        # Form backend

Key File Descriptionslink

• donacion/index.html — Main homepage entry file
• donacion/assets/css/main.css — All styles (includes 29 section comments)
• donacion/assets/js/main.js — Carousel, menu, form interaction animations
• donacion/assets/mail.php — Contact form backend processing
• donacion/contact.html — Contact page (form is here)
• donacion/donation.html — Donation entry page

Quick Startlink

1. Open donacion/index.html directly in a browser to preview;
2. Or upload the donacion folder to a server (e.g., public_html) and access it via domain name;
3. Modify the color variables in main.css to change the theme color.

Usage Suggestionslink

The template is purely static; form submission relies on mail.php, so ensure the server supports PHP during deployment. The mobile menu uses MeanMenu with a responsive breakpoint at 992px. When modifying styles, prioritize overriding the custom blocks at the end of main.css.