Verleihe deiner WordPress-Webseite mit Divi einen magischen Touch – ganz ohne zusätzliche Plugins. Bei OIT GmbH zeigen wir dir, wie du mit einfachen Schritten einen charmanten Schneeflocken-Effekt kreierst. Perfekt, um deine Seite in der Winterzeit besonders hervorzuheben. Unsere Anleitung ist unkompliziert und auch für Anfänger leicht umsetzbar. Entdecke, wie du mit nur wenigen Codezeilen deiner Webseite ein winterliches Ambiente verleihst. Mach deine Webseite mit uns winterlich und festlich!
1. JavaScript im Code Modul
Füge folgenden Code irgendwo auf der Seite im Code Modul ein:
<div id="snow"></div>
<script>
document.addEventListener('DOMContentLoaded', function(){
var script = document.createElement('script');
script.src = 'https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js';
script.onload = function(){
particlesJS("snow", {
"particles": {
"number": {
"value": 200,
"density": {
"enable": true,
"value_area": 800
}
},
"color": {
"value": "#ffffff"
},
"opacity": {
"value": 0.7,
"random": false,
"anim": {
"enable": false
}
},
"size": {
"value": 5,
"random": true,
"anim": {
"enable": false
}
},
"line_linked": {
"enable": false
},
"move": {
"enable": true,
"speed": 5,
"direction": "bottom",
"random": true,
"straight": false,
"out_mode": "out",
"bounce": false,
"attract": {
"enable": true,
"rotateX": 300,
"rotateY": 1200
}
}
},
"interactivity": {
"events": {
"onhover": {
"enable": false
},
"onclick": {
"enable": false
},
"resize": false
}
},
"retina_detect": true
});
}
document.head.append(script);
});
</script> 2. CSS Code einfügen
Füge folgenden Code in den Seiteneinstellungen ein:
#snow {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
pointer-events: none;
z-index: 1000;
} Verwandte Artikel
Hast du eine Frage zu diesem Artikel?
Schreib uns – wir antworten in der Regel innerhalb eines Werktages.