Templates pour Wordpress, utilisant Bulma dans leur architecture
Parallaxe
CSS
.header2 {
height: 500px;
}
/* Paralaxe */
.background-image {
background-image: url('img/mandarine4.jpg');
background-size: cover;
background-position: center;
background-attachment: fixed;
}
.parallax-container {
overflow: hidden;
}
HTML
<div class="parallax-container">
<?php $backgroundImg = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'full'); ?>
<!-- get the thumbnail url -->
<?php if (has_post_thumbnail()) { ?>
<section class="header2 background-image" style="background-image: url('<?php echo $backgroundImg[0]; ?>');">
<?php } else { ?>
<?php
$curdir = getcwd();
chdir(get_template_directory() . "/css/img/randomparalax/");
$files = glob("*.{gif,png,jpg,gif,JPG}", GLOB_BRACE);
chdir($curdir);
$file = $files[array_rand($files)];
?>
<section class="header2 background-image" style="background-image: url('<?php echo (get_bloginfo('template_url') . "/css/img/randomparalax/$file"); ?>')">
<?php } ?>
<?php include('menu-top.php'); ?>
</section><!-- / Bannière -->
</div>
<!-- Menu -->
<?php } ?>
