Add IT services section and update navigation and contact options: Introduced a new IT-Dienstleistungen link in the header, added multiple IT service options in the contact form, and created a dedicated IT services section on the index page with detailed descriptions and call-to-action buttons. Enhanced CSS for better layout of service actions.

This commit is contained in:
𝓜𝓪𝓬𝓮™
2026-04-08 14:36:37 +02:00
parent 03f3648de1
commit df705701f0
5 changed files with 203 additions and 0 deletions

View File

@@ -10,3 +10,8 @@
color: var(--primary-color);
background: rgba(255, 81, 249, 0.08);
}
.it-services-actions {
justify-content: center;
margin-top: 2rem;
}

View File

@@ -134,6 +134,12 @@ includeHeader($page_title, $page_description, $current_page, $additional_scripts
<option value="vps-anfrage">Virtual Private Server</option>
<option value="mail-gateway-anfrage">Mail Gateway</option>
<option value="webhosting-anfrage">Webhosting</option>
<option value="it-beratung">IT-Beratung</option>
<option value="it-support">IT-Support & Fehlerbehebung</option>
<option value="netzwerk-wlan">Netzwerk & WLAN-Einrichtung</option>
<option value="it-sicherheit-backup">IT-Sicherheit & Backup</option>
<option value="webseiten-hosting-service">Webseiten- & Hosting-Service</option>
<option value="wartung-betreuung">Wartung & Betreuung</option>
<option value="support">Technischer Support</option>
<option value="beratung">Persönliche Beratung</option>
<option value="migration">Migration/Umzug</option>

View File

@@ -150,6 +150,48 @@ includeHeader($page_title, $page_description, $current_page);
</div>
</section>
<!-- IT Services Section -->
<section class="features">
<div class="container">
<div class="section-header">
<h2 class="section-title">IT-Dienstleistungen für Geschäftlich und Privat</h2>
<p class="section-description">
Ergänzend zu unseren Hosting-Angeboten unterstützen wir Sie mit persönlicher IT-Betreuung.
</p>
</div>
<div class="features-grid">
<div class="feature-item glass-card">
<h3>IT-Beratung</h3>
<p>Individuelle Beratung für sinnvolle und wirtschaftliche IT-Entscheidungen.</p>
</div>
<div class="feature-item glass-card">
<h3>Support & Fehlerbehebung</h3>
<p>Schnelle Hilfe bei technischen Problemen - remote oder bei Ihnen vor Ort.</p>
</div>
<div class="feature-item glass-card">
<h3>Netzwerk & WLAN-Einrichtung</h3>
<p>Stabile und sichere Netzwerke für Büro, Homeoffice und Zuhause.</p>
</div>
<div class="feature-item glass-card">
<h3>IT-Sicherheit & Backup</h3>
<p>Schutzkonzepte und Backup-Strategien für Ihre Daten und Systeme.</p>
</div>
<div class="feature-item glass-card">
<h3>Webseiten- & Hosting-Service</h3>
<p>Technische Betreuung Ihrer Webpräsenz von Einrichtung bis Optimierung.</p>
</div>
<div class="feature-item glass-card">
<h3>Wartung & Betreuung</h3>
<p>Regelmäßige Pflege und verlässliche Unterstützung im laufenden Betrieb.</p>
</div>
</div>
<div class="cta-actions it-services-actions">
<a href="/it-dienstleistungen" class="btn btn-primary">Mehr zu IT-Dienstleistungen</a>
<a href="/contact" class="btn btn-secondary">Jetzt Anfrage stellen</a>
</div>
</div>
</section>
<!-- Features Section -->
<section class="features">
<div class="container">

View File

@@ -0,0 +1,149 @@
<?php
require_once __DIR__ . '/../backend/includes/functions.php';
// Page configuration
$page_title = 'IT-Dienstleistungen - HexaHost.de | Geschäftlich & Privat';
$page_description = 'IT-Dienstleistungen von HexaHost.de für Unternehmen und Privatkunden: Beratung, Support, Netzwerk, Sicherheit, Webseiten und Wartung.';
$current_page = 'it-dienstleistungen';
// Include header
includeHeader($page_title, $page_description, $current_page);
?>
<main id="main-content">
<!-- Services Hero -->
<section class="about-hero">
<div class="container">
<div class="about-hero-content">
<?php
generateBreadcrumbs([
['title' => 'Home', 'url' => 'index.php'],
['title' => 'IT-Dienstleistungen', 'url' => '']
]);
?>
<h1 class="about-hero-title">
IT-Dienstleistungen für <span class="highlight">Unternehmen und Privatkunden</span>
</h1>
<p class="about-hero-description">
Sie erhalten persönliche IT-Unterstützung aus einer Hand: von der Beratung bis zur laufenden Betreuung.
Alle Leistungen werden individuell auf Ihre Anforderungen abgestimmt und transparent angeboten.
</p>
</div>
</div>
</section>
<!-- Target Groups -->
<section class="values">
<div class="container">
<div class="section-header">
<h2 class="section-title">Für wen sind die Leistungen geeignet?</h2>
<p class="section-description">
Maßgeschneiderte IT-Unterstützung für geschäftliche und private Anforderungen
</p>
</div>
<div class="values-grid">
<article class="value-item glass-card">
<h3>Geschäftlich</h3>
<p>
Für Unternehmen, Selbstständige und Teams, die eine zuverlässige IT-Basis benötigen:
strukturierte Beratung, stabile Systeme und planbare Betreuung.
</p>
</article>
<article class="value-item glass-card">
<h3>Privat</h3>
<p>
Für Privatpersonen und Familien, die schnelle Hilfe bei IT-Problemen, sichere Heimnetzwerke
und verständliche Unterstützung im Alltag wünschen.
</p>
</article>
</div>
</div>
</section>
<!-- Services Grid -->
<section class="products">
<div class="container">
<div class="section-header">
<h2 class="section-title">Unsere IT-Dienstleistungen im Überblick</h2>
<p class="section-description">
Keine Pauschalpreise: Sie erhalten ein individuelles Angebot passend zu Ihrem Bedarf.
</p>
</div>
<div class="products-grid">
<article class="product-card glass-card">
<h3>IT-Beratung</h3>
<p>Strategische und praxisnahe Beratung für Ihre IT-Entscheidungen.</p>
<ul class="product-features">
<li>Ist-Analyse und Zieldefinition</li>
<li>Empfehlungen für Hard- und Software</li>
<li>Roadmap für sichere Umsetzung</li>
</ul>
</article>
<article class="product-card glass-card">
<h3>Support & Fehlerbehebung</h3>
<p>Schnelle Hilfe bei technischen Problemen - remote oder bei Ihnen vor Ort.</p>
<ul class="product-features">
<li>Akute Störungen beheben</li>
<li>Systeme stabilisieren</li>
<li>Nachhaltige Lösungsansätze</li>
</ul>
</article>
<article class="product-card glass-card">
<h3>Netzwerk & WLAN-Einrichtung</h3>
<p>Leistungsfähige und sichere Netzwerkstrukturen für Büro oder Zuhause.</p>
<ul class="product-features">
<li>Router-, Switch- und WLAN-Setup</li>
<li>Optimierung von Reichweite und Performance</li>
<li>Segmentierung und Zugriffsregeln</li>
</ul>
</article>
<article class="product-card glass-card">
<h3>IT-Sicherheit & Backup</h3>
<p>Schutz Ihrer Daten durch sinnvolle Sicherheits- und Backup-Konzepte.</p>
<ul class="product-features">
<li>Sicherheitsprüfung bestehender Systeme</li>
<li>Backup-Strategie mit Wiederherstellungstest</li>
<li>Absicherung von Endgeräten und Zugriffen</li>
</ul>
</article>
<article class="product-card glass-card">
<h3>Webseiten- & Hosting-Service</h3>
<p>Unterstützung rund um Betrieb, Pflege und Optimierung Ihrer Webpräsenz.</p>
<ul class="product-features">
<li>Einrichtung und Migration</li>
<li>Technische Wartung und Updates</li>
<li>Performance- und Sicherheitsoptimierung</li>
</ul>
</article>
<article class="product-card glass-card">
<h3>Wartung & Betreuung</h3>
<p>Kontinuierliche IT-Begleitung für stabile Systeme und weniger Ausfälle.</p>
<ul class="product-features">
<li>Regelmäßige Systempflege</li>
<li>Proaktive Überprüfung kritischer Punkte</li>
<li>Planbare Unterstützung im Alltag</li>
</ul>
</article>
</div>
</div>
</section>
<!-- CTA -->
<section class="cta">
<div class="container">
<div class="cta-content glass-card">
<h2>Sie möchten Ihre IT professionell aufstellen?</h2>
<p>Stellen Sie jetzt eine unverbindliche Anfrage - ich melde mich zeitnah bei Ihnen.</p>
<div class="cta-actions">
<a href="/contact" class="btn btn-primary">Unverbindliche Anfrage</a>
<a href="/contact" class="btn btn-secondary">Beratung anfragen</a>
</div>
</div>
</div>
</section>
</main>
<?php
// Include footer
includeFooter();
?>