Nastavení expand či collapse na vybraném widgetu

Úvodní stránka Fórum podpory WordPressu Pluginy (funkčnost webu) Nastavení expand či collapse na vybraném widgetu

Štítky: 

Zvolené téma obsahuje celkem 7 odpovědí. Do diskuze (2 účastníci) se naposledy zapojil uživatel  Petr a poslední změna je stará 2 roky, 9 měsíců.

Aktuálně je na stránce zobrazeno 8 příspěvků - 1. až 8. (z celkem 8)
  • Autor
    Příspěvky
  • #32859

    Petr
    Participant
    Web

    Prosím o radu, pokud jste někdo již řešil něco podobného…

    Na http://www.investinart.biz/obchod/ používám ajax widgety, které jsou při načtení stránky defaultně expanded.
    Potřeboval bych vybraným (kategorie, technika) říct, že se mají defaultě zobrazovat collapsed.

    V souboru \theme\assets\js\woocommerce.js je kód:
    $(‘#sidebar-shop-sidebar .widget h3’).prepend(‘<div class=”minus”>-</div>’);
    který když odstraním a místo toho vložím kód:
    $(‘#sidebar-shop-sidebar .widget h3’).prepend(‘<div class=”plus”>+</div>’);
    $(‘#sidebar-shop-sidebar .widget h3’).parent().find(‘> *:not(h3)’).slideToggle();
    tak se zavřou všechny widgety. Což ale nepotřebuji, potřebuji jen vybrané.

    Umí mi někdo poradit, jak tomu dát parametr, kterého widgetu se to týká?

    Díky moc.

    Petr

    #32862

    HiLow
    Participant
    Web

    Pro Kategorie je správný selektor #yith-woo-ajax-navigation-3 nebo .widget-6
    Pro Technika #yith-woo-ajax-navigation-4 nebo .widget-7

    #32863

    Petr
    Participant
    Web

    Díky za rychlou odpověď. Přiznám se, že moc nevím, jak to použít, aby to fungovalo.
    Zkusil jsem pod řádek:
    $(‘#sidebar-shop-sidebar .widget h3’).prepend(‘<div class=”minus”>-</div>’);
    přidat nový řádek s upraveným selektorem:
    $(‘#yith-woo-ajax-navigation-3’).prepend(‘<div class=”plus”>+</div>’);
    a když to nezafungovalo, tak ještě následující řádek:
    $(‘#yith-woo-ajax-navigation-3’).parent().find(‘> *:not(h3)’).slideToggle();
    ale ani to nepomohlo.

    Můžu ještě poprosit o příklad, jak ty selektory použít?

    Díky.

    #32888

    HiLow
    Participant
    Web

    Chybí tam .widget h3
    celkově tedy
    $('#yith-woo-ajax-navigation-3 .widget h3').prepend('<div class="plus">+</div>');

    Další věci je, že tam máte nějaké divné apostrofy – používá se ' a " a ne ‘ a ”.

    #32902

    Petr
    Participant
    Web

    Díky za postřeh, ty divné apostrofy se tam nějak dostaly při kopírování…

    Upravil jsem dle Vašich instrukcí, nicméně to nezafungovalo, bude v tom ještě něco, co nutí při načtení stránky tyto widgety zůstat expandované…

    Řádky kódu, které se týkají shop sidebarů vypadají po úpravě takto:

    //shop sidebar
    $(‘#sidebar-shop-sidebar .widget h3’).prepend(‘<div class=”minus”>-</div>’);
    $(‘#yith-woo-ajax-navigation-3 .widget h3’).prepend(‘<div class=”plus”>+</div>’);
    $(‘#yith-woo-ajax-navigation-3 .widget h3’).parent().find(‘> *:not(h3)’).slideToggle();
    $(‘#yith-woo-ajax-navigation-4 .widget h3’).prepend(‘<div class=”plus”>+</div>’);
    $(‘#yith-woo-ajax-navigation-4 .widget h3’).parent().find(‘> *:not(h3)’).slideToggle();
    $(‘#sidebar-shop-sidebar .widget’).on(‘click’, ‘h3’, function(){
    $(this).parent().find(‘> *:not(h3)’).slideToggle();

    if( $(this).find(‘div’).hasClass(‘minus’) ) {
    $(this).find(‘div’).removeClass(‘minus’).addClass(‘plus’).text(‘+’);
    } else {
    $(this).find(‘div’).removeClass(‘plus’).addClass(‘minus’).text(‘-‘);
    }
    });

    Díky.

    #32904

    HiLow
    Participant
    Web

    Dobrý den,
    kam ten kód píšete, případně kde ho upravujete?

    Protože u expand/colapse se mění jen style u <ul class="yith-wcan-list yith-wcan " style="display: block;">

    style="display: block;" nebo style="display: none;"

    Ten Váš script se nikde nenačítá.

    #32911

    Petr
    Participant
    Web

    Ten kód píšu do souboru woocommerce.js, který se nachází v adresáři webové šablony \theme\assets\js\

    Myslel jsem si, že by zde stačila nějaká menší úprava kódu, aby to fungovalo, protože když jsem nahradil řádek kódu:
    $(‘#sidebar-shop-sidebar .widget h3’).prepend(‘<div class=”minus”>-</div>’);
    těmito dvěma řádky:
    $(‘#sidebar-shop-sidebar .widget h3’).prepend(‘<div class=”plus”>+</div>’);
    $(‘#sidebar-shop-sidebar .widget h3’).parent().find(‘> *:not(h3)’).slideToggle();
    tak se všechny widgety v shopu defaultně sbalili.

    Ale je možné, že tudy cesta nevede, že bude třeba nějaký větší programátorský zásah, který umožní parametr expand/collapse nastavit přímo na každém widgetu. Nebo bude třeba řádky kódu pro #yith-woo-ajax-navigation-3 a 4 vložit někam jinam.

    #33001

    Petr
    Participant
    Web

    Vyřešeno jednoduchým custom pluginem, který po načtení stránky vybrané widgety zabalí.

    Díky za pomoc.

Aktuálně je na stránce zobrazeno 8 příspěvků - 1. až 8. (z celkem 8)

Pokud chcete odpovědět na toto téma, musíte se nejdříve přihlásit.