✅ WEB- ja WordPress -uutiset, -teemat, -laajennukset. Täällä jaamme vinkkejä ja parhaita verkkosivustoratkaisuja.

Kuinka lisätä mukautettuja asetuksia olemassa olevaan widgetiin WordPressissä

5

Tässä viestissä opimme lisäämään mukautettua HTML-koodia ja asetuksia mihin tahansa WordPressin vakiowidgeteihin tai muihin. Näiden asetusten avulla opimme erilaisia ​​temppuja widgetien toiminnan muokkaamiseen vastaavasti.

Ensimmäinen osa; mukautettujen asetusten lisääminen ja tallentaminen on melko helppoa. Toinen osa riippuu siitä, mitä haluat tehdä, ja se riippuu siitä, mitä widgetiä käsittelet. Tässä viestissä olen sisällyttänyt kaksi esimerkkiä; widgetin ohittaminen asetuksesta riippuen (asetusten lisääminen widgetin näkyvyyden hallitsemiseksi tietyissä tapauksissa) ja WordPress-navigointiwidgetin valikon argumenttien muokkaaminen. Toisen osan esimerkin pitäisi antaa sinulle hyvä vihje siitä, kuinka voit käsitellä sitä, mitä haluat tehdä.

Mukautettujen asetusten lisääminen mihin tahansa widgetiin

Mukautettujen asetusten lisäämiseen olemassa oleviin widgeteihin käytämme toimintoa nimeltä [in_widget_form](https://developer.wordpress.org/reference/hooks/in_widget_form/). Tätä toimintoa sovelletaan kaikkien widgetien form()toimintoon, joka on toiminto, joka vastaa widgetin järjestelmänvalvojan osan hahmontamisesta.

Tällä suodattimella saamme kolme parametria, mutta olemme todella kiinnostuneita vain ensimmäisestä ja kolmannesta. Ensimmäinen on widget-instanssi, jota käytämme hakemaan kenttien oikeat nimet ja tunnisteet ja (valinnaisesti) tarkistamaan, minkälaiseen widgetiin olemme koukussa. Kolmas parametri on joukko widgetin tallennettuja asetuksia, joita meidän on käytettävä tarkistaaksemme asetustemme edellisen tallennetun tilan.

Alla oleva koodi lisää valintaruudun asetuksen nimellä " awp-custom-setting". Säädä nimi ja HTML haluamasi syötteen mukaan. Tärkeintä on $widget->get_field_name()lisätä oikeat tunnukset ja nameattribuutit kaikkiin syötteihisi. Syöttöidesi arvo tulee täyttää aiemmin tallennetuilla, ja sen löydät parametrista $instance. Valintaruuduissa voit käyttää WordPressin toimintoa [checked](https://developer.wordpress.org/reference/functions/checked/)()tulostamaan valitun attribuutin.

Kun olet lisännyt tämän teemasi functions.phptai laajennuskoodiisi, kaikkien widgetien pitäisi nyt saada valintaruutu järjestelmänvalvojan lomakkeen loppuun.

Kohdista tiettyihin widgeteihin

Jos haluat käyttää asetuksiasi vain yhteen tai joihinkin tiettyihin widgeteihin, voit verrata kohteen id_baseominaisuuksia $widget. Sinun on tiedettävä perustunnus – jos olet epävarma, tee vain var_dump($widget->id_base)koukku, tallenna ja tarkista kunkin widgetin tulos järjestelmänvalvojassa. Esimerkiksi Navigointi-widgetillä on ID-pohja nav_menuja Arkisto-widgetillä on archives.

Alla olevassa esimerkissä tarkistamme, onko widget Navigointiwidget. Jos näin ei ole, toiminto peruutetaan painamalla return. Vain navigointiwidgetit saavat mukautetun valintaruudun:

Sinun pitäisi saada asetukset adminissa seuraavasti:

Kuinka lisätä mukautettuja asetuksia olemassa olevaan widgetiin WordPressissä

Asetus on siis lisätty, mutta asetuksiasi ei tällä hetkellä tallenneta. Korjataan se.

Mukautettujen asetusten tallentaminen

Meidän on kytkeydyttävä widgetin update()toimintoon, jotta voimme päivittää mukautettuja asetuksiamme.

Tätä varten käytämme suodatinta [widget_update_callback](https://developer.wordpress.org/reference/hooks/widget_update_callback/). Asetusten tallentaminen tapahtuu täsmälleen samalla tavalla kuin kirjoittaisit widget-luokan. Suodatin tarjoaa kolme parametria; ensimmäinen on ilmentymätaulukko, joka tallennetaan. Toinen parametri on tila, joka on lähetetty widgetin tallennuksen yhteydessä, ja kolmas on vanha tila. Meidän on varmistettava, että noudetaan uudet arvomme toisesta parametrista ja lisätään ne ensimmäiseen.

Näin päivitämme valintaruudumme tilan; kuten haluamme tallentaa a truetai falsearvon:

add_filter('widget_update_callback', function($instance, $new_instance, $old_instance) { $instance['awp-custom-setting'] = isset($new_instance['awp-custom-setting']); return $instance; }, 10, 3);

Muista säätää tulojen nimet omien asetusten nimien mukaisiksi. Jos lisäät useita syötteitä, sinun on toistettava tämä jokaiselle.

Nyt sinun pitäisi nähdä, että mukautetut asetuksesi tallennetaan järjestelmänvalvojaan!

Tallennettujen mukautettujen widget-asetusten käyttäminen

Kuten aiemmin mainittiin, tämä osa riippuu todellakin siitä, mitä haluat asetuksillasi tekevän. Valitettavasti se ei ole niin suoraviivaista, koska useimmat widgetit eivät lisää suodattimia tai koukkuja ulostuloihinsa. Aloitetaan jostain yksinkertaisesta; vältä widgetin renderöimistä asetuksista riippuen.

Estä hahmontaminen widgetin mukautetusta asetuksesta riippuen

Oletetaan, että lisäät asetuksia sille, milloin widgetin pitäisi olla näkyvissä; esimerkiksi piilottamalla se tiettyihin malleihin (piilota hakutulosmallissa, mutta näytä etusivulla ja singlessä) tai reagoida muihin WordPress-tiloihin.

Tätä varten voimme käyttää suodatinta [widget_display_callback](https://developer.wordpress.org/reference/hooks/widget_display_callback/). Meidän tarvitsee vain tarkistaa asetuksellemme annettu esiintymäparametri ja palata, falsejos emme halua hahmontaa widgetiä.

Tämä yksinkertainen koodi välttää widgetin renderöinnin, jos yllä lisätty mukautettu valintaruutu on valittuna:

add_filter('widget_display_callback', function($instance, $widget, $args) { if ($instance['awp-custom-setting']) { return false; } return $instance; }, 10, 3);

Haluat todennäköisesti verrata muita valtioita. Tämä on yksinkertainen esimerkki, jossa valintaruutumme on "Piilota yksittäisten viestien näkymissä" -valintaruutu. Tarkistamme yksinkertaisesti, olemmeko tällä hetkellä jossakin yksittäisessä viestinäkymässä, [is_singular](https://developer.wordpress.org/reference/functions/is_singular/)()ja jos valintaruutu on valittuna, palaamme false.

add_filter('widget_display_callback', function($instance, $widget, $args) { if (is_singular() && $instance['awp-custom-setting']) { return false; } return $instance; }, 10, 3);

Olemassa olevan widgetin asetusten tai tulosteen muokkaaminen

Tehokas suodatin, jota voidaan käyttää leikkimiseen olemassa olevien widgetien kanssa, on [dynamic_sidebar_params](https://developer.wordpress.org/reference/hooks/dynamic_sidebar_params/). Katso dokumentaatiosivulta, mitä parametreja voit muokata. Voit esimerkiksi lisätä mukautettuja luokkia, muokata before_widget, after_widgettai before_titleja after_titleHTML-merkkijonoja. Tämä koskee kuitenkin kaikkia widgetejä, myös järjestelmänvalvojaa ja käyttöliittymää. Ja tällä suodattimella sinulla ei ole pääsyä widgetin esiintymään (tallennettuihin asetuksiin) tai widgetin asetuksiin (esim. widgetin tyyppi).

Ilmeisesti meidän on ainakin tarkistettava mukautetut asetuksemme. Joten meidän on tehtävä melkoisesti koodia saadaksemme tarvitsemamme arvot.

Ensimmäinen asia, jonka voimme tehdä, on päästä globaaliin muuttujaan $wp_registered_widgets. Tämä on joukko, joka sisältää kaikki rekisteröidyt käytettävissä olevat widgetit. Tämän rekisterin avulla voimme käyttää suodattimen parametria löytääksemme tietyn widgetin, jossa tällä hetkellä olemme. Kun olemme löytäneet nykyisen widgetin, meillä on pääsy widgetin parametreihin, kuten id_base– mikä, kuten näimme aiemmin, kertoo meille widgetin tyypin.

Kuten jonosta näet, #9voimme vihdoin tarkistaa, minkä tyyppisessä widgetissä olemme tällä hetkellä. Palaan yllä olevaan koodiin, jos widgetin tyyppi ei ole Navigointiwidget, koska mukautettu asetuksemme lisättiin vain kyseisille widgeteille.

Haetaan tallennettuja widget-asetuksia

Mutta meidän on myös noudettava tallennetut asetukset widgetiä kohden (mukaan lukien mukautettu asetus). Kaikki widgetien tallennetut asetukset tallennetaan asetustietokantaan widgetin tyypin mukaan ryhmiteltynä. Widget-rekisterin ominaisuuden avulla voimme [get_option](https://developer.wordpress.org/reference/functions/get_option/)()hakea nykyisen widget-tyypin tallennetut asetukset. Palautus on indeksoitu taulukko, jossa meidän on käytettävä vielä toista suodattimen perometriä löytääksemme nykyisen indeksin (koska voit lisätä useita samaa widget-tyyppiä samaan tai eri sivupalkkiin). Se on helpompi näyttää koodilla kuin selittää se:

Vihdoinkin saamme käsiin widgetin tallennetut asetukset! Yllä olevassa esimerkkikoodissa rivillä #9, tarkistamme, onko mukautettu valintaruutu valittu vai ei.

Esimerkkejä

Tässä vaiheessa on sinun itsestäsi kiinni, mitä haluat tehdä. Voit esimerkiksi renderöidä tulosteen widgetin otsikon jälkeen, mutta ennen widgetin sisältöä:

Todellisemmissa käyttötapauksissa ratkaisisit yleensä useimmat lisäämällä tiettyjä suodattimia tässä vaiheessa soittamalla add_filter()tässä vaiheessa.

Alla on esimerkki navigointivalikon argumenttien muokkaamisesta lisäämällä suodatin, jos asetuksemme on valittu. Jos sitä ei ole valittu, varmistamme, että suodatin on poistettu. Suodatin navigointivalikon esittämisen argumenttien muokkaamiseen on widget_nav_menu_args. Alla olevassa koodissa olen määritellyt tähän suodattimeen käytettävän funktion, joka lisää uuden argumentin valikon argumentteihin; kävelijä:

... if ($saved_settings['my-custom-thing']) { add_filter('widget_nav_menu_args', 'awp_add_menu_walker', 10, 3); } else { remove_filter('widget_nav_menu_args', 'awp_add_menu_walker', 10); } return $params; }); function awp_add_menu_walker($nav_menu_args, $nav_menu, $args) { $nav_menu_args['walker'] = new AWP_Custom_Walker(); return $nav_menu_args; }

Yllä oleva koodi on esimerkki käyttötapauksesta, jossa mukautettu valintaruutu määrittää, käytetäänkö valikkoon valikkokävelyä vai ei. Erinomainen, jos haluat kaikkien valikoiden hahmontuvan normaalisti, mutta haluat, että tietyt valikkowidgetit hahmontuvat eri tavalla. Se, mitä kävelijä tekee valikkotuloksilla, on sinun.

Katso alta täydellinen koodi mukautetun asetuksen lisäämiseksi kaikkiin navigointivalikoihin, sen päivittämiseen ja valikkokävelijän käyttöön.

Toivottavasti tämä riittää sinulle, jotta voit selvittää, kuinka koodata mitä haluat tehdä. Se riippuu todella siitä, mitä haluat tehdä ja minkä tyyppisen widgetin kanssa työskentelet. Kuten edellä mainittiin, yleensä useimmat muutokset voidaan ratkaista lisäämällä suodattimia, jotka tekevät asiasi dynamic_sidebar_params.

Täysi esimerkki: Mukautettu valintaruutuasetus navigointiwidgeteissä valikkokävelijän käyttöönottamiseksi

Tässä on täydellinen koodi mukautetun valintaruudun lisäämiseksi kaikkiin WordPressin navigointivalikkowidgetteihin rekisteröityä valikon kävelijää varten. (Walker koodi ei sisälly)

Johtopäätös

Toivottavasti tämä viesti on auttanut joko ratkaisemaan tarpeitasi tai antamaan sinulle ohjeita siitä, miten voit tehdä sen, mitä sinun on tehtävä!

Tämä verkkosivusto käyttää evästeitä parantaakseen käyttökokemustasi. Oletamme, että olet kunnossa, mutta voit halutessasi kieltäytyä. Hyväksyä Lisätietoja