Elementor, Wordpress Otomatik Arkaplan Müziği
1
●62
- 15-09-2024, 18:20:24Selam, kolay bir yol söyleyeyim.
Önce ses dosyasını Ortam > Yeni Ekle kısmından sitenize yükleyin. Sonra Elementor sayfayı açıp bir yere HTML ekledikten sonra aşağıdaki kısa kodu girin ve YOUR_AUDIO_FILE_URL kısmına eklediğiniz ses dosyasının linkini ekleyin.
<audio autoplay loop> <source src="YOUR_AUDIO_FILE_URL" type="audio/mpeg"> Your browser does not support the audio element. </audio>
Eğer sayfada kullanıcının müziği durdurabilmesini, devam ettirebilmesini isterseniz şu kodu kullanabilirsiniz;
<html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"> <style> #musicControl { position: fixed; bottom: 20px; right: 20px; width: 80px; height: 80px; background-color: black; border-radius: 5px; display: flex; align-items: center; justify-content: center; color: white; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); z-index: 1000; } #playPauseButton { font-size: 24px; cursor: pointer; } </style> </head> <body> <div id="musicControl"> <i id="playPauseButton" class="fas fa-play"></i> </div> <audio id="backgroundMusic" autoplay loop> <source src="YOUR_AUDIO_FILE_URL" type="audio/mpeg"> Your browser does not support the audio element. </audio> <script> const music = document.getElementById('backgroundMusic'); const playPauseButton = document.getElementById('playPauseButton'); music.play(); playPauseButton.addEventListener('click', () => { if (music.paused) { music.play(); playPauseButton.classList.remove('fa-play'); playPauseButton.classList.add('fa-pause'); } else { music.pause(); playPauseButton.classList.remove('fa-pause'); playPauseButton.classList.add('fa-play'); } }); </script> </body> </html>Ücreti mukabilinde daha fazla özelleştirme isterseniz bana ulaşabilirsiniz.