v2.5.2
Giriş yap

Özel engine'da özel css ve bazı div'leri engelleme

erdal42
488 defa görüntülendi ve 2 kişi tarafından değerlendirildi

Merhabalar,
Alışveriş siteme özel bilgi kutuları eklemiştim.
Her şey yolunda. Şöyle sıkıntım var.
http://sitem/search?q=ayakkabı&engine=1
'engine=' 'de bilgi kutuları çıksın. Ancak
diğer elbise butonuna tıklandığında 'engine=2' olarak geçiyor
http://sitem/search?q=ayakkabı&engine=2
Engine 2'de bilgi kutuların çalışmasını istemiyorum.

Ayrıca engine2'ye özel css nasıl yapabilirim ?
Hem bilgi kutuların engellemek hemde engine 2'ye özel css yapmak.

    <?php if (has_items($t['engines'])) : ?>
        <div class="alisveris-butonlari">
            <div class="ortala navigasyon">
                <ul class="navlar">
                    <?php foreach ($t['engines'] as $tab) : ?>
                      <li class="buton-item">
                        <a class="buton-link buton2-link <?php echo $t->get("{$tab['engine_id']}_active"); ?>"
                            href="<?php echo e_attr(url_for('site.search')); ?>?q=<?php echo e_attr($t['search_query']); ?>&engine=<?php echo e_attr($tab['engine_id']); ?>">
                            <?php echo e(__($tab['engine_name'], _T)); ?>

Bu sistemde çalışıyor.

ebykdrms
695 gün önce
engine=2 parametresine özel css çağırmak

http://sitem.com/search?q=ayakkabı&engine=1 şeklinde istek yapıldı diyelim.
istek yapılan sayfadaki parametreleri şu şekilde alabiliyorsunuz:
$engine = isset($_GET["engine"]) ? $_GET["engine"] : null;
Böylece eğer engine parametresi gelmişse değerini aldınız. Gelmediyse null aldınız.

CSS'i çağırdığınız yerde şöyle bir php kodu kullanabilirsiniz:

<?php if($engine && $engine=="2") { ?>
    <link rel="stylesheet" href="engine.css" />
<?php } ?>

Böylece eğer engine parametresi geldiyse ve değeri de 2 ise belli bir css dosyasını çağırmış olursunuz.

Eğer engine parametresinin varlığını sunucu taraflı değil istemci taraflı belirlemek ve stil dosyasını ona göre çağırmak istiyorsanız şöyle bir kod yardımcı olabilir:

// url'den parametreleri alan bir fonksiyon oluşturuyoruz.
function getUrlParameters() { 
    // url'deki parametre kısmını alıyoruz. Diyelim ki url şu: http://sitem/search?q=ayakkabı&engine=2
    let parameters = window.location.search; // Şu string'i elde ettik: "?q=ayakkabı&engine=2"
    
    // "?" karakterinden kurtuluyoruz:
    parameters = parameters.replace("?",""); // Şu string'i elde ettik: "q=ayakkabı&engine=2"
    
    // Eğer elimizde bi'şey kalmamışsa hiç parametre yok demektir. 
    if(parameters=='') return {}; // Eğer herhangi bir değer elde etmediysek fonksiyonumuz boş obje dönecek.
    
    // Elimizde kalan kısmı "&" karakterlerinden parçalıyoruz:
    parameters = parameters.split("&"); // Şu diziyi elde ettik: ["q=ayakkabı","engine=2"]
    
    // Fonksiyonumuzun döneceği objeyi boş halde oluşturuyoruz:
    const obj = {};
    
    // Sonra parameterelerimizi tek tek dönüyoruz:
    for(let i=0; i < parameters.length; i++) {
    
        // Şu an baktığımız parametre hangisiyse onu "=" karakterinden parçalıyoruz.
        const parameterParts = parameters[i].split("="); // Mesela i=0 için şunu elde ettik: ["q","ayakkabı"]
        
        const key = parameterParts[0];
        const value = parameterParts[1];
        
        // Bazen url'lerde aynı key'den 2 tane olabilir. Yani q=ayakkabı&engine=2&size=24&size=25&size=26 gibi olabilir.
        // Bu durumda size key'ine birkaç değer atanmak istenmiş diyebiliriz.
        // Haliyle bizim her bir key'imizin birkaç değeri olabileceği için değerleri dizi olarak tutmalıyız.
        // Eğer şu an baktığımız key daha önce hiç oluşturulmamışsa boş dizi olarak oluşturalım.
        if(!obj[key]) obj[key] = [];
        
        // Şimdi bu key'in değeri olan diziye değerimizi push edelim.
        obj[key].push(value); // Objemize şunu eklemiş olduk: { "q": ["ayakkabı"] }
    }
    
    // Döngü tamamlanınca obj değeri şöyle oldu: { "q":["ayakkabı"], "engine":["2"] }
    // Artık fonksiyonumuz sonucu döndürebilir:
    return obj;
}

Artık elimizde url'deki parametreleri alıp object haline getirebileceğimiz bir fonksiyonumuz var.
Bu fonksiyon ile parametreleri alalım ve engine değeri varsa ve değeri de 2 ise head tag'ına <link /> ekleyelim.

// Url'deki parametreleri object haline çevirerek alalım:
const urlParameters = getUrlParameters();

// Eğer parametrelerde "engine" diye bir key varsa ve bu key "2" değerini içeriyorsa işlemimizi yapacağız.
// Burada includes("2") dememizin nedeni, bir dizi içinde arama yapacak olmamız.
// Yani mesela şu istekte de bu if bloğu çalışır: "http://sitem/search?q=ayakkabı&engine=1&engine=2&engine=3"
if(urlParameters.engine && urlParameters.engine.includes("2")) {

    // <link /> elementimizi javascript ile oluştuyoruz:
    const link = document.createElement('link');
    link.type = 'text/css';
    link.rel = 'stylesheet';
    link.href = 'assets/css/engine2.css';
    
    // Oluşturduğumuz elementimizi DOM'a ekliyoruz:
    document.head.appendChild(link);
}