✅ WEB- och WordPress -nyheter, teman, plugins. Här delar vi tips och bästa webbplatslösningar.

Hur man lägger till anpassade inställningar till en befintlig widget i WordPress

4

I det här inlägget kommer vi att lära oss hur du lägger till din anpassade HTML och inställningar till någon av WordPresss standardwidgets eller andra. Genom att använda dessa inställningar kommer vi att lära oss olika knep för att manipulera widgetarnas beteende därefter.

Den första delen; att lägga till och spara dina anpassade inställningar är ganska enkelt. Den andra delen beror på vad du specifikt vill göra, och det beror på vilken widget du manipulerar. I det här inlägget har jag tagit med två exempel; hoppa över en widget beroende på en inställning (för att lägga till inställningar för att kontrollera widgetens synlighet i vissa fall), och manipulera WordPress Navigation-widgetens menyargument. Exemplet som ges för den andra delen borde ge dig en bra ledtråd i hur du kan hantera det du vill göra.

Lägga till anpassade inställningar till valfri widget

För att lägga till anpassade inställningar till befintliga widgets använder vi en åtgärd som heter [in_widget_form](https://developer.wordpress.org/reference/hooks/in_widget_form/). Den här åtgärden tillämpas på alla widgets form()funktion, vilket är den funktion som ansvarar för att rendera administratörsdelen av widgeten.

Med det filtret får vi tre parametrar men vi är egentligen bara intresserade av den första och den tredje. Den första är widgetinstansen som vi kommer att använda för att hämta korrekta fältnamn och ID:n och (valfritt) kontrollera vilken typ av widget vi är anslutna till. Den tredje parametern är en uppsättning av widgetens sparade inställningar, som vi måste använda för att kontrollera det tidigare sparade tillståndet för våra inställningar.

Koden nedan kommer att lägga till en kryssruta med inställningsnamnet ‘ awp-custom-setting‘. Justera namnet och HTML-koden till vilken input du behöver. Det som är viktigt är att använda $widget->get_field_name()för att lägga till korrekta ID:n och nameattribut till alla dina indata. Värdet på dina inmatningar ska fyllas i med det som har sparats tidigare, och det är något du hittar i parametern $instance. För kryssrutor kan du använda WordPress-funktionen [checked](https://developer.wordpress.org/reference/functions/checked/)()för att mata ut det markerade attributet.

Efter att ha lagt till detta i ditt tema functions.phpeller plugin-kod, bör alla widgets nu få en kryssruta i slutet av formuläret i admin.

Rikta in specifika widgets

Om du bara vill tillämpa dina inställningar på en eller några specifika widgets kan du jämföra egenskapen id_basei $widgetobjektet. Du måste veta bas-ID:t är – om du är osäker gör du helt enkelt en var_dump($widget->id_base)insida i kroken, sparar och kontrollerar utdata för varje widget i admin. Till exempel har navigeringswidgeten ID-basen nav_menuoch arkivwidgeten har archives.

I exemplet nedan kontrollerar vi om widgeten är en navigationswidget. Om den inte är det avbryts funktionen med en return. Endast navigationswidgetar får den anpassade kryssrutan:

Du bör få inställningen i admin så här:

Hur man lägger till anpassade inställningar till en befintlig widget i WordPress

Så inställningen har lagts till, men för tillfället sparas inte dina inställningar. Låt oss fixa det.

Sparar dina anpassade inställningar

Vi måste koppla in widgetens update()funktion för att uppdatera våra anpassade inställningar.

För detta använder vi filtret [widget_update_callback](https://developer.wordpress.org/reference/hooks/widget_update_callback/). Processen att spara våra inställningar är precis som du skulle göra när du skriver en widgetklass. Filtret tillhandahåller tre parametrar; den första är instansarrayen som kommer att sparas. Den andra parametern är tillståndet som har lagts upp när widgeten sparades, och den tredje är det gamla tillståndet. Vi måste se till att hämta våra nya värden från den andra parametern och lägga till dem i den första.

Så här skulle vi uppdatera statusen för vår kryssruta; som vi vill spara ett trueeller falsevärde:

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);

Kom ihåg att justera ingångsnamnen till dina egna inställningsnamn. Om du lägger till flera ingångar måste du upprepa detta för varje.

Nu bör du se att dina anpassade inställningar sparas i admin!

Använder sparade anpassade widgetinställningar

Som nämnts tidigare beror denna del verkligen på vad du vill att dina inställningar ska göra. Det är tyvärr inte lika enkelt eftersom de flesta widgets inte lägger till filter eller krokar i sina utgångar. Låt oss börja med något enkelt; undvik att rendera widgeten beroende på inställningarna.

Förhindra renderingswidget beroende på anpassad inställning

Säg att du lägger till inställningar för när widgeten ska vara synlig; till exempel att gömma det i vissa mallar (göm i sökresultatmallen, men visa på framsidan och singel), eller reagera på andra WordPress-tillstånd.

För detta kan vi använda filtret [widget_display_callback](https://developer.wordpress.org/reference/hooks/widget_display_callback/). Allt vi behöver göra är att kontrollera den angivna instansparametern för vår inställning och återvända falseom vi inte vill rendera widgeten.

Den här enkla koden kommer att undvika att widgeten renderas om den anpassade kryssrutan som vi lade till ovan är markerad:

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

Du vill förmodligen jämföra andra stater. Det här är ett enkelt exempel där vår kryssruta är en kryssruta för "Göm i enstaka inläggsvyer". Vi kontrollerar helt enkelt om vi för närvarande är på en enskild inläggsvy med [is_singular](https://developer.wordpress.org/reference/functions/is_singular/)()och om kryssrutan är markerad återkommer vi false.

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

Ändra befintliga widgets inställningar eller utdata

Ett kraftfullt filter att använda för att leka med befintliga widgets är [dynamic_sidebar_params](https://developer.wordpress.org/reference/hooks/dynamic_sidebar_params/). Ta en titt på dokumentationssidan för att se vilka parametrar du kan ändra. Du kan till exempel lägga till anpassade klasser, du kan ändra before_widget, after_widgeteller HTML before_titleafter_titlesträngarna. Detta gäller dock alla widgets, även admin och frontend. Och med detta filter har du inte tillgång till widgetens instans (sparade inställningar) eller widgetinställningar (t.ex. typ av widget).

Självklart måste vi åtminstone kontrollera våra anpassade inställningar. Så vi måste göra en hel del kod för att hämta de värden vi behöver.

Det första vi kan göra är att komma åt en global variabel $wp_registered_widgets. Detta är en array som innehåller alla registrerade, tillgängliga widgets. Genom att använda det registret kan vi använda filtrets parameter för att hitta den specifika widgeten vi för närvarande befinner oss på. När vi har hittat den aktuella widgeten har vi tillgång till widgetparametrarna, såsom id_base– som som vi såg tidigare talar om för oss vilken typ av widget.

Som du kan se i rad #9kan vi äntligen kontrollera vilken typ av widget vi befinner oss på för närvarande. I koden ovan återkommer jag om widgettypen inte är en navigationswidget eftersom vår anpassade inställning endast lades till för dessa widgetar.

Hämtar sparade widgetinställningar

Men vi måste också hämta de sparade inställningarna per widget (inklusive vår anpassade inställning). Alla widgets sparade inställningar lagras i alternativdatabasen grupperade efter typ av widget. Med hjälp av en egenskap i widgetregistret kan vi använda [get_option](https://developer.wordpress.org/reference/functions/get_option/)()för att hämta de sparade inställningarna för den aktuella widgettypen. Returen kommer att vara en indexerad array där vi behöver använda ytterligare en perameter från filtret för att hitta det aktuella indexet (eftersom du kan lägga till flera av samma widgettyp i samma eller olika sidofält). Det är lättare att visa med kod än att förklara det:

Äntligen får vi tag på widgetens sparade inställningar! I exempelkoden ovan, på rad #9, kontrollerar vi om vår anpassade kryssruta är markerad eller inte.

Exempel

Vid det här laget är det upp till dig vad du vill göra. Du kan till exempel rendera en utdata efter widgettitel, men före widgetinnehåll:

För mer verkliga användningsfall skulle du normalt lösa det mesta genom att lägga till vissa filter vid denna tidpunkt, genom att anropa add_filter()vid denna tidpunkt.

Nedan är ett exempel på hur du ändrar navigeringsmenyns argument genom att lägga till ett filter om vår inställning var markerad. Om det var avmarkerat ser vi till att filtret tas bort. Filtret för att ändra argumenten för att rendera en navigeringsmeny är widget_nav_menu_args. I koden nedan har jag definierat en funktion för detta filter som lägger till ett nytt argument till menyargumenten; en rullator:

... 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; }

Koden ovan är ett exempel på ett användningsfall där den anpassade kryssrutan styr huruvida en menyrullare ska tillämpas på menyn eller inte. Utmärkt om du vill att alla menyer ska renderas normalt men vill att alternativet för specifika menywidgets ska renderas annorlunda. Vad rollatorn gör med menyutgången är upp till dig.

Se nedan för den fullständiga koden för att lägga till en anpassad inställning till alla navigeringsmenyer, uppdatera den och använda en menypassare.

Förhoppningsvis räcker detta för att du ska komma på hur du kodar det du vill göra. Det beror verkligen på vad du vill göra och vilken typ av widget du arbetar med. Som nämnts ovan brukar de flesta av ändringarna lösas genom att lägga till filter för att göra din grej i dynamic_sidebar_params.

Fullständigt exempel: Anpassad kryssruteinställning på Navigationswidgets för att använda en menypassare

Här är den fullständiga koden för att lägga till en anpassad kryssruta till alla WordPresss navigeringsmenywidgetar för att använda en registrerad menyrullare. (Walkerkod ingår ej)

Slutsats

Förhoppningsvis har det här inlägget varit till hjälp för att antingen lösa dina behov eller ge dig några tips om hur du kan gå tillväga för att göra det du behöver göra!

Inspelningskälla: awhitepixel.com

Denna webbplats använder cookies för att förbättra din upplevelse. Vi antar att du är ok med detta, men du kan välja bort det om du vill. Jag accepterar Fler detaljer