diff --git a/README.md b/README.md index e018f4f..b1df839 100644 --- a/README.md +++ b/README.md @@ -1,16 +1,18 @@ # Kobelly Web Solutions -A professional Flask-based website for promoting small business web development services. Features multilanguage support (English, Dutch, French, German) and is fully dockerized for easy deployment. +A professional Flask-based website for promoting small business web development services. Features multilanguage support (English, Dutch, French, German) with a simple JSON-based translation system and is fully dockerized for easy deployment. ## Features -- π **Multilanguage Support**: English (EN), Dutch (NL), French (FR), German (DE) +- π **Multilanguage Support**: English (EN), Dutch (NL), French (FR), German (DE) with JSON-based translations - π± **Responsive Design**: Modern, mobile-friendly interface - π¨ **Professional UI**: Clean, modern design with Bootstrap 5 - π³ **Docker Support**: Easy containerization and deployment - β‘ **Fast Performance**: Optimized for speed and performance with minified assets - π§ **No Database Required**: Simple, lightweight setup - π **Asset Optimization**: CSS/JS minification with cache busting +- π§ **Contact Form**: Fully functional email contact form +- πΊοΈ **SEO Optimized**: Sitemap generation and robots.txt ## Pages @@ -18,6 +20,7 @@ A professional Flask-based website for promoting small business web development - **Services**: Detailed service offerings with pricing information - **About**: Company story, team, and values - **Contact**: Contact form and business information +- **Portfolio**: Showcase of completed projects ## Quick Start @@ -105,9 +108,12 @@ Kobelly/ βββ requirements.txt # Python dependencies βββ Dockerfile # Docker configuration βββ docker-compose.yml # Docker Compose configuration +βββ docker-compose.dev.yml # Development Docker Compose βββ Makefile # Build and deployment commands βββ build_assets.py # Asset minification script -βββ babel.cfg # Babel configuration for translations +βββ translation_manager.py # JSON-based translation system +βββ test_translations.py # Translation testing script +βββ robots.txt # Search engine configuration βββ static/ # Static assets β βββ css/ # CSS files β β βββ main.css # Main stylesheet @@ -121,31 +127,67 @@ Kobelly/ β βββ index.html # Homepage β βββ services.html # Services page β βββ about.html # About page -β βββ contact.html # Contact page -βββ translations/ # Translation files - βββ en/LC_MESSAGES/messages.po - βββ nl/LC_MESSAGES/messages.po - βββ fr/LC_MESSAGES/messages.po - βββ de/LC_MESSAGES/messages.po +β βββ contact.html # Contact page +β βββ portfolio.html # Portfolio page +β βββ components/ # Reusable template components +β βββ hero_section.html +β βββ cta_section.html +β βββ stats_section.html +β βββ testimonials_section.html +βββ translations/ # JSON translation files + βββ en.json # English translations + βββ nl.json # Dutch translations + βββ fr.json # French translations + βββ de.json # German translations ``` ## Multilanguage Support -The website supports four languages: +The website supports four languages using a simple JSON-based translation system: - πΊπΈ **English** (EN) - Default - π³π± **Dutch** (NL) - π«π· **French** (FR) - π©πͺ **German** (DE) -Users can switch languages using the language selector in the navigation bar. The language preference is stored in the session. +Users can switch languages using the language selector in the navigation bar or URL parameters (`?lang=de`). The language preference is stored in the session. + +### Translation System + +The project uses a custom JSON-based translation system that: +- **No compilation needed** - Just edit JSON files directly +- **Real-time updates** - Changes appear immediately after restart +- **Simple maintenance** - Clear JSON structure +- **Independent languages** - Edit English without breaking translations + +### Adding New Translations + +1. **Add the string to your template:** + ```html +