Project-Pro/zaufane.pl
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor home page form and add new cennik page hero section

Browse Source
This commit is contained in:
Jacek Pyziak
2025-05-18 23:05:39 +02:00
parent 72b34e1135
commit 1cf75e335e
3 changed files with 101 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
templates_user/cennik-page-hero.php Normal file
View File

@@ -0,0 +1,14 @@
<div class="container">
<div class="row">
<div class="col-lg-6">
<h2><img alt="" src="/upload/filemanager/new-2024/assets/Star.svg" /> Skorzystaj z ofert</h2>
<h1>Otrzymaj ofertę dostosowaną do Twojego biznesu</h1>
<p><strong>Użyj suwak&oacute;w aby dostosować ofertę do Twojego biznesu, wpisz swojego maila i otrzymaj wycenę!</strong></p>
<img alt="" src="/upload/filemanager/new-2024/cennik/users.png" />
</div>
<div class="col-lg-6"><? include 'templates_user/home-page-form.php';?></div>
</div>
</div>

17
templates_user/home-page-form.php
View File

@@ -1,6 +1,8 @@
<?php <?php
if (\S::get('action') == 'home_page_form_send') { if ( \S::get('action') == 'home_page_form_send' )
if ($_SERVER["REQUEST_METHOD"] == "POST") { {
if ($_SERVER["REQUEST_METHOD"] == "POST")
{
$recaptchaSecret = '6Le9GhEqAAAAAKUCOPR9QGXs4G81OGZ2CxUOu7rW'; $recaptchaSecret = '6Le9GhEqAAAAAKUCOPR9QGXs4G81OGZ2CxUOu7rW';
$recaptchaResponse = $_POST['g-recaptcha-response']; $recaptchaResponse = $_POST['g-recaptcha-response'];
@@ -100,7 +102,7 @@ if (\S::get('action') == 'home_page_form_send') {
} }
?> ?>
<form method="POST" action="/" id="custom-form"> <form method="POST" action="" id="custom-form">
<input type="hidden" name="action" value="home_page_form_send"> <input type="hidden" name="action" value="home_page_form_send">
<div class="f-row"> <div class="f-row">
@@ -139,11 +141,11 @@ if (\S::get('action') == 'home_page_form_send') {
</div> </div>
<div class="checkbox-row"> <div class="checkbox-row">
<input type="checkbox" name="" id="checkbox-1" required> <input type="checkbox" name="zgoda_inne_powiadomienia" id="checkbox-1" required>
<label for="checkbox-1">*Wyrażam zgodę na otrzymywanie innych powiadomień od firmy ... <a href="#" id="info-for-checkbox-1">Więcej</a></label> <label for="checkbox-1">*Wyrażam zgodę na otrzymywanie innych powiadomień od firmy ... <a href="#" id="info-for-checkbox-1">Więcej</a></label>
</div> </div>
<div class="checkbox-row"> <div class="checkbox-row">
<input type="checkbox" name="" id="checkbox-2" required> <input type="checkbox" name="zgoda_przetwarzanie_danych" id="checkbox-2" required>
<label for="checkbox-2">*Wyrażam zgodę na przechowywanie i przetwarzanie moich danych ... <a href="#" id="info-for-checkbox-2">Więcej</a></label> <label for="checkbox-2">*Wyrażam zgodę na przechowywanie i przetwarzanie moich danych ... <a href="#" id="info-for-checkbox-2">Więcej</a></label>
</div> </div>
@@ -151,7 +153,7 @@ if (\S::get('action') == 'home_page_form_send') {
<button type="submit" class="btn1">Otrzymaj wycenę</button> <button type="submit" class="btn1">Otrzymaj wycenę</button>
</form> </form>
<style> <style type="text/css">
.checkbox-rows{ .checkbox-rows{
position: fixed; position: fixed;
top: 50%; top: 50%;
@@ -167,6 +169,7 @@ if (\S::get('action') == 'home_page_form_send') {
} }
</style> </style>
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<script class="footer"> <script class="footer">
$(document).ready(function() { $(document).ready(function() {
$('body').on('click', '#info-for-checkbox-1', function (e) { $('body').on('click', '#info-for-checkbox-1', function (e) {
@@ -176,7 +179,7 @@ if (\S::get('action') == 'home_page_form_send') {
content: 'Wyrażam zgodę na otrzymywanie innych powiadomień od firmy Zaufane.pl. Aby zapewnić Państwu żądane treści, musimy przechowywać i przetwarzać Państwa dane osobowe. Jeśli wyrażają Państwo zgodę na przechowywanie Państwa danych osobowych w tym celu, prosimy zaznaczyć poniższe pole wyboru.', content: 'Wyrażam zgodę na otrzymywanie innych powiadomień od firmy Zaufane.pl. Aby zapewnić Państwu żądane treści, musimy przechowywać i przetwarzać Państwa dane osobowe. Jeśli wyrażają Państwo zgodę na przechowywanie Państwa danych osobowych w tym celu, prosimy zaznaczyć poniższe pole wyboru.',
}); });
}) })
$('body').on('click', '#info-for-checkbox-2', function (e) { $('body').on('click', '#info-for-checkbox-2', function (e) {
e.preventDefault() e.preventDefault()
$.alert({ $.alert({

155
templates_user/home-page-hero.php
View File

@@ -1,88 +1,87 @@
<div id="hero-slider"> <div id="hero-slider">
<div class="container big "> <div class="container big ">
<div class="row"> <div class="row">
<div class="col-md-7 d-none d-xl-block"> <div class="col-md-7 d-none d-xl-block">
<div class="hero-slider-box"> <div class="hero-slider-box">
<div class="swiper hero-slider"> <div class="swiper hero-slider">
<div class="swiper-wrapper"> <div class="swiper-wrapper">
<div class="swiper-slide"> <div class="swiper-slide">
<figure> <figure>
<picture> <picture>
<source srcset="/upload/filemanager/images/home/slider-2024/08/1/Screen-1920x1080-slide-1056x880.jpg" media="(min-width: 1921px)"> <source srcset="/upload/filemanager/images/home/slider-2024/08/1/Screen-1920x1080-slide-1056x880.jpg" media="(min-width: 1921px)">
<source srcset="/upload/filemanager/images/home/slider-2024/08/1/Screen-1536x864-slide-845x880.jpg" media="(min-width: 1537px) and (max-width: 1920px)"> <source srcset="/upload/filemanager/images/home/slider-2024/08/1/Screen-1536x864-slide-845x880.jpg" media="(min-width: 1537px) and (max-width: 1920px)">
<source srcset="/upload/filemanager/images/home/slider-2024/08/1/Screen-1280x960-slide-704x880.jpg" media="(max-width: 1536px)"> <source srcset="/upload/filemanager/images/home/slider-2024/08/1/Screen-1280x960-slide-704x880.jpg" media="(max-width: 1536px)">
<img class="nolazy" src="/upload/filemanager/images/home/slider-2024/08/1/Screen-1920x1080-slide-1056x880.jpg" alt=""> <img class="nolazy" src="/upload/filemanager/images/home/slider-2024/08/1/Screen-1920x1080-slide-1056x880.jpg" alt="">
</picture> </picture>
</figure> </figure>
</div> </div>
<div class="swiper-slide"> <div class="swiper-slide">
<figure> <figure>
<picture> <picture>
<source srcset="/upload/filemanager/images/home/slider-2024/08/2/Screen-1920x1080-slide-1056x880.jpg" media="(min-width: 1921px)"> <source srcset="/upload/filemanager/images/home/slider-2024/08/2/Screen-1920x1080-slide-1056x880.jpg" media="(min-width: 1921px)">
<source srcset="/upload/filemanager/images/home/slider-2024/08/2/Screen-1536x864-slide-845x880.jpg" media="(min-width: 1537px) and (max-width: 1920px)"> <source srcset="/upload/filemanager/images/home/slider-2024/08/2/Screen-1536x864-slide-845x880.jpg" media="(min-width: 1537px) and (max-width: 1920px)">
<source srcset="/upload/filemanager/images/home/slider-2024/08/2/Screen-1280x960-slide-704x880.jpg" media="(max-width: 1536px)"> <source srcset="/upload/filemanager/images/home/slider-2024/08/2/Screen-1280x960-slide-704x880.jpg" media="(max-width: 1536px)">
<img class="nolazy" src="/upload/filemanager/images/home/slider-2024/08/2/Screen-1920x1080-slide-1056x880.jpg" alt=""> <img class="nolazy" src="/upload/filemanager/images/home/slider-2024/08/2/Screen-1920x1080-slide-1056x880.jpg" alt="">
</picture> </picture>
</figure> </figure>
</div> </div>
<div class="swiper-slide"> <div class="swiper-slide">
<figure> <figure>
<picture> <picture>
<source srcset="/upload/filemanager/images/home/slider-2024/08/3/Screen-1920x1080-slide-1056x880.jpg" media="(min-width: 1921px)"> <source srcset="/upload/filemanager/images/home/slider-2024/08/3/Screen-1920x1080-slide-1056x880.jpg" media="(min-width: 1921px)">
<source srcset="/upload/filemanager/images/home/slider-2024/08/3/Screen-1536x864-slide-845x880.jpg" media="(min-width: 1537px) and (max-width: 1920px)"> <source srcset="/upload/filemanager/images/home/slider-2024/08/3/Screen-1536x864-slide-845x880.jpg" media="(min-width: 1537px) and (max-width: 1920px)">
<source srcset="/upload/filemanager/images/home/slider-2024/08/3/Screen-1280x960-slide-704x880.jpg" media="(max-width: 1536px)"> <source srcset="/upload/filemanager/images/home/slider-2024/08/3/Screen-1280x960-slide-704x880.jpg" media="(max-width: 1536px)">
<img class="nolazy" src="/upload/filemanager/images/home/slider-2024/08/3/Screen-1920x1080-slide-1056x880.jpg" alt=""> <img class="nolazy" src="/upload/filemanager/images/home/slider-2024/08/3/Screen-1920x1080-slide-1056x880.jpg" alt="">
</picture> </picture>
</figure> </figure>
</div> </div>
<div class="swiper-slide"> <div class="swiper-slide">
<figure> <figure>
<picture> <picture>
<source srcset="/upload/filemanager/images/home/slider-2024/08/4/Screen-1920x1080-slide-1056x880.jpg" media="(min-width: 1921px)"> <source srcset="/upload/filemanager/images/home/slider-2024/08/4/Screen-1920x1080-slide-1056x880.jpg" media="(min-width: 1921px)">
<source srcset="/upload/filemanager/images/home/slider-2024/08/4/Screen-1536x864-slide-845x880.jpg" media="(min-width: 1537px) and (max-width: 1920px)"> <source srcset="/upload/filemanager/images/home/slider-2024/08/4/Screen-1536x864-slide-845x880.jpg" media="(min-width: 1537px) and (max-width: 1920px)">
<source srcset="/upload/filemanager/images/home/slider-2024/08/4/Screen-1280x960-slide-704x880.jpg" media="(max-width: 1536px)"> <source srcset="/upload/filemanager/images/home/slider-2024/08/4/Screen-1280x960-slide-704x880.jpg" media="(max-width: 1536px)">
<img class="nolazy" src="/upload/filemanager/images/home/slider-2024/08/4/Screen-1920x1080-slide-1056x880.jpg" alt=""> <img class="nolazy" src="/upload/filemanager/images/home/slider-2024/08/4/Screen-1920x1080-slide-1056x880.jpg" alt="">
</picture> </picture>
</figure> </figure>
</div> </div>
<div class="swiper-slide"> <div class="swiper-slide">
<figure> <figure>
<picture> <picture>
<source srcset="/upload/filemanager/images/home/slider-2024/08/5/Screen-1920x1080-slide-1056x880.jpg" media="(min-width: 1921px)"> <source srcset="/upload/filemanager/images/home/slider-2024/08/5/Screen-1920x1080-slide-1056x880.jpg" media="(min-width: 1921px)">
<source srcset="/upload/filemanager/images/home/slider-2024/08/5/Screen-1536x864-slide-845x880.jpg" media="(min-width: 1537px) and (max-width: 1920px)"> <source srcset="/upload/filemanager/images/home/slider-2024/08/5/Screen-1536x864-slide-845x880.jpg" media="(min-width: 1537px) and (max-width: 1920px)">
<source srcset="/upload/filemanager/images/home/slider-2024/08/5/Screen-1280x960-slide-704x880.jpg" media="(max-width: 1536px)"> <source srcset="/upload/filemanager/images/home/slider-2024/08/5/Screen-1280x960-slide-704x880.jpg" media="(max-width: 1536px)">
<img class="nolazy" src="/upload/filemanager/images/home/slider-2024/08/5/Screen-1920x1080-slide-1056x880.jpg" alt=""> <img class="nolazy" src="/upload/filemanager/images/home/slider-2024/08/5/Screen-1920x1080-slide-1056x880.jpg" alt="">
</picture> </picture>
</figure> </figure>
</div> </div>
</div>
<div class="swiper-pagination"></div>
</div>
</div>
</div> </div>
<div class="col-xl-5 col-right"> <div class="swiper-pagination"></div>
<? include 'templates_user/home-page-form.php' ?> </div>
</div>
</div> </div>
</div>
<div class="col-xl-5 col-right">
<? include 'templates_user/home-page-form.php' ?>
</div>
</div> </div>
</div>
</div> </div>
<script class="footer"> <script class="footer">
$(document).ready(function() { $(document).ready(function() {
var swiper = new Swiper(".hero-slider", { var swiper = new Swiper(".hero-slider", {
slidesPerView: 1, slidesPerView: 1,
spaceBetween: 30, spaceBetween: 30,
autoplay: { autoplay: {
delay: 5000, delay: 5000,
disableOnInteraction: false, disableOnInteraction: false,
}, },
pagination: { pagination: {
el: ".swiper-pagination", el: ".swiper-pagination",
clickable: true, clickable: true,
}, },
});
}); });
});
</script> </script>