192 lines
9.8 KiB
HTML
192 lines
9.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="{{ get_current_language() }}">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
<!-- SEO Meta Tags -->
|
|
<title>{% block title %}{{ t('Kobelly Web Solutions') }}{% endblock %}</title>
|
|
<meta name="description" content="{% block description %}{{ t('Professional website design for small businesses in Belgium. Fast, affordable websites that help you get found online.') }}{% endblock %}">
|
|
<meta name="keywords" content="{% block keywords %}{{ t('website design, web development, small business, Belgium, Brussels, professional websites, affordable web design') }}{% endblock %}">
|
|
<meta name="author" content="Kobe Amerijckx">
|
|
<meta name="robots" content="index, follow">
|
|
|
|
<!-- Open Graph Meta Tags -->
|
|
<meta property="og:title" content="{% block og_title %}{{ t('Kobelly Web Solutions') }}{% endblock %}">
|
|
<meta property="og:description" content="{% block og_description %}{{ t('Professional website design for small businesses in Belgium. Fast, affordable websites that help you get found online.') }}{% endblock %}">
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:url" content="{{ request.url }}">
|
|
<meta property="og:image" content="{{ url_for('static', filename='images/og-image.jpg', _external=True) }}">
|
|
<meta property="og:site_name" content="Kobelly Web Solutions">
|
|
<meta property="og:locale" content="{{ get_current_language() }}">
|
|
|
|
<!-- Twitter Card Meta Tags -->
|
|
<meta name="twitter:card" content="summary_large_image">
|
|
<meta name="twitter:title" content="{% block twitter_title %}{{ t('Kobelly Web Solutions') }}{% endblock %}">
|
|
<meta name="twitter:description" content="{% block twitter_description %}{{ t('Professional website design for small businesses in Belgium. Fast, affordable websites that help you get found online.') }}{% endblock %}">
|
|
<meta name="twitter:image" content="{{ url_for('static', filename='images/og-image.jpg', _external=True) }}">
|
|
<meta name="twitter:creator" content="@kobelly">
|
|
|
|
<!-- Canonical URL -->
|
|
<link rel="canonical" href="{{ request.url }}">
|
|
|
|
<!-- Favicon -->
|
|
<link rel="icon" type="image/x-icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
|
|
|
|
<!-- Stylesheets -->
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
|
|
<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}">
|
|
|
|
<!-- Structured Data (JSON-LD) -->
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "LocalBusiness",
|
|
"name": "Kobelly Web Solutions",
|
|
"description": "{{ t('Professional website design for small businesses in Belgium. Fast, affordable websites that help you get found online.') }}",
|
|
"url": "{{ request.url_root }}",
|
|
"telephone": "+32 486 21 07 07",
|
|
"email": "info@kobelly.com",
|
|
"address": {
|
|
"@type": "PostalAddress",
|
|
"streetAddress": "Blijkheerstraat 92",
|
|
"addressLocality": "Pajottegem",
|
|
"addressCountry": "BE",
|
|
"addressRegion": "Vlaams-Brabant",
|
|
"postalCode": "1755"
|
|
},
|
|
"geo": {
|
|
"@type": "GeoCoordinates",
|
|
"latitude": "50.8503",
|
|
"longitude": "4.3517"
|
|
},
|
|
"openingHours": "Mo-Fr 09:00-18:00",
|
|
"priceRange": "€€",
|
|
"currenciesAccepted": "EUR",
|
|
"paymentAccepted": "Cash, Credit Card, Bank Transfer",
|
|
"areaServed": ["Belgium", "Europe"],
|
|
"serviceType": ["Website Design", "Web Development", "E-commerce Solutions"],
|
|
"founder": {
|
|
"@type": "Person",
|
|
"name": "Kobe Amerijckx",
|
|
"jobTitle": "Web Developer",
|
|
"description": "Professional web developer specializing in small business websites"
|
|
},
|
|
"sameAs": [
|
|
"https://www.linkedin.com/company/kobelly",
|
|
"https://www.facebook.com/kobelly",
|
|
"https://twitter.com/kobelly"
|
|
]
|
|
}
|
|
</script>
|
|
|
|
{# Import components macros #}
|
|
{% import 'components/cta_section.html' as components %}
|
|
{% import 'components/testimonials_section.html' as testimonials %}
|
|
{% import 'components/hero_section.html' as hero %}
|
|
{% import 'components/stats_section.html' as stats %}
|
|
</head>
|
|
<body>
|
|
<!-- Navigation -->
|
|
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
|
|
<div class="container">
|
|
<a class="navbar-brand" href="{{ url_for('index') }}">
|
|
<i class="fas fa-code me-2"></i>{{ t('Kobelly') }}
|
|
</a>
|
|
<div class="d-flex ms-auto align-items-center flex-row">
|
|
<!-- Dark/Light Mode Toggle: Always visible in navbar -->
|
|
<button class="btn-toggle-dark d-lg-none me-2" id="theme-toggle" title="Toggle light/dark mode">
|
|
<i class="fas fa-moon" id="theme-icon"></i>
|
|
</button>
|
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
</div>
|
|
<div class="collapse navbar-collapse" id="navbarNav">
|
|
<ul class="navbar-nav me-auto">
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ url_for('index') }}">{{ t('Home') }}</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ url_for('services') }}">{{ t('Services') }}</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ url_for('about') }}">{{ t('About') }}</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ url_for('portfolio') }}">{{ t('Portfolio') }}</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ url_for('contact') }}">{{ t('Contact') }}</a>
|
|
</li>
|
|
</ul>
|
|
<!-- Language Selector -->
|
|
<div class="language-selector me-2">
|
|
<button class="btn btn-outline-light dropdown-toggle" type="button" data-bs-toggle="dropdown">
|
|
<i class="fas fa-globe me-1"></i>
|
|
{% if get_current_language() == 'en' %}English
|
|
{% elif get_current_language() == 'de' %}Deutsch
|
|
{% elif get_current_language() == 'fr' %}Français
|
|
{% elif get_current_language() == 'nl' %}Nederlands
|
|
{% else %}🇬🇧 English{% endif %}
|
|
</button>
|
|
<ul class="dropdown-menu language-dropdown">
|
|
<li><a class="dropdown-item" href="{{ url_for('set_language_route', language='en') }}">🇬🇧 English</a></li>
|
|
<li><a class="dropdown-item" href="{{ url_for('set_language_route', language='nl') }}">🇳🇱 Nederlands</a></li>
|
|
<li><a class="dropdown-item" href="{{ url_for('set_language_route', language='fr') }}">🇫🇷 Français</a></li>
|
|
<li><a class="dropdown-item" href="{{ url_for('set_language_route', language='de') }}">🇩🇪 Deutsch</a></li>
|
|
</ul>
|
|
</div>
|
|
<!-- Dark/Light Mode Toggle: visible on desktop only -->
|
|
<div class="d-none d-lg-block">
|
|
<button class="btn-toggle-dark ms-2" id="theme-toggle-desktop" title="Toggle light/dark mode">
|
|
<i class="fas fa-moon" id="theme-icon-desktop"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Main Content -->
|
|
<main>
|
|
{% block content %}{% endblock %}
|
|
</main>
|
|
|
|
<!-- Footer -->
|
|
<footer class="footer">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-4">
|
|
<h5>{{ t('Kobelly Web Solutions') }}</h5>
|
|
<p>{{ t('Creating professional websites for small businesses and entrepreneurs.') }}</p>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<h5>{{ t('Services') }}</h5>
|
|
<ul class="list-unstyled">
|
|
<li>{{ t('Website Design') }}</li>
|
|
<li>{{ t('E-commerce Solutions') }}</li>
|
|
<li>{{ t('Maintenance & Support') }}</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<h5>{{ t('Contact') }}</h5>
|
|
<p>
|
|
<i class="fas fa-envelope me-2"></i><a href="mailto:info@kobelly.com" class="text-decoration-none">{{ t('info@kobelly.com') }}</a><br>
|
|
<i class="fas fa-phone me-2"></i><a href="tel:+32486210707" class="text-decoration-none">{{ t('+32 486 21 07 07') }}</a><br>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<hr class="my-4">
|
|
<div class="text-center">
|
|
<p>© {{ current_year }} {{ t('Kobelly Web Solutions. All rights reserved.') }}</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
|
|
<script src="{{ url_for('static', filename='js/main.js') }}"></script>
|
|
</body>
|
|
</html> |