Bildiğiniz üzere arama ve yukarı çık butonu için genellikle eklenti kullanılıyor. bugün size bir iyilik yapasım tuttu.



elementor üzerinden 'Simge' oluşturuyoruz. Simge'yi kendimize göre customize ettikten sonra css ID kısmına arama yazıyoruz ya da ne istiyorsanız

sonra html kodu ekliyorsunuz html kodu ekledikten sonra size verdiğim kodlardan uygun olanı yapıştırın.

class ID'leri

arama için gereken class .arama


.arama class'ı için gerekli kod
<style>
.arama {
            position: fixed;
            top: 0;
            right: 0;
            opacity: 0;
            transition: opacity 0.3s ease-in-out;
            z-index: 999;
            padding-left:90%;
        }

        .arama.active {
            opacity: 1;
        }
    </style>
    
    
    <script>
        document.addEventListener('scroll', function () {
            var scrollPosition = window.scrollY || document.documentElement.scrollTop;

            // Adjust the value (e.g., 200) based on when you want the element to appear
            if (scrollPosition > 200) {
                document.querySelector('.arama').classList.add('active');
            } else {
                document.querySelector('.arama').classList.remove('active');
            }
        });

        function openSearch() {
            // Add your search functionality here
            alert('Open Search');
        }
    </script>
--edit yukarı çıkmak için bu kodu direkt html kod içine yapıştırın sağ altta çıkacak.

<style>
        .yukari {
            display: none;
            position: fixed;
            bottom: 20px;
            right: 20px;
            cursor: pointer;
            background-color: #007bff;
            color: #fff;
            border: none;
            border-radius: 50%;
            padding: 10px;
            box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
        }
    </style>
 
    <button class="yukari" onclick="yukariCik()">↑</button>

    <script>
        window.onscroll = function () {
            kontrolEt()
        };

        function kontrolEt() {
            if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
                document.querySelector('.yukari').style.display = 'block';
            } else {
                document.querySelector('.yukari').style.display = 'none';
            }
        }

        function yukariCik() {
            document.body.scrollTop = 0; // Safari
            document.documentElement.scrollTop = 0; // Diğer tarayıcılar
        }
    </script>