274 lines
10 KiB
PHP
274 lines
10 KiB
PHP
<?php
|
|
/**
|
|
* The template for displaying the footer
|
|
*/
|
|
?>
|
|
</div><!-- .main-content -->
|
|
|
|
<!-- Footer -->
|
|
<footer class="footer">
|
|
<div class="container">
|
|
<div class="footer-content">
|
|
<div class="footer-left">
|
|
<div class="footer-logo">
|
|
<img src="<?php echo esc_url(get_theme_mod('footer_logo', get_theme_file_uri('images/logo-footer.png'))); ?>" alt="<?php bloginfo('name'); ?>">
|
|
</div>
|
|
<p class="footer-description">
|
|
<?php echo wp_kses_post(get_theme_mod('footer_description', 'We\'re a travel agency and tour operator for holidays, activities, and other unforgettable experiences in every corner of the Europe, and for every sort of traveler.')); ?>
|
|
</p>
|
|
</div>
|
|
<div class="footer-right">
|
|
<div class="footer-contact">
|
|
<a href="mailto:<?php echo esc_attr(get_theme_mod('footer_email', 'info@europewonder.com')); ?>">
|
|
<i class="far fa-envelope"></i>
|
|
<?php echo esc_html(get_theme_mod('footer_email', 'info@europewonder.com')); ?>
|
|
</a>
|
|
<a href="tel:<?php echo esc_attr(str_replace(' ', '', get_theme_mod('footer_phone', '+386 (0) 31 332 823'))); ?>">
|
|
<i class="fas fa-phone"></i>
|
|
<?php echo esc_html(get_theme_mod('footer_phone', '+386 (0) 31 332 823')); ?>
|
|
</a>
|
|
<a href="https://wa.me/<?php echo esc_attr(get_theme_mod('footer_whatsapp', '38631332823')); ?>">
|
|
<i class="fab fa-whatsapp"></i>
|
|
WhatsApp chat
|
|
</a>
|
|
<a href="#" class="book-consultation" id="open-calendly">
|
|
<i class="far fa-calendar-check"></i>
|
|
Book a Free Consultation
|
|
</a>
|
|
</div>
|
|
<div class="footer-links">
|
|
<a href="<?php echo esc_url(home_url('/terms-of-service')); ?>">Terms of Service</a>
|
|
<a href="<?php echo esc_url(home_url('/privacy-policy')); ?>">Privacy Policy</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- Menu Overlay -->
|
|
<div class="menu-overlay"></div>
|
|
|
|
<!-- Calendly Modal -->
|
|
<div id="calendly-modal" class="calendly-modal">
|
|
<div class="calendly-modal-content">
|
|
<span class="calendly-close">×</span>
|
|
<div class="calendly-container" id="calendly-container"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Calendly CSS -->
|
|
<style>
|
|
.calendly-modal {
|
|
display: none;
|
|
position: fixed;
|
|
z-index: 9999;
|
|
left: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: auto;
|
|
background-color: rgba(0,0,0,0.7);
|
|
opacity: 0;
|
|
transition: opacity 0.3s ease;
|
|
}
|
|
|
|
.calendly-modal.active {
|
|
display: block;
|
|
opacity: 1;
|
|
}
|
|
|
|
.calendly-modal-content {
|
|
position: relative;
|
|
background-color: #fefefe;
|
|
margin: 5% auto;
|
|
padding: 0;
|
|
width: 90%;
|
|
max-width: 800px;
|
|
height: 85vh;
|
|
border-radius: 8px;
|
|
box-shadow: 0 4px 20px rgba(0,0,0,0.2);
|
|
transform: translateY(-20px);
|
|
transition: transform 0.3s ease;
|
|
}
|
|
|
|
.calendly-modal.active .calendly-modal-content {
|
|
transform: translateY(0);
|
|
}
|
|
|
|
.calendly-container {
|
|
height: calc(100% - 40px);
|
|
width: 100%;
|
|
overflow: hidden;
|
|
border-radius: 0 0 8px 8px;
|
|
}
|
|
|
|
.calendly-close {
|
|
position: absolute;
|
|
right: 15px;
|
|
top: 10px;
|
|
color: #333;
|
|
font-size: 28px;
|
|
font-weight: bold;
|
|
cursor: pointer;
|
|
z-index: 10;
|
|
}
|
|
|
|
.calendly-close:hover {
|
|
color: var(--accent);
|
|
}
|
|
|
|
body.calendly-open {
|
|
overflow: hidden;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.calendly-modal-content {
|
|
width: 95%;
|
|
margin: 10% auto;
|
|
height: 80vh;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<!-- Mobile Menu JavaScript -->
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const mainNav = document.querySelector('.main-nav');
|
|
const menuOverlay = document.querySelector('.menu-overlay');
|
|
|
|
// Toggle menu when hamburger icon is clicked
|
|
menuToggle?.addEventListener('click', function() {
|
|
mainNav.classList.toggle('active');
|
|
menuOverlay.classList.toggle('active');
|
|
document.body.classList.toggle('menu-open');
|
|
});
|
|
|
|
// Close menu when overlay is clicked
|
|
menuOverlay?.addEventListener('click', function() {
|
|
mainNav.classList.remove('active');
|
|
menuOverlay.classList.remove('active');
|
|
document.body.classList.remove('menu-open');
|
|
});
|
|
|
|
// Close menu when escape key is pressed
|
|
document.addEventListener('keydown', function(e) {
|
|
if (e.key === 'Escape' && mainNav.classList.contains('active')) {
|
|
mainNav.classList.remove('active');
|
|
menuOverlay.classList.remove('active');
|
|
document.body.classList.remove('menu-open');
|
|
}
|
|
|
|
// Zapri tudi calendly modal ob pritisku ESC
|
|
if (e.key === 'Escape' && document.getElementById('calendly-modal').classList.contains('active')) {
|
|
closeCalendlyModal();
|
|
}
|
|
});
|
|
|
|
// Add dropdown functionality for submenus on mobile
|
|
const hasChildrenItems = document.querySelectorAll('.menu-item-has-children');
|
|
|
|
hasChildrenItems.forEach(function(item) {
|
|
// Create dropdown toggle button
|
|
const dropdownToggle = document.createElement('span');
|
|
dropdownToggle.className = 'dropdown-toggle';
|
|
dropdownToggle.innerHTML = '<i class="fas fa-chevron-down"></i>';
|
|
|
|
// Add toggle button after the link
|
|
item.querySelector('a').after(dropdownToggle);
|
|
|
|
// Toggle submenu on click
|
|
dropdownToggle.addEventListener('click', function(e) {
|
|
e.preventDefault();
|
|
this.classList.toggle('active');
|
|
const submenu = this.nextElementSibling;
|
|
if (submenu && submenu.classList.contains('sub-menu')) {
|
|
if (submenu.style.maxHeight) {
|
|
submenu.style.maxHeight = null;
|
|
} else {
|
|
submenu.style.maxHeight = submenu.scrollHeight + 'px';
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
// Calendly Modal functionality
|
|
const openCalendlyBtn = document.getElementById('open-calendly');
|
|
const calendlyModal = document.getElementById('calendly-modal');
|
|
const calendlyClose = document.querySelector('.calendly-close');
|
|
const calendlyContainer = document.getElementById('calendly-container');
|
|
|
|
// Naloži Calendly SDK
|
|
function loadCalendlyScript() {
|
|
if (!window.Calendly) {
|
|
const script = document.createElement('script');
|
|
script.src = 'https://assets.calendly.com/assets/external/widget.js';
|
|
script.async = true;
|
|
document.head.appendChild(script);
|
|
}
|
|
}
|
|
|
|
// Odpri Calendly modal
|
|
function openCalendlyModal() {
|
|
const calendlyLink = '<?php echo esc_url(get_theme_mod('calendly_link', '')); ?>';
|
|
|
|
// Če Calendly link še ni nastavljen, odpri mailto link
|
|
if (!calendlyLink) {
|
|
window.location.href = 'mailto:<?php echo esc_attr(get_theme_mod('footer_email', 'info@europewonder.com')); ?>?subject=Free%20Consultation';
|
|
return;
|
|
}
|
|
|
|
// Očisti prejšnjo vsebino
|
|
calendlyContainer.innerHTML = '';
|
|
|
|
// Dodaj Calendly widget
|
|
Calendly.initInlineWidget({
|
|
url: calendlyLink,
|
|
parentElement: calendlyContainer,
|
|
prefill: {},
|
|
utm: {}
|
|
});
|
|
|
|
// Prikaži modal
|
|
calendlyModal.classList.add('active');
|
|
document.body.classList.add('calendly-open');
|
|
}
|
|
|
|
// Zapri Calendly modal
|
|
function closeCalendlyModal() {
|
|
calendlyModal.classList.remove('active');
|
|
document.body.classList.remove('calendly-open');
|
|
|
|
// Po kratki zakasnitvi resetiraj vsebino
|
|
setTimeout(() => {
|
|
calendlyContainer.innerHTML = '';
|
|
}, 300);
|
|
}
|
|
|
|
// Event listeners za Calendly modal
|
|
if (openCalendlyBtn) {
|
|
openCalendlyBtn.addEventListener('click', function(e) {
|
|
e.preventDefault();
|
|
loadCalendlyScript();
|
|
openCalendlyModal();
|
|
});
|
|
}
|
|
|
|
if (calendlyClose) {
|
|
calendlyClose.addEventListener('click', closeCalendlyModal);
|
|
}
|
|
|
|
// Zapri modal ob kliku izven modala
|
|
calendlyModal?.addEventListener('click', function(e) {
|
|
if (e.target === calendlyModal) {
|
|
closeCalendlyModal();
|
|
}
|
|
});
|
|
|
|
// Preloži Calendly knjižnico
|
|
loadCalendlyScript();
|
|
});
|
|
</script>
|
|
|
|
<?php wp_footer(); ?>
|
|
</body>
|
|
</html>
|