WordPress-widgets: Refactoring, del 10
När det gäller refaktoreringen av WordPress Widget Boilerplate är vi på en bra plats. Mycket arbete har gjorts så att det borde vara mycket lättare att introducera nya klasser, funktioner och funktioner.
Och inte nog med det: Det borde vara lättare att följa.
Tack vare arbetet i förra inlägget har vi mycket arbete att bygga vidare på – nämligen ett grundläggande administrativt gränssnitt.
Till sist stod det i förra inlägget:
Under de kommande artiklarna kommer detta att fortsätta att utvecklas, men som du kan se ser vi till att vi har en enda basklass av funktionalitet för att prata med WordPress och en klass specifikt för att rendera den administrativa formen.
Och det är där vi ska ta upp i den här artikeln. Specifikt kommer vi att titta på sanering och serialisering av data samt att hämta data som sparats i widgeten.
WordPress Widget Boilerplate: Refactoring del 10
Refaktorering av användargränssnittet
Innan vi går in på serialisering, finns det en del mindre arbete som vi kommer att behöva göra för vår administrativa syn. Minns från tidigare inlägg i serien att vi har byggt ett formulär som accepterar:
- En titel,
- lite innehåll,
- och en kryssruta.
Detta visas bra, men det utesluter vissa nyckelfunktioner i Widgets API. Vi måste nämligen se till att vi namnger våra element korrekt med hjälp av följande funktioner:
Och sedan kommer vi att skriva vår funktion som helt enkelt heter get som jag kommer att förklara ett ögonblick.
Funktionerna ovan är nödvändiga eftersom det hjälper WordPress att hålla reda på hur många instanser av widgeten som används och vilken användaren redigerar. Vi får med andra ord mycket funktionalitet gratis.
Innan jag visar dig koden vill jag kort diskutera syftet med get – funktionen som vi ska introducera. Kort sagt, det är ett sätt för oss att skicka en nyckel (som i nyckeln i ett nyckel/värdepar) till en funktion och sedan få den enkelt att hämta ett värde åt oss så att det håller vårt gränssnitt så rent som möjligt.
Så först, get-metoden :
<?php
/**
* If the value for the key exists in the current instance of the widget, then it will
* retrieve it. Otherwise, it will return an empty value.
*
* @param string $key the used to identify the value of the widget.
* @param array $instance the options for the instance of this widget
*/
protected function get($key, $instance)
{
return empty($instance[$key])? '': $instance[$key];
}Det viktiga att notera är att den här metoden inte bara accepterar nyckeln för värdet vi läser utan en array som refererar till instansen av arrayen.
Och nu, det omstrukturerade användargränssnittet :
<?php
/*
* This file is part of WordPress Widget Boilerplate
* (c) Tom McFarlin <tom@tommcfarlin.com>
*
* This source file is subject to the GPL license that is bundled
* with this source code in the file LICENSE.
*/
?>
<div class="widget-content">
<p>
<input
type="text"
id="<?php echo esc_attr($this->get_field_id('title')); ?>"
name="<?php echo esc_attr($this->get_field_name('title')); ?>"
value="<?php echo $this->get('title', $instance) ?>"
placeholder="Widget Title"
class="widefat"
/>
</p>
<p>
<textarea
id="<?php echo esc_attr($this->get_field_id('content')); ?>"
name="<?php echo esc_attr($this->get_field_name('content')); ?>"
placeholder="Widget Content"
style="width:100%;"><?php echo $this->get('content', $instance) ?></textarea>
</p>
<p>
<input
type="checkbox"
value="on"
name="<?php echo esc_attr($this->get_field_name('display-title')); ?>"
id="<?php echo esc_attr($this->get_field_id('display-title')); ?>"
<?php checked('on', $this->get('display-title', $instance), true); ?>
class="checkbox"
/>
<label for="<?php echo esc_attr($this->get_field_id('display-title')); ?>">Display Title?</label>
</p>
</div><!-- .widget-content -->
Men detta lämnar fortfarande funktionalitet bristande och det lämnar arbete för oss att göra. Vi måste nämligen sanera data och skicka tillbaka den till WordPress, så att den sparar data.
Sanering och serialisering
För vårt exempel kommer vi att vara väldigt strikta i vad vi tillåter. Vi kommer nämligen bara att stödja grundläggande text, och vi kommer att ta bort allt aggressivt.
Det betyder att vi inte kommer att tillåta uppmärkning eller något liknande. Istället ska vi ta bort allt som inte är grundläggande text. Vi kan dekorera den lite när det är dags att visa den på fronten, men vi lämnar det tills lämpligt inlägg.
För att göra detta kommer vi att använda följande funktioner:
Kom ihåg att vi har två fält i vår widget – titelfältet och innehållsfältet. Beroende på vilken typ av widget du bygger, kanske du bara behöver en enda klass eller funktion för att rensa data. I andra situationer kan du behöva något mer komplext.
Tänk på det när vi går igenom den här koden eftersom detta inte kommer att vara en lösning som passar alla. Istället kommer det att vara specifikt för detta.
Hur som helst, för att rensa data, kommer vi att skriva en klass specifikt för detta ändamål, och sedan gör vi den tillgänglig för vår WidgetAdmin-klass.
Här är klassen i sin helhet med en beskrivning som följer:
<?php
/*
* This file is part of WordPress Widget Boilerplate
* (c) Tom McFarlin <tom@tommcfarlin.com>
*
* This source file is subject to the GPL license that is bundled
* with this source code in the file LICENSE.
*/
namespace WordPressWidgetBoilerplateWordPress;
/**
* Santiizes and saves the data for the widget.
*/
class WidgetSerializer
{
/**
* Updates the values of the widget. Sanitizes the information before saving it.
*
* @param array $newInstance the array of new options to save
*/
public function update($newInstance)
{
$instance = [];
foreach ($newInstance as $key => $value) {
$instance[$key] = strip_tags(
stripslashes($value)
);
}
return $instance;
}
}
Klassen ska vara rakt fram. Den tar in widgetens inkommande värden, rensar dem och returnerar sedan en ny array som ska lämnas tillbaka till WordPress.
Det finns dock en hake. Den här klassen måste vara en egenskap för den huvudsakliga widgetklassen som visades i förra inlägget.
För det andra är uppdateringsmetoden som är en del av Widgets API det som kommer att anropa den här klassen. Det är inte nödvändigt att skicka variabeln $oldInstance till serializern men det krävs för uppdateringsmetoden.
Här är widgetklassen som den är byggd för närvarande :
<?php
/*
* This file is part of WordPress Widget Boilerplate
* (c) Tom McFarlin <tom@tommcfarlin.com>
*
* This source file is subject to the GPL license that is bundled
* with this source code in the file LICENSE.
*/
namespace WordPressWidgetBoilerplateWordPress;
use WP_Widget;
class Widget extends WP_Widget
{
/**
* @var string unique identifier for your widget
*/
protected $widgetSlug;
/**
* Initializes the plugin by setting its properties and calling the parent class with the description.
*
* @param string $widgetSlug unique identifier for your widget
* @param WidgetSerializer $widgetSerializer the class responsible for saving widget options
*/
public function __construct($widgetSlug)
{
$this->widgetSlug = $widgetSlug;
parent::__construct(
$this->getWidgetSlug(),
__('Widget Name', $this->getWidgetSlug()),
[
'classname' => $this->getWidgetSlug().'-class',
'description' => __('Short description of the widget goes here.', $this->getWidgetSlug()),
]
);
}
/**
* Return the widget slug.
*
* @return string slug variable
*/
public function getWidgetSlug()
{
return $this->widgetSlug;
}
/**
* Displays the administrative view of the form and includes the options
* for the instance of the widget as arguments passed into the function.
*
* @param array $instance the options for the instance of this widget
*/
public function form($instance)
{
include plugin_dir_path(__FILE__).'Views/Admin.php';
}
/**
* Updates the values of the widget. Uses the serialization class to sanitize the
* information before saving it.
*
* @param array $newInstance the values to be sanitized and saved
* @param array $oldInstance the values that were originally saved
*/
public function update($newInstance, $oldInstance)
{
return $this->widgetSerializer->update($newInstance, $oldInstance);
}
/**
* If the value for the key exists in the current instance of the widget, then it will
* retrieve it. Otherwise, it will return an empty value.
*
* @param string $key the used to identify the value of the widget
* @param array $instance the options for the instance of this widget
*/
protected function get($key, $instance)
{
return empty($instance[$key])? '': $instance[$key];
}
}
Men om du uppdaterar sidan kanske du märker att saneringen och serialiseringen inte verkar fungera när du hämtar data. Och det är vad vi ska titta på i nästa inlägg.
Hämtar data
Observera att även om funktionaliteten verkar ofullständig för detta (eftersom den osaniserade data fortfarande visas), är vi fokuserade på att se till att vi skriver klasser med sammanhållning, ansvar och som inte är tätt kopplade.
Vi kommer att upprepa detta lite mer i nästa inlägg. Så studera koden ovan, implementera den om det är vad du har gjort, så går vi därifrån i nästa inlägg.