php js css php js css

Changes

Changes to Design: New 2019 test

20058
Today 1:07am
Vendeville, Mathieu
Modified design
20061
Today 1:07am
Vendeville, Mathieu
Modified design
Css:
Id:
7
7
Type:
web
web
Is Archived:
0
0
Title:
New 2019 test
New 2019 test
Html:
<!doctype html>
<html lang="en">
<head>
<title></title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Fonts-->
<link href="https://fonts.googleapis.com/css?family=Asap:400,400i,700,700i&amp;subset=latin-ext" rel="stylesheet">

<link href="https://fonts.googleapis.com/css?family=Calligraffitti" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<link rel="stylesheet" href="/media/website_designs/7/css/bootstrap.min.css" />
<link rel="stylesheet" href="/media/website_designs/7/css/flickity.css" media="screen"/>
<link rel="stylesheet" href="/media/website_designs/7/css/style.css" />

<link rel="apple-touch-icon" sizes="57x57" href="/media/website_designs/7/img/favi/apple-icon-57x57.png" />
<link rel="apple-touch-icon" sizes="60x60" href="/media/website_designs/7/img/favi/apple-icon-60x60.png" />
<link rel="apple-touch-icon" sizes="72x72" href="/media/website_designs/7/img/favi/apple-icon-72x72.png" />
<link rel="apple-touch-icon" sizes="76x76" href="/media/website_designs/7/img/favi/apple-icon-76x76.png" />
<link rel="apple-touch-icon" sizes="114x114" href="/media/website_designs/7/img/favi/apple-icon-114x114.png" />
<link rel="apple-touch-icon" sizes="120x120" href="/media/website_designs/7/img/favi/apple-icon-120x120.png" />
<link rel="apple-touch-icon" sizes="144x144" href="/media/website_designs/7/img/favi/apple-icon-144x144.png" />
<link rel="apple-touch-icon" sizes="152x152" href="/media/website_designs/7/img/favi/apple-icon-152x152.png" />
<link rel="apple-touch-icon" sizes="180x180" href="/media/website_designs/7/img/favi/apple-icon-180x180.png" />
<link rel="icon" type="image/png" sizes="192x192" href="/media/website_designs/7/img/favi/android-icon-192x192.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/media/website_designs/7/img/favi/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="96x96" href="/media/website_designs/7/img/favi/favicon-96x96.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/media/website_designs/7/img/favi/favicon-16x16.png" />
<link rel="manifest" href="/media/website_designs/7/img/favi/manifest.json" />
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/media/website_designs/7/img/favi/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">

<script>
jQuery(function($) {
//caches a jQuery object containing the header element
var lastScrollTop = 0;
var menu = $(".menuContainer");
var logo = $(".logoContainer");

$(window).scroll(function() {
var st = $(window).scrollTop();
if (st > 40) {
menu.addClass("whitebg");
logo.addClass("shrink");
} else {
menu.removeClass("whitebg");
logo.removeClass("shrink");
}
lastScrollTop = st;
});
});

</script>

</head>
<body>
<ss:navigation:mobile id="mobile_nav" autopopulatelevel="2" rootpage="/2019-test/">
<ss:navigation:item at="start" page="/tropic/">
<i class="fa fa-home"></i>
</ss:navigation:item>
<ss:navigation:item at="end" page="/commerce/order/" autopopulatelevel="0" >
<i class="fa fa-shopping-cart"></i>
</ss:navigation:item>
<ss:navigation:item at="end" autopopulatelevel="0" >
<ss:standard:link opendialogid="search_popup">
<i class="fa fa-search"></i>
</ss:standard:link>
</ss:navigation:item>
<ss:navigation:item at="end" page="tel:(021) 431 0677" autopopulatelevel="0" >
<i class="fa fa-phone"></i> Call today!
</ss:navigation:item>
</ss:navigation:mobile>
<div class="menuContainer fixed-top">
<div class="container navbar ">
<div class="centered menuHeight">
<div class="logoContainer hidden-xs hidden-sm">
<ss:standard:image src="/media/website_designs/7/img/logo.png" alt="" width="100%" />
</div>
<div class="logoSmallContainer hidden-md hidden-lg">
<ss:standard:image src="/media/website_designs/7/img/logoSmall2.png" alt="" width="100%" />
</div>
<div class="centered hidden-sm">
<ss:navigation:primary openonhover="true" class="horNav" id="main-Menu" rootpage="/2019-test/" autopopulatelevel="2" classlicurrent="selected" orientation="horizontal" includeparentpagelevel="0" >
</ss:navigation:primary>
</div>
<div class="rightMenu centered">
<i class="fas fa-search"></i>
<i class="fab fa-facebook-f"></i>
<i class="fab fa-instagram"></i>
<a href="/commerce/order/"><i class="fas fa-shopping-bag"></i></a>
<i class="fa fa-bars hidden-md hidden-lg"></i>
</div>
</div>
</div>
</div>
<div class="fullheightGreen">
<div class="container padding-top120 fullheight">
<div class="flexheight fullheight">

<ss:logic:if test="\Components\Website\Pages::currentPageId() == '/2019-test/'" >
<div id="slideshow">
<div class="banner">
<ss:layout:rotator class="bannerRotator" transition="fade" movenextid="bannerMoveNext" movepreviousid="bannerMovePrevious" classcontrols="bottom center round mycustom">
<ul>
<ss:data:repeater parsenow="datafilter" datasource="\Components\Website\Posts::getAllForCategory(23)" as="post" datafilter="array(array('post_is_offline', '=', 0))">
<li>
<a href="[? $post['post_content_url'] ?]"><ss:standard:image src="'/media/website_posts/' + $post['post_id'] + '/' + $post['post_icon']" alt="$post['post_title']" parsenow="src,alt" class=""/>
<!----></a>


<div class="slideLink [? $post['post_content_short_align'] ?]" >
<ss:logic:if test="$post['post_content_short']">
<div class="slideLinkText" style="color:[? $post['post_overwrite_short_color'] ?];"><b>[? $post['post_content_short'] ?]</b></div>
</ss:logic:if>
<ss:logic:if test="$post['post_link_button']">
<div style="text-align:center;"><a href="[? $post['post_content_url'] ?]" class="btn-red">[? $post['post_link_button'] ?]</a></div>
</ss:logic:if>
</div>
</li>

</ss:data:repeater>
</ul>
</ss:layout:rotator>
<a id="bannerMovePrevious" href="#">
<img alt="Previous Item" src="/media/website_designs/6/img/left-arrow2.png" />
</a>
<a id="bannerMoveNext" href="#">
<img alt="Next Item" src="/media/website_designs/6/img/right-arrow2.png" />
</a>
</div>
</div>
</ss:logic:if>

<div class="subslider">
<div class="row">
<div class="col-xs-4">
<h3>Lorem</h3>
<p>
ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis, urna at bibendum finibus, lacus tortor finibus ipsum, id elementum
lacus tortor vitae magna. Donec mattis nibh at felis mattis ullamcorper. Aliquam et semper elit. Nunc id euismod nisl. Fusce sollicitudin
elit eu arcu finibus viverra. Nulla facilisi. Duis maximus dolor turpis, in vestibulum erat tristique sed. In auctor nisl at nibh pharetra
vehicula. Nulla lectus leo, consequat id dignissim eu, auctor vitae arcu.
</p>
</div>
<div class="col-xs-4">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis, urna at bibendum finibus, lacus tortor finibus ipsum, id elementum lacus tortor vitae magna. Donec mattis nibh at felis mattis ullamcorper. Aliquam et semper elit. Nunc id euismod nisl. Fusce sollicitudin elit eu arcu finibus viverra. Nulla facilisi. Duis maximus dolor turpis, in vestibulum erat tristique sed. In auctor nisl at nibh pharetra vehicula. Nulla lectus leo, consequat id dignissim eu, auctor vitae arcu.</p>
</div>
<div class="col-xs-4">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis, urna at bibendum finibus, lacus tortor finibus ipsum, id elementum lacus tortor vitae magna. Donec mattis nibh at felis mattis ullamcorper. Aliquam et semper elit. Nunc id euismod nisl. Fusce sollicitudin elit eu arcu finibus viverra. Nulla facilisi. Duis maximus dolor turpis, in vestibulum erat tristique sed. In auctor nisl at nibh pharetra vehicula. Nulla lectus leo, consequat id dignissim eu, auctor vitae arcu.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container fullheightBlue">
<div class="row">
<div class="col-xs-4">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis, urna at bibendum finibus, lacus tortor finibus ipsum, id elementum lacus tortor vitae magna. Donec mattis nibh at felis mattis ullamcorper. Aliquam et semper elit. Nunc id euismod nisl. Fusce sollicitudin elit eu arcu finibus viverra. Nulla facilisi. Duis maximus dolor turpis, in vestibulum erat tristique sed. In auctor nisl at nibh pharetra vehicula. Nulla lectus leo, consequat id dignissim eu, auctor vitae arcu.</p>
</div>
<div class="col-xs-4">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis, urna at bibendum finibus, lacus tortor finibus ipsum, id elementum lacus tortor vitae magna. Donec mattis nibh at felis mattis ullamcorper. Aliquam et semper elit. Nunc id euismod nisl. Fusce sollicitudin elit eu arcu finibus viverra. Nulla facilisi. Duis maximus dolor turpis, in vestibulum erat tristique sed. In auctor nisl at nibh pharetra vehicula. Nulla lectus leo, consequat id dignissim eu, auctor vitae arcu.</p>
</div>
<div class="col-xs-4">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis, urna at bibendum finibus, lacus tortor finibus ipsum, id elementum lacus tortor vitae magna. Donec mattis nibh at felis mattis ullamcorper. Aliquam et semper elit. Nunc id euismod nisl. Fusce sollicitudin elit eu arcu finibus viverra. Nulla facilisi. Duis maximus dolor turpis, in vestibulum erat tristique sed. In auctor nisl at nibh pharetra vehicula. Nulla lectus leo, consequat id dignissim eu, auctor vitae arcu.</p>
</div>
</div>
</div>

<script src="/media/website_designs/7/js/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script>
<script src="/media/website_designs/7/js/vendor/bootstrap.min.js"></script>
<script src="/media/website_designs/7/js/jquery.flexisel.js"></script>
<script src="/media/website_designs/7/js/main.js"></script>
<script src="/media/website_designs/7/js/flickity.pkgd.min.js"></script>

<ss:standard:script at="head" includejquery="true" />
</body>
</html>
<!doctype html>
<html lang="en">
<head>
<title></title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Fonts-->
<link href="https://fonts.googleapis.com/css?family=Asap:400,400i,700,700i&amp;subset=latin-ext" rel="stylesheet">

<link href="https://fonts.googleapis.com/css?family=Calligraffitti" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<link rel="stylesheet" href="/media/website_designs/7/css/bootstrap.min.css" />
<link rel="stylesheet" href="/media/website_designs/7/css/flickity.css" media="screen"/>
<link rel="stylesheet" href="/media/website_designs/7/css/style.css" />

<link rel="apple-touch-icon" sizes="57x57" href="/media/website_designs/7/img/favi/apple-icon-57x57.png" />
<link rel="apple-touch-icon" sizes="60x60" href="/media/website_designs/7/img/favi/apple-icon-60x60.png" />
<link rel="apple-touch-icon" sizes="72x72" href="/media/website_designs/7/img/favi/apple-icon-72x72.png" />
<link rel="apple-touch-icon" sizes="76x76" href="/media/website_designs/7/img/favi/apple-icon-76x76.png" />
<link rel="apple-touch-icon" sizes="114x114" href="/media/website_designs/7/img/favi/apple-icon-114x114.png" />
<link rel="apple-touch-icon" sizes="120x120" href="/media/website_designs/7/img/favi/apple-icon-120x120.png" />
<link rel="apple-touch-icon" sizes="144x144" href="/media/website_designs/7/img/favi/apple-icon-144x144.png" />
<link rel="apple-touch-icon" sizes="152x152" href="/media/website_designs/7/img/favi/apple-icon-152x152.png" />
<link rel="apple-touch-icon" sizes="180x180" href="/media/website_designs/7/img/favi/apple-icon-180x180.png" />
<link rel="icon" type="image/png" sizes="192x192" href="/media/website_designs/7/img/favi/android-icon-192x192.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/media/website_designs/7/img/favi/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="96x96" href="/media/website_designs/7/img/favi/favicon-96x96.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/media/website_designs/7/img/favi/favicon-16x16.png" />
<link rel="manifest" href="/media/website_designs/7/img/favi/manifest.json" />
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/media/website_designs/7/img/favi/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">

<script>
jQuery(function($) {
//caches a jQuery object containing the header element
var lastScrollTop = 0;
var menu = $(".menuContainer");
var logo = $(".logoContainer");

$(window).scroll(function() {
var st = $(window).scrollTop();
if (st > 40) {
menu.addClass("whitebg");
logo.addClass("shrink");
} else {
menu.removeClass("whitebg");
logo.removeClass("shrink");
}
lastScrollTop = st;
});
});

</script>

</head>
<body>
<ss:navigation:mobile id="mobile_nav" autopopulatelevel="2" rootpage="/2019-test/">
<ss:navigation:item at="start" page="/tropic/">
<i class="fa fa-home"></i>
</ss:navigation:item>
<ss:navigation:item at="end" page="/commerce/order/" autopopulatelevel="0" >
<i class="fa fa-shopping-cart"></i>
</ss:navigation:item>
<ss:navigation:item at="end" autopopulatelevel="0" >
<ss:standard:link opendialogid="search_popup">
<i class="fa fa-search"></i>
</ss:standard:link>
</ss:navigation:item>
<ss:navigation:item at="end" page="tel:(021) 431 0677" autopopulatelevel="0" >
<i class="fa fa-phone"></i> Call today!
</ss:navigation:item>
</ss:navigation:mobile>
<div class="menuContainer fixed-top">
<div class="container navbar ">
<div class="centered menuHeight">
<div class="logoContainer hidden-xs hidden-sm">
<ss:standard:image src="/media/website_designs/7/img/logo.png" alt="" width="100%" />
</div>
<div class="logoSmallContainer hidden-md hidden-lg">
<ss:standard:image src="/media/website_designs/7/img/logoSmall2.png" alt="" width="100%" />
</div>
<div class="centered hidden-sm">
<ss:navigation:primary openonhover="true" class="horNav" id="main-Menu" rootpage="/2019-test/" autopopulatelevel="2" classlicurrent="selected" orientation="horizontal" includeparentpagelevel="0" >
</ss:navigation:primary>
</div>
<div class="rightMenu centered">
<i class="fas fa-search"></i>
<i class="fab fa-facebook-f"></i>
<i class="fab fa-instagram"></i>
<a href="/commerce/order/"><i class="fas fa-shopping-bag"></i></a>
<i class="fa fa-bars hidden-md hidden-lg"></i>
</div>
</div>
</div>
</div>
<div class="fullheightGreen">
<div class="container padding-top120 fullheight">
<div class="flexheight fullheight">

<ss:logic:if test="\Components\Website\Pages::currentPageId() == '/2019-test/'" >
<div id="slideshow">
<div class="banner">
<ss:layout:rotator class="bannerRotator" transition="fade" movenextid="bannerMoveNext" movepreviousid="bannerMovePrevious" classcontrols="bottom center round mycustom">
<ul>
<ss:data:repeater parsenow="datafilter" datasource="\Components\Website\Posts::getAllForCategory(23)" as="post" datafilter="array(array('post_is_offline', '=', 0))">
<li>
<a href="[? $post['post_content_url'] ?]"><ss:standard:image src="'/media/website_posts/' + $post['post_id'] + '/' + $post['post_icon']" alt="$post['post_title']" parsenow="src,alt" class=""/>
<!----></a>


<div class="slideLink [? $post['post_content_short_align'] ?]" >
<ss:logic:if test="$post['post_content_short']">
<div class="slideLinkText" style="color:[? $post['post_overwrite_short_color'] ?];"><b>[? $post['post_content_short'] ?]</b></div>
</ss:logic:if>
<ss:logic:if test="$post['post_link_button']">
<div style="text-align:center;"><a href="[? $post['post_content_url'] ?]" class="btn-red">[? $post['post_link_button'] ?]</a></div>
</ss:logic:if>
</div>
</li>

</ss:data:repeater>
</ul>
</ss:layout:rotator>
<a id="bannerMovePrevious" href="#">
<img alt="Previous Item" src="/media/website_designs/6/img/left-arrow2.png" />
</a>
<a id="bannerMoveNext" href="#">
<img alt="Next Item" src="/media/website_designs/6/img/right-arrow2.png" />
</a>
</div>
</div>
</ss:logic:if>

<div class="subslider">
<div class="row">
<div class="col-xs-4">
<h3>Lorem</h3>
<p>
ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis, urna at bibendum finibus, lacus tortor finibus ipsum, id elementum
lacus tortor vitae magna. Donec mattis nibh at felis mattis ullamcorper. Aliquam et semper elit. Nunc id euismod nisl. Fusce sollicitudin
elit eu arcu finibus viverra. Nulla facilisi. Duis maximus dolor turpis, in vestibulum erat tristique sed. In auctor nisl at nibh pharetra
vehicula. Nulla lectus leo, consequat id dignissim eu, auctor vitae arcu.
</p>
</div>
<div class="col-xs-4">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis, urna at bibendum finibus, lacus tortor finibus ipsum, id elementum lacus tortor vitae magna. Donec mattis nibh at felis mattis ullamcorper. Aliquam et semper elit. Nunc id euismod nisl. Fusce sollicitudin elit eu arcu finibus viverra. Nulla facilisi. Duis maximus dolor turpis, in vestibulum erat tristique sed. In auctor nisl at nibh pharetra vehicula. Nulla lectus leo, consequat id dignissim eu, auctor vitae arcu.</p>
</div>
<div class="col-xs-4">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis, urna at bibendum finibus, lacus tortor finibus ipsum, id elementum lacus tortor vitae magna. Donec mattis nibh at felis mattis ullamcorper. Aliquam et semper elit. Nunc id euismod nisl. Fusce sollicitudin elit eu arcu finibus viverra. Nulla facilisi. Duis maximus dolor turpis, in vestibulum erat tristique sed. In auctor nisl at nibh pharetra vehicula. Nulla lectus leo, consequat id dignissim eu, auctor vitae arcu.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container fullheightBlue">
<div class="row">
<div class="col-xs-4">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis, urna at bibendum finibus, lacus tortor finibus ipsum, id elementum lacus tortor vitae magna. Donec mattis nibh at felis mattis ullamcorper. Aliquam et semper elit. Nunc id euismod nisl. Fusce sollicitudin elit eu arcu finibus viverra. Nulla facilisi. Duis maximus dolor turpis, in vestibulum erat tristique sed. In auctor nisl at nibh pharetra vehicula. Nulla lectus leo, consequat id dignissim eu, auctor vitae arcu.</p>
</div>
<div class="col-xs-4">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis, urna at bibendum finibus, lacus tortor finibus ipsum, id elementum lacus tortor vitae magna. Donec mattis nibh at felis mattis ullamcorper. Aliquam et semper elit. Nunc id euismod nisl. Fusce sollicitudin elit eu arcu finibus viverra. Nulla facilisi. Duis maximus dolor turpis, in vestibulum erat tristique sed. In auctor nisl at nibh pharetra vehicula. Nulla lectus leo, consequat id dignissim eu, auctor vitae arcu.</p>
</div>
<div class="col-xs-4">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis, urna at bibendum finibus, lacus tortor finibus ipsum, id elementum lacus tortor vitae magna. Donec mattis nibh at felis mattis ullamcorper. Aliquam et semper elit. Nunc id euismod nisl. Fusce sollicitudin elit eu arcu finibus viverra. Nulla facilisi. Duis maximus dolor turpis, in vestibulum erat tristique sed. In auctor nisl at nibh pharetra vehicula. Nulla lectus leo, consequat id dignissim eu, auctor vitae arcu.</p>
</div>
</div>
</div>

<script src="/media/website_designs/7/js/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script>
<script src="/media/website_designs/7/js/vendor/bootstrap.min.js"></script>
<script src="/media/website_designs/7/js/jquery.flexisel.js"></script>
<script src="/media/website_designs/7/js/main.js"></script>
<script src="/media/website_designs/7/js/flickity.pkgd.min.js"></script>

<ss:standard:script at="head" includejquery="true" />
</body>
</html>
Js:
jQuery('.commerceProductsOrderBox').insertBefore('div.mainContent > h1')
jQuery('.commerceProductsOrderBox').insertBefore('div.mainContent > h1')
Php Source:

															

														
Mobile Function:
none
none
Mobile Value:

															

														
Google Analytics Id:

															

														
Ajax Navigation: