Blogger Yorum Formunu Karanlık Yapma

Blogger sitenizde karanlık bir tema kullanıyorsanız, muhtemelen en büyük sorununuz bembeyaz görünen yorum kutusudur. Blogger’ın varsayılan yorum formu bir iframe içinde çalıştığı için renklerini doğrudan değiştiremezsiniz. Ancak CSS’in filter gücünü kullanarak bu sorunu saniyeler içinde çözebilirsiniz.

Aşağıdaki kod, yorum formunun renklerini tersine çevirerek koyu temalara uyumlu hale getirir.

.comment-form iframe {
filter: invert(94%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%);
}

Artık yorum formunuz karanlık temanızla mükemmel bir uyum içinde görünecek!

Bunun için bir açma kapama butonu isterseniz. Bu kodu kullanabilirsiniz.

<a href="javascript:void(0);" id="filterToggleBtn" style="cursor: pointer; text-decoration: underline; color:#242424;font-size: 25px; text-align: center"><i class="far fa-moon"></i></a>

<script>

document.getElementById('filterToggleBtn').addEventListener('click', function(e) {

    e.preventDefault();

    // iframe'i seçiyoruz

    var iframe = document.querySelector('.comment-form iframe');

    if (iframe) {

        // Filtre şu an uygulanmış mı kontrol et

        if (iframe.style.filter === "" || iframe.style.filter === "none") {

            // Filtre yoksa ekle

            iframe.style.filter = "invert(94%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%)";

        } else {

            // Filtre varsa temizle

            iframe.style.filter = "none";

        }

    } 

});

</script>

2 Yorum