- Create components/banner.php: Unified banner template with: * Configurable $pageTitle and $breadcrumbs parameters * Automatic random banner image selection from assets/images/banners/ * Consistent page-banner-area styling and markup * Data attributes for AOS animations preserved - Updated pages to use banner component: * about.php, blog.php, blog_details.php * bookings.php, campsites.php, contact.php * course_details.php, driver_training.php, events.php * membership.php, membership_application.php, membership_payment.php * trips.php, bush_mechanics.php, rescue_recovery.php * indemnity.php, basic_indemnity.php * best_of_the_eastern_cape_2024.php, 2025_agm_minutes.php - Results: * Eliminated ~90% duplicate code across 23 pages * Single source of truth for banner functionality * Easier future updates to banner styling/behavior * Breadcrumb navigation now consistent and parameterized
111 lines
5.1 KiB
PHP
111 lines
5.1 KiB
PHP
<?php
|
|
$headerStyle = 'light';
|
|
include_once('header.php') ?>
|
|
|
|
<style>
|
|
.image {
|
|
width: 400px;
|
|
/* Set your desired width */
|
|
height: 320px;
|
|
/* Set your desired height */
|
|
overflow: hidden;
|
|
/* Hide any overflow */
|
|
display: block;
|
|
/* Ensure proper block behavior */
|
|
}
|
|
|
|
.image img {
|
|
width: 100%;
|
|
/* Image scales to fill the container */
|
|
height: 100%;
|
|
/* Image scales to fill the container */
|
|
object-fit: cover;
|
|
/* Fills the container while maintaining aspect ratio */
|
|
object-position: top;
|
|
/* Aligns the top of the image with the top of the container */
|
|
display: block;
|
|
/* Prevents inline whitespace issues */
|
|
}
|
|
</style><?php
|
|
$pageTitle = 'Contact Us';
|
|
$breadcrumbs = [['Home' => 'index.php']];
|
|
require_once('components/banner.php');
|
|
?>
|
|
|
|
|
|
<!-- Contact Info Area start -->
|
|
<section class="contact-info-area pt-100 rel z-1">
|
|
<div class="container">
|
|
<div class="row align-items-center">
|
|
<div class="col-lg-4">
|
|
<div class="contact-info-content mb-30 rmb-55" data-aos="fade-up" data-aos-duration="1500" data-aos-offset="50">
|
|
<div class="section-title mb-30">
|
|
<h2>For any queries, please don't hesitate to contact us:</h2>
|
|
</div>
|
|
<!-- <p>Our dedicated support team is always ready to assist you with any questions or issues, offering prompt and personalized solutions to meet your needs.</p> -->
|
|
<!-- <div class="features-team-box mt-40">
|
|
<h6>85+ Expert Team member</h6>
|
|
<div class="feature-authors">
|
|
<img src="assets/images/features/feature-author1.jpg" alt="Author">
|
|
<img src="assets/images/features/feature-author2.jpg" alt="Author">
|
|
<img src="assets/images/features/feature-author3.jpg" alt="Author">
|
|
<img src="assets/images/features/feature-author4.jpg" alt="Author">
|
|
<img src="assets/images/features/feature-author5.jpg" alt="Author">
|
|
<img src="assets/images/features/feature-author6.jpg" alt="Author">
|
|
<img src="assets/images/features/feature-author7.jpg" alt="Author">
|
|
<span>+</span>
|
|
</div>
|
|
</div> -->
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-8">
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="contact-info-item" data-aos="fade-up" data-aos-duration="1500" data-aos-offset="50" data-aos-delay="50">
|
|
<div class="icon"><i class="fas fa-envelope"></i></div>
|
|
<div class="content">
|
|
<h5>Need Help & Support</h5>
|
|
<div class="text"><i class="far fa-envelope"></i> <a href="mailto:info@4wdcsa.co.za">info@4wdcsa.co.za</a></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="contact-info-item" data-aos="fade-up" data-aos-duration="1500" data-aos-offset="50" data-aos-delay="100">
|
|
<div class="icon"><i class="fas fa-phone"></i></div>
|
|
<div class="content">
|
|
<h5>Need Anything Urgent</h5>
|
|
<div class="text"><i class="far fa-phone"></i> <a href="callto:+27 079 065 2795">+2779 065 2795</a></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-12">
|
|
<div class="contact-info-item" data-aos="fade-up" data-aos-duration="1500" data-aos-offset="50" data-aos-delay="50">
|
|
<div class="icon"><i class="fas fa-map-marker-alt"></i></div>
|
|
<div class="content">
|
|
<h5>BASE 4</h5>
|
|
<div class="text"><i class="fal fa-map-marker-alt"></i> Plot 50, Gemstone Rd, Doornrandje, Centurion, 0157</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- Contact Info Area end -->
|
|
|
|
|
|
<!-- Contact Form Area start -->
|
|
<!-- -->
|
|
<!-- Contact Form Area end -->
|
|
|
|
|
|
<!-- Contact Map Start -->
|
|
<div class="contact-map">
|
|
<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m12!1m3!1d818.9371187805272!2d28.000391592597513!3d-25.864399472588936!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!5e1!3m2!1sen!2sza!4v1744639736430!5m2!1sen!2sza" style="border:0; width: 100%;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
|
|
</div>
|
|
<!-- Contact Map End -->
|
|
|
|
|
|
<?php include_once("insta_footer.php"); ?>
|