{"id":233830,"date":"2023-02-23T19:50:00","date_gmt":"2023-02-23T16:50:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=233830"},"modified":"2022-11-11T12:41:05","modified_gmt":"2022-11-11T09:41:05","slug":"samouczek-utworz-widzet-mikrodanych-dla-swojej-firmy-w-wordpress","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/pl\/samouczek-utworz-widzet-mikrodanych-dla-swojej-firmy-w-wordpress\/","title":{"rendered":"Samouczek: Utw\u00f3rz wid\u017cet mikrodanych dla swojej firmy w WordPress"},"content":{"rendered":"\n<p>W tym samouczku dowiemy si\u0119, jak utworzy\u0107 niestandardowy wid\u017cet, kt\u00f3ry wy\u015bwietla informacje o Twojej firmie, takie jak oficjalna nazwa, adres, numer telefonu i adres e-mail. P\u00f3jdziemy jednak o krok dalej, wysy\u0142aj\u0105c go za pomoc\u0105 <a href=\"https:\/\/schema.org\/docs\/gs.html\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">mikrodanych<\/a> lub znacznik\u00f3w schematu, kt\u00f3re umo\u017cliwi\u0105 wyszukiwarkom zrozumienie tre\u015bci.<\/p>\n<p>Wid\u017cety to dynamiczne bloki, kt\u00f3re mo\u017cna umie\u015bci\u0107 w dost\u0119pnych obszarach motywu. Zwykle motyw zawiera co najmniej jeden pasek boczny i co najmniej jeden obszar w stopce. Umieszczanie informacji o firmie jako wid\u017cetu w stopce jest powszechne i do\u015b\u0107 inteligentne \u2013 poniewa\u017c stopka pojawia si\u0119 na wszystkich stronach w Twojej witrynie.<\/p>\n<p>Mikrodane to dodatkowe atrybuty HTML, kt\u00f3re wyja\u015bniaj\u0105, co zawiera konkretny znacznik HTML, aby maszyna mog\u0142a zrozumie\u0107, czym one s\u0105 (np. nazwa firmy, numer telefonu, adres firmy, firmowy adres e-mail itp.). Umo\u017cliwia to wyszukiwarkom takim jak Google wyodr\u0119bnianie informacji o Twojej firmie z kodu HTML.<\/p>\n<h2>Co stworzymy<\/h2>\n<p>Nasz widget wygeneruje informacje za pomoc\u0105 schematu <a href=\"https:\/\/schema.org\/LocalBusiness\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Microdata LocalBusiness<\/a>, kt\u00f3ry jest idealny dla organizacji lub firmy. Od Ciebie zale\u017cy, jakie w\u0142a\u015bciwo\u015bci chcesz wyprowadzi\u0107, po prostu kliknij powy\u017cszy link, aby przeczyta\u0107 wszystkie mo\u017cliwe w\u0142a\u015bciwo\u015bci w LocalBusiness (w tym odziedziczone). Twoja firma lub kraj mog\u0105 preferowa\u0107 inny rodzaj informacji.<\/p>\n<p>Wid\u017cet tego samouczka wy\u015bwietli nast\u0119puj\u0105ce opcjonalne informacje:<\/p>\n<ul>\n<li>Nazwa firmy (w\u0142a\u015bciwo\u015b\u0107 mikrodanych: <code>legalName<\/code>)<\/li>\n<li>Numer identyfikacyjny VAT lub numer organizacji (w\u0142a\u015bciwo\u015b\u0107 mikrodanych: <code>vatID<\/code>)<\/li>\n<li>Adres pocztowy (znacznik Microdata: <code>PostalAddress<\/code>z w\u0142a\u015bciwo\u015bciami dla <code>streetAddress<\/code>, <code>postalCode<\/code>, i <code>addressLocality<\/code>)<\/li>\n<li>Adres e-mail firmy (w\u0142a\u015bciwo\u015b\u0107 Microdata: <code>email<\/code>)<\/li>\n<li>Numer telefonu (w\u0142a\u015bciwo\u015b\u0107 mikrodanych: <code>telephone<\/code>)<\/li>\n<\/ul>\n<p>Ten samouczek nie poprowadzi Ci\u0119 przez stylizacj\u0119 wid\u017cetu, poniewa\u017c powinno to by\u0107 ca\u0142kiem proste. We frontendzie nasz widget b\u0119dzie wygl\u0105da\u0142 jak zwyk\u0142y widget tekstowy. Ale oczywi\u015bcie pod mask\u0105 ma znaczniki schematu, kt\u00f3re pomagaj\u0105 Google.<\/p>\n<h2>Podstawy tworzenia niestandardowego wid\u017cetu<\/h2>\n<p>Mo\u017cesz umie\u015bci\u0107 sw\u00f3j kod w motywie <code>functions.php<\/code>lub utworzy\u0107 niestandardow\u0105 wtyczk\u0119. Pami\u0119taj tylko, \u017ce je\u015bli trzymasz go we wtyczce, utracisz wid\u017cet podczas dezaktywacji wtyczki; podobnie trzymanie go w motywie spowoduje utrat\u0119 wid\u017cetu, je\u015bli prze\u0142\u0105czysz si\u0119 na inny motyw. W tym przyk\u0142adzie dodam kod w motywie <code>functions.php<\/code>.<\/p>\n<p>Tworzenie widgetu odbywa si\u0119 za pomoc\u0105 zorientowanego obiektowo kodu PHP. Piszesz klas\u0119 PHP, kt\u00f3ra rozszerza klas\u0119 wid\u017cet\u00f3w WordPressa i inicjujesz j\u0105, wywo\u0142uj\u0105c <code>register_widget()<\/code>i podaj\u0105c nazw\u0119 swojej klasy. W tym samouczku nazwa\u0142em moj\u0105 klas\u0119 wid\u017cet\u00f3w <code>LocalBusiness<\/code>.<\/p>\n<p>Zacznijmy od wywo\u0142ania <code>register_widget()<\/code>wewn\u0105trz funkcji podpi\u0119tej do akcji <code>widgets_init<\/code>.<\/p>\n<pre><code>add_action('widgets_init', function() {\n    register_widget('LocalBusiness');\n});<\/code><\/pre>\n<p>Przyjrzyjmy si\u0119 szybko szkieletowi niestandardowej klasy wid\u017cet\u00f3w:<\/p>\n<pre><code>class LocalBusiness extends WP_Widget {\n\u00a0\n    \/\/ Initialize your widget in the class constructor\n    public function __construct() { }\n\u00a0\n    \/\/ Responsible for outputting the widget in frontend\n    public function widget($args, $instance) { }\n\u00a0\n    \/\/ Responsible for outputting the widget settings in admin\n    public function form($instance) { }\n\u00a0\n    \/\/ Responsible for saving settings in admin\n    public function update($new_instance, $old_instance) { }\n}<\/code><\/pre>\n<p>Jak wida\u0107 z g\u00f3ry, b\u0119dziesz potrzebowa\u0107 czterech funkcji w swojej klasie. Przejrzyjmy kolejno ka\u017cd\u0105 funkcj\u0119 i wype\u0142nijmy je.<\/p>\n<h2>Tworzenie wid\u017cetu mikrodanych LocalBusiness<\/h2>\n<p>Najbardziej logicznym miejscem do rozpocz\u0119cia jest konstruktor, kt\u00f3ry odpowiada za ustawienie wid\u017cetu.<\/p>\n<h3>Funkcja __construct()<\/h3>\n<p>Wewn\u0105trz konstruktora musisz ustawi\u0107 kilka zmiennych, takich jak nazwa wid\u017cetu, i wywo\u0142a\u0107 funkcj\u0119 konstruktora rodzica (klasa rodzica to ta, kt\u00f3r\u0105 rozszerzasz; <code>WP_Widget<\/code>). Przeczytaj wi\u0119cej o <a href=\"https:\/\/developer.wordpress.org\/reference\/classes\/wp_widget\/__construct\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">mo\u017cliwych opcjach w konstruktorze tutaj<\/a>. Dostarcz\u0119 podstawowy identyfikator, tytu\u0142 i opis, jak na przyk\u0142ad:<\/p>\n<pre><code>\/\/ Initialize your widget in the class constructor\npublic function __construct() {\n    $widget_ops = [\n        'description' =&gt; __('Outputs business information with Microdata', 'txtdomain')\n    ];\n    parent::__construct('local_business', __('Local Business Information', 'txtdomain'), $widget_ops);\n}<\/code><\/pre>\n<p>Mo\u017cesz zrobi\u0107 wi\u0119cej w <code>__construct<\/code>metodzie, na przyk\u0142ad kolejkowa\u0107 skrypty lub zdefiniowa\u0107 wi\u0119cej ustawie\u0144 wid\u017cet\u00f3w. Ale w wi\u0119kszo\u015bci przypadk\u00f3w powy\u017csze jest wystarczaj\u0105ce.<\/p>\n<h3>Funkcja form()<\/h3>\n<p>Nast\u0119pnym krokiem jest zbudowanie wszystkich ustawie\u0144 i danych wej\u015bciowych, kt\u00f3re Tw\u00f3j wid\u017cet akceptuje w admin. Do wyprowadzania ustawie\u0144 do administratora Widget u\u017cywamy funkcji, <code>form()<\/code>kt\u00f3ra daje jeden parametr; tablica, kt\u00f3ra zawiera wszystkie prawdopodobnie zapisane opcje wid\u017cet\u00f3w. Wa\u017cne jest, aby wyprowadzi\u0107 odpowiednie zapisane ustawienie we wszystkich wej\u015bciach, aby dane zosta\u0142y zachowane. (Przyjrzymy si\u0119, jak zapisa\u0107 ustawienia w nast\u0119pnym kroku).<\/p>\n<p>W funkcji formularza jest wiele rzeczy do \u015bledzenia, wi\u0119c najpierw dodajmy tylko jedno dane wej\u015bciowe dla oficjalnej nazwy i upewnijmy si\u0119, \u017ce rozumiemy, co musimy zrobi\u0107:<\/p>\n<pre><code>\/\/ Responsible for outputting the widget settings in admin\npublic function form($instance) { \n    ?&gt;\n    &lt;p&gt;\n        &lt;label for=\"&lt;?php echo $this-&gt;get_field_id('legal_name'); ?&gt;\"&gt;&lt;?php _e('Legal name:', 'txtdomain'); ?&gt;&lt;\/label&gt;\n        &lt;input \n            type=\"text\" \n            class=\"widefat\" \n            id=\"&lt;?php echo esc_attr($this-&gt;get_field_id('legal_name')); ?&gt;\"\n            name=\"&lt;?php echo esc_attr($this-&gt;get_field_name('legal_name')); ?&gt;\"\n            value=\"&lt;?php echo esc_attr($instance['legal_name']); ?&gt;\"\n        \/&gt;\n    &lt;\/p&gt;\n    &lt;?php\n}<\/code><\/pre>\n<p>Przede wszystkim powy\u017cszy kod wyprowadza niekt\u00f3re wrappery i klasy HTML w formie, w kt\u00f3rej WordPress wyprowadza ich formularze wid\u017cet\u00f3w \u2013 robimy to, aby formularz wygl\u0105da\u0142 \u0142adnie.<\/p>\n<p>Istniej\u0105 dwie funkcje, z kt\u00f3rymi musisz si\u0119 zapozna\u0107; <code>get_field_id()<\/code>i <code>get_field_name()<\/code>oba s\u0105 funkcjami wewn\u0105trz <code>WP_Widget<\/code>(dlatego wywo\u0142ujesz \u201e <code>$this-&gt;<\/code>&quot; z przodu \u2013 podczas gdy <code>$this<\/code>odnosi si\u0119 do instancji klasy). Funkcje zwracaj\u0105 odpowiednio identyfikator i nazw\u0119 dostarczonego pola do u\u017cycia w danych wej\u015bciowych <code>id<\/code>i <code>name<\/code>atrybutach. To bardzo wa\u017cne aby nie zapomnie\u0107 o dodaniu <code>name<\/code>atrybutu do danych wej\u015bciowych, w przeciwnym razie nigdy nie zdob\u0119dziesz jego warto\u015bci podczas zapisywania.<\/p>\n<p>I na koniec wypisujemy bie\u017c\u0105c\u0105 zapisan\u0105 warto\u015b\u0107 jako <code>value<\/code>nasze dane wej\u015bciowe, odwo\u0142uj\u0105c si\u0119 do przekazanego argumentu <code>$instance<\/code>. Bez robienia tego dla twojej warto\u015bci, dane wej\u015bciowe nigdy nie zostan\u0105 wype\u0142nione tym, co jest zapisane w bazie danych i za ka\u017cdym razem b\u0119d\u0105 wy\u015bwietlane puste, co mo\u017ce zmyli\u0107 u\u017cytkownik\u00f3w.<\/p>\n<p>Je\u015bli potrzebujesz r\u00f3\u017cnych danych wej\u015bciowych formularza, takich jak pola wyboru lub listy rozwijane, powiniene\u015b mie\u0107 mo\u017cliwo\u015b\u0107 \u0142atwego ich dodania zgodnie z powy\u017cszymi zasadami. Dodajmy reszt\u0119 naszych ustawie\u0144 wid\u017cet\u00f3w. Wszystkie s\u0105 danymi wej\u015bciowymi tekstowymi, wi\u0119c powt\u00f3rzono ten sam kod, co powy\u017cej, z wyj\u0105tkiem ich identyfikator\u00f3w p\u00f3l. Nasza <code>form()<\/code>metoda wygl\u0105da tak:<\/p>\n<pre><code>\/\/ Responsible for outputting the widget settings in admin\npublic function form($instance) { \n    ?&gt;\n    &lt;p&gt;\n        &lt;label for=\"&lt;?php echo $this-&gt;get_field_id('legal_name'); ?&gt;\"&gt;&lt;?php _e('Legal name:', 'txtdomain'); ?&gt;&lt;\/label&gt;\n        &lt;input type=\"text\" class=\"widefat\" id=\"&lt;?php echo esc_attr($this-&gt;get_field_id('legal_name')); ?&gt;\" name=\"&lt;?php echo esc_attr($this-&gt;get_field_name('legal_name')); ?&gt;\" value=\"&lt;?php echo esc_attr($instance['legal_name']); ?&gt;\" \/&gt;\n    &lt;\/p&gt;\n    &lt;p&gt;\n        &lt;label for=\"&lt;?php echo $this-&gt;get_field_id('vat_id'); ?&gt;\"&gt;&lt;?php _e('Vat ID\/Organization number:', 'txtdomain'); ?&gt;&lt;\/label&gt;\n        &lt;input type=\"text\" class=\"widefat\" id=\"&lt;?php echo esc_attr($this-&gt;get_field_id('vat_id')); ?&gt;\" name=\"&lt;?php echo esc_attr($this-&gt;get_field_name('vat_id')); ?&gt;\" value=\"&lt;?php echo esc_attr($instance['vat_id']); ?&gt;\" \/&gt;\n    &lt;\/p&gt;\n    &lt;p&gt;\n        &lt;label for=\"&lt;?php echo $this-&gt;get_field_id('street_address'); ?&gt;\"&gt;&lt;?php _e('Street address:', 'txtdomain'); ?&gt;&lt;\/label&gt;\n        &lt;input type=\"text\" class=\"widefat\" id=\"&lt;?php echo esc_attr($this-&gt;get_field_id('street_address')); ?&gt;\" name=\"&lt;?php echo esc_attr($this-&gt;get_field_name('street_address')); ?&gt;\" value=\"&lt;?php echo esc_attr($instance['street_address']); ?&gt;\" \/&gt;\n    &lt;\/p&gt;\n    &lt;p&gt;\n        &lt;label for=\"&lt;?php echo $this-&gt;get_field_id('postal_code'); ?&gt;\"&gt;&lt;?php _e('Postal code:', 'txtdomain'); ?&gt;&lt;\/label&gt;\n        &lt;input type=\"text\" class=\"widefat\" id=\"&lt;?php echo esc_attr($this-&gt;get_field_id('postal_code')); ?&gt;\" name=\"&lt;?php echo esc_attr($this-&gt;get_field_name('postal_code')); ?&gt;\" value=\"&lt;?php echo esc_attr($instance['postal_code']); ?&gt;\" \/&gt;\n    &lt;\/p&gt;\n    &lt;p&gt;\n        &lt;label for=\"&lt;?php echo $this-&gt;get_field_id('postal_city'); ?&gt;\"&gt;&lt;?php _e('City:', 'txtdomain'); ?&gt;&lt;\/label&gt;\n        &lt;input type=\"text\" class=\"widefat\" id=\"&lt;?php echo esc_attr($this-&gt;get_field_id('postal_city')); ?&gt;\" name=\"&lt;?php echo esc_attr($this-&gt;get_field_name('postal_city')); ?&gt;\" value=\"&lt;?php echo esc_attr($instance['postal_city']); ?&gt;\" \/&gt;\n    &lt;\/p&gt;\n    &lt;p&gt;\n        &lt;label for=\"&lt;?php echo $this-&gt;get_field_id('email_address'); ?&gt;\"&gt;&lt;?php _e('E-mail address:', 'txtdomain'); ?&gt;&lt;\/label&gt;\n        &lt;input type=\"text\" class=\"widefat\" id=\"&lt;?php echo esc_attr($this-&gt;get_field_id('email_address')); ?&gt;\" name=\"&lt;?php echo esc_attr($this-&gt;get_field_name('email_address')); ?&gt;\" value=\"&lt;?php echo esc_attr($instance['email_address']); ?&gt;\" \/&gt;\n    &lt;\/p&gt;\n    &lt;p&gt;\n        &lt;label for=\"&lt;?php echo $this-&gt;get_field_id('phone_number'); ?&gt;\"&gt;&lt;?php _e('Phone number:', 'txtdomain'); ?&gt;&lt;\/label&gt;\n        &lt;input type=\"text\" class=\"widefat\" id=\"&lt;?php echo esc_attr($this-&gt;get_field_id('phone_number')); ?&gt;\" name=\"&lt;?php echo esc_attr($this-&gt;get_field_name('phone_number')); ?&gt;\" value=\"&lt;?php echo esc_attr($instance['phone_number']); ?&gt;\" \/&gt;\n    &lt;\/p&gt;\n    &lt;?php\n}<\/code><\/pre>\n<p>Je\u015bli dodasz wid\u017cet do dost\u0119pnego obszaru wid\u017cet\u00f3w, powinien on wygl\u0105da\u0107 tak:<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-152019-61e4d2d64b664.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-152019-61e4d2d64b664.png\" alt=\"Samouczek: Utw\u00f3rz wid\u017cet mikrodanych dla swojej firmy w WordPress\" ><\/a><\/p>\n<h3>Funkcja update()<\/h3>\n<p>Funkcja <code>update()<\/code>jest odpowiedzialna za faktyczne zapisywanie wprowadzonych warto\u015bci w admin. Niestety WordPress nie robi tego automatycznie za Ciebie. W tej funkcji podane s\u0105 dwa parametry; zwykle o nazwie <code>$new_instance<\/code>i <code>$old_instance<\/code>. Wewn\u0105trz pierwszego parametru, <code>$new_instance<\/code>, znajdziesz wszystkie warto\u015bci, kt\u00f3re zosta\u0142y przes\u0142ane, a w drugim, <code>$old_instance<\/code>, znajdziesz warto\u015bci, kt\u00f3re s\u0105 aktualnie zapisane w bazie danych. Pozwala to w razie potrzeby na wykonanie inteligentnych por\u00f3wna\u0144.<\/p>\n<p>Zwykle po prostu tworzysz now\u0105 tablic\u0119 wszystkich ustawie\u0144 wid\u017cet\u00f3w i zapisujesz wszystko, co jest w niej ustawione <code>$new_instance<\/code>. Zajmujemy si\u0119 r\u00f3wnie\u017c odka\u017caniem. Na koniec po prostu zwracamy t\u0119 tablic\u0119, kt\u00f3ra powie WordPressowi, co zapisa\u0107.<\/p>\n<pre><code>\/\/ Responsible for saving settings in admin\npublic function update($new_instance, $old_instance) {\n    $instance = [];\n    $instance['legal_name'] = (!empty($new_instance['legal_name']))? strip_tags($new_instance['legal_name']): '';\n    $instance['vat_id'] = (!empty($new_instance['vat_id']))? strip_tags($new_instance['vat_id']): '';\n    $instance['street_address'] = (!empty($new_instance['street_address']))? strip_tags($new_instance['street_address']): '';\n    $instance['postal_code'] = (!empty($new_instance['postal_code']))? strip_tags($new_instance['postal_code']): '';\n    $instance['postal_city'] = (!empty($new_instance['postal_city']))? strip_tags($new_instance['postal_city']): '';\n    $instance['email_address'] = (!empty($new_instance['email_address']))? strip_tags($new_instance['email_address']): '';\n    $instance['phone_number'] = (!empty($new_instance['phone_number']))? strip_tags($new_instance['phone_number']): '';\n    return $instance;\n}<\/code><\/pre>\n<p>Mo\u017cesz teraz przetestowa\u0107 sw\u00f3j wid\u017cet, je\u015bli chcesz, i sprawdzi\u0107, czy wprowadzone warto\u015bci s\u0105 zapisywane. A je\u015bli pami\u0119tasz o <code>value<\/code>prawid\u0142owym ustawieniu atrybutu w <code>form()<\/code>, po zapisaniu i naci\u015bni\u0119ciu przycisku od\u015bwie\u017cania warto\u015bci powinny zosta\u0107 zachowane. \u015awietny! Przejd\u017amy teraz do ostatniego i, co prawda, najfajniejszego kroku \u2013 wyprowadzania frontendu.<\/p>\n<h3>Funkcja widget()<\/h3>\n<p>Funkcja <code>widget()<\/code>odpowiada za wyprowadzenie wid\u017cetu w interfejsie u\u017cytkownika. Do funkcji otrzymamy dwa argumenty; po pierwsze tablica z przydatnymi informacjami, takimi jak opakowania obszaru wid\u017cet\u00f3w zdefiniowanych w motywie, a po drugie zapisane warto\u015bci ustawie\u0144 wid\u017cet\u00f3w.<\/p>\n<p>Wyj\u015bcie wid\u017cetu powinno zawsze zaczyna\u0107 si\u0119 od echa <code>$args['before_widget']<\/code>i zawsze ko\u0144czy\u0107 si\u0119 echem <code>$args['after_widget']<\/code>. Dzi\u0119ki temu wid\u017cet zostanie opakowany w te same odpowiednie opakowania HTML wid\u017cet\u00f3w, kt\u00f3re zosta\u0142y zdefiniowane przez motyw. Wzd\u0142u\u017c tych samych \u015bcie\u017cek mo\u017cesz wykona\u0107 echo <code>$args['before_title']<\/code>i <code>$args['after_title']<\/code>wyprowadzi\u0107 prawid\u0142owe obwoluty HTML wok\u00f3\u0142 tytu\u0142u wid\u017cetu. Nie mamy samego tytu\u0142u wid\u017cetu, ale umie\u015bcimy oficjaln\u0105 nazw\u0119 firmy jako tytu\u0142 wid\u017cetu.<\/p>\n<p>W przeciwnym razie uzyskasz zapisane warto\u015bci, odwo\u0142uj\u0105c si\u0119 do drugiego argumentu, <code>$instance<\/code>, za pomoc\u0105 nazw kluczy ustawionych w <code>form()<\/code>i <code>update()<\/code>. Dobr\u0105 praktyk\u0105 jest wy\u015bwietlanie tylko tych ustawie\u0144, kt\u00f3re zosta\u0142y ustawione \u2013 i ignorowanie tych pustych.<\/p>\n<p>Poniewa\u017c wyprowadzamy r\u00f3wnie\u017c mikrodane, musimy doda\u0107 odpowiednie w\u0142a\u015bciwo\u015bci zgodnie z regu\u0142ami schema.org.<\/p>\n<p>Od Ciebie zale\u017cy, w jaki spos\u00f3b chcesz wy\u015bwietli\u0107 sw\u00f3j wid\u017cet; mo\u017cesz prawdopodobnie rozwa\u017cy\u0107 dodanie wi\u0119kszej liczby wrapper\u00f3w HTML, aby u\u0142atwi\u0107 stylizacj\u0119.<\/p>\n<pre><code>\/\/ Responsible for outputting the widget in frontend\npublic function widget($args, $instance) {\n    echo $args['before_widget'];\n\u00a0\n    ?&gt;&lt;div itemscope itemtype=\"https:\/\/schema.org\/LocalBusiness\"&gt;&lt;?php\n\u00a0\n    if (!empty($instance['legal_name'])) {\n        echo $args['before_title'];\n        ?&gt;&lt;span itemprop=\"legalName\"&gt;&lt;?php echo $instance['legal_name']; ?&gt;&lt;\/span&gt;&lt;?php\n\u00a0\n        echo $args['after_title'];\n    }\n\u00a0\n    if (!empty($instance['vat_id'])) {\n        ?&gt;&lt;span itemprop=\"vatID\" class=\"business-vatid\"&gt;&lt;?php printf(__('Vat: %s', 'txtdomain'), $instance['vat_id']); ?&gt;&lt;\/span&gt;&lt;?php\n    }\n\u00a0\n    if (!empty($instance['street_address'])) {\n        ?&gt;&lt;div itemprop=\"address\" itemscope itemtype=\"https:\/\/schema.org\/PostalAddress\" class=\"business-address\"&gt;&lt;?php\n\u00a0\n            ?&gt;&lt;span itemprop=\"streetAddress\"&gt;&lt;?php echo $instance['street_address']; ?&gt;&lt;\/span&gt;&lt;?php\n\u00a0\n            if (!empty($instance['postal_code'])) {\n                ?&gt;&lt;span itemprop=\"postalCode\"&gt;&lt;?php echo $instance['postal_code']; ?&gt;&lt;\/span&gt;&lt;?php\n            }\n            if (!empty($instance['postal_city'])) {\n                ?&gt;&lt;span itemprop=\"addressLocality\"&gt;&lt;?php echo $instance['postal_city']; ?&gt;&lt;\/span&gt;&lt;?php\n            }               \n\u00a0\n        ?&gt;&lt;\/div&gt;&lt;?php\n    }\n\u00a0\n    if (!empty($instance['email_address'])) {\n        ?&gt;&lt;a href=\"mailto:&lt;?php echo $instance['email_address']; ?&gt;\" title=\"&lt;?php _e('Send email', 'txtdomain'); ?&gt;\" class=\"business-email\"&gt;\n            &lt;span itemprop=\"email\"&gt;&lt;?php echo $instance['email_address']; ?&gt;&lt;\/span&gt;\n        &lt;\/a&gt;&lt;?php\n    }\n\u00a0\n    if (!empty($instance['phone_number'])) {\n        ?&gt;&lt;a href=\"tel:&lt;?php echo $instance['phone_number']; ?&gt;\" title=\"&lt;?php _e('Call us', 'txtdomain'); ?&gt;\" class=\"business-phone\"&gt;\n            &lt;span itemprop=\"telephone\"&gt;&lt;?php echo $instance['phone_number']; ?&gt;&lt;\/span&gt;\n        &lt;\/a&gt;&lt;?php\n    }\n\u00a0\n    ?&gt;&lt;\/div&gt;&lt;?php\n\u00a0\n    echo $args['after_widget'];\n}<\/code><\/pre>\n<p>Dostosuj wyj\u015bcie, dodaj troch\u0119 stylizacji i to wszystko!<\/p>\n<p>FYI: Tw\u00f3j wid\u017cet otrzyma nazw\u0119 klasy opakowuj\u0105cej \u201e <code>widget_&lt;base ID&gt;<\/code>&#8221; (podstawowy identyfikator to ten, kt\u00f3ry poda\u0142e\u015b w konstruktorze). W naszym przypadku nasz wid\u017cet otrzyma klas\u0119 \u201e <code>widget_local_business<\/code>&#8222;. Mo\u017ce to pom\u00f3c w dodaniu ukierunkowanej stylizacji.<\/p>\n<h2>Zawijanie i kod ko\u0144cowy<\/h2>\n<p>W tym samouczku dowiedzieli\u015bmy si\u0119, jak utworzy\u0107 niestandardowy wid\u017cet i jak renderowa\u0107 dane wyj\u015bciowe sformatowane w mikrodanych z jego ustawie\u0144. Powiniene\u015b by\u0107 w stanie tworzy\u0107 w\u0142asne wid\u017cety, post\u0119puj\u0105c zgodnie z podstawami klasy wid\u017cet\u00f3w!<\/p>\n<p>Dla odniesienia, oto pe\u0142ny kod, wszystko razem.<\/p>\n<pre><code>add_action('widgets_init', function() {\n    register_widget('LocalBusiness');\n});\n\u00a0\nclass LocalBusiness extends WP_Widget {\n\u00a0\n    \/\/ Initialize your widget in the class constructor\n    public function __construct() {\n        $widget_ops = [\n            'description' =&gt; __('Outputs business information with Microdata', 'txtdomain')\n        ];\n        parent::__construct('local_business', __('Local Business Information', 'txtdomain'), $widget_ops);\n    }\n\u00a0\n    \/\/ Responsible for outputting the widget in frontend\n    public function widget($args, $instance) {\n        echo $args['before_widget'];\n\u00a0\n        ?&gt;&lt;div itemscope itemtype=\"https:\/\/schema.org\/LocalBusiness\"&gt;&lt;?php\n\u00a0\n        if (!empty($instance['legal_name'])) {\n            echo $args['before_title'];\n            ?&gt;&lt;span itemprop=\"legalName\"&gt;&lt;?php echo $instance['legal_name']; ?&gt;&lt;\/span&gt;&lt;?php\n\u00a0\n            echo $args['after_title'];\n        }\n\u00a0\n        if (!empty($instance['vat_id'])) {\n            ?&gt;&lt;span itemprop=\"vatID\" class=\"business-vatid\"&gt;&lt;?php printf(__('Vat: %s', 'txtdomain'), $instance['vat_id']); ?&gt;&lt;\/span&gt;&lt;?php\n        }\n\u00a0\n        if (!empty($instance['street_address'])) {\n            ?&gt;&lt;div itemprop=\"address\" itemscope itemtype=\"https:\/\/schema.org\/PostalAddress\" class=\"business-address\"&gt;&lt;?php\n\u00a0\n                ?&gt;&lt;span itemprop=\"streetAddress\"&gt;&lt;?php echo $instance['street_address']; ?&gt;&lt;\/span&gt;&lt;?php\n\u00a0\n                if (!empty($instance['postal_code'])) {\n                    ?&gt;&lt;span itemprop=\"postalCode\"&gt;&lt;?php echo $instance['postal_code']; ?&gt;&lt;\/span&gt;&lt;?php\n                }\n                if (!empty($instance['postal_city'])) {\n                    ?&gt;&lt;span itemprop=\"addressLocality\"&gt;&lt;?php echo $instance['postal_city']; ?&gt;&lt;\/span&gt;&lt;?php\n                }               \n\u00a0\n            ?&gt;&lt;\/div&gt;&lt;?php\n        }\n\u00a0\n        if (!empty($instance['email_address'])) {\n            ?&gt;&lt;a href=\"mailto:&lt;?php echo $instance['email_address']; ?&gt;\" title=\"&lt;?php _e('Send email', 'txtdomain'); ?&gt;\" class=\"business-email\"&gt;\n                &lt;span itemprop=\"email\"&gt;&lt;?php echo $instance['email_address']; ?&gt;&lt;\/span&gt;\n            &lt;\/a&gt;&lt;?php\n        }\n\u00a0\n        if (!empty($instance['phone_number'])) {\n            ?&gt;&lt;a href=\"tel:&lt;?php echo $instance['phone_number']; ?&gt;\" title=\"&lt;?php _e('Call us', 'txtdomain'); ?&gt;\" class=\"business-phone\"&gt;\n                &lt;span itemprop=\"telephone\"&gt;&lt;?php echo $instance['phone_number']; ?&gt;&lt;\/span&gt;\n            &lt;\/a&gt;&lt;?php\n        }\n        ?&gt;&lt;\/div&gt;&lt;?php\n\u00a0\n        echo $args['after_widget'];\n    }\n\u00a0\n    \/\/ Responsible for outputting the widget settings in admin\n    public function form($instance) { \n        ?&gt;\n        &lt;p&gt;\n            &lt;label for=\"&lt;?php echo $this-&gt;get_field_id('legal_name'); ?&gt;\"&gt;&lt;?php _e('Legal name:', 'txtdomain'); ?&gt;&lt;\/label&gt;\n            &lt;input type=\"text\" class=\"widefat\" id=\"&lt;?php echo esc_attr($this-&gt;get_field_id('legal_name')); ?&gt;\" name=\"&lt;?php echo esc_attr($this-&gt;get_field_name('legal_name')); ?&gt;\" value=\"&lt;?php echo esc_attr($instance['legal_name']); ?&gt;\" \/&gt;\n        &lt;\/p&gt;\n        &lt;p&gt;\n            &lt;label for=\"&lt;?php echo $this-&gt;get_field_id('vat_id'); ?&gt;\"&gt;&lt;?php _e('Vat ID\/Organization number:', 'txtdomain'); ?&gt;&lt;\/label&gt;\n            &lt;input type=\"text\" class=\"widefat\" id=\"&lt;?php echo esc_attr($this-&gt;get_field_id('vat_id')); ?&gt;\" name=\"&lt;?php echo esc_attr($this-&gt;get_field_name('vat_id')); ?&gt;\" value=\"&lt;?php echo esc_attr($instance['vat_id']); ?&gt;\" \/&gt;\n        &lt;\/p&gt;\n        &lt;p&gt;\n            &lt;label for=\"&lt;?php echo $this-&gt;get_field_id('street_address'); ?&gt;\"&gt;&lt;?php _e('Street address:', 'txtdomain'); ?&gt;&lt;\/label&gt;\n            &lt;input type=\"text\" class=\"widefat\" id=\"&lt;?php echo esc_attr($this-&gt;get_field_id('street_address')); ?&gt;\" name=\"&lt;?php echo esc_attr($this-&gt;get_field_name('street_address')); ?&gt;\" value=\"&lt;?php echo esc_attr($instance['street_address']); ?&gt;\" \/&gt;\n        &lt;\/p&gt;\n        &lt;p&gt;\n            &lt;label for=\"&lt;?php echo $this-&gt;get_field_id('postal_code'); ?&gt;\"&gt;&lt;?php _e('Postal code:', 'txtdomain'); ?&gt;&lt;\/label&gt;\n            &lt;input type=\"text\" class=\"widefat\" id=\"&lt;?php echo esc_attr($this-&gt;get_field_id('postal_code')); ?&gt;\" name=\"&lt;?php echo esc_attr($this-&gt;get_field_name('postal_code')); ?&gt;\" value=\"&lt;?php echo esc_attr($instance['postal_code']); ?&gt;\" \/&gt;\n        &lt;\/p&gt;\n        &lt;p&gt;\n            &lt;label for=\"&lt;?php echo $this-&gt;get_field_id('postal_city'); ?&gt;\"&gt;&lt;?php _e('City:', 'txtdomain'); ?&gt;&lt;\/label&gt;\n            &lt;input type=\"text\" class=\"widefat\" id=\"&lt;?php echo esc_attr($this-&gt;get_field_id('postal_city')); ?&gt;\" name=\"&lt;?php echo esc_attr($this-&gt;get_field_name('postal_city')); ?&gt;\" value=\"&lt;?php echo esc_attr($instance['postal_city']); ?&gt;\" \/&gt;\n        &lt;\/p&gt;\n        &lt;p&gt;\n            &lt;label for=\"&lt;?php echo $this-&gt;get_field_id('email_address'); ?&gt;\"&gt;&lt;?php _e('E-mail address:', 'txtdomain'); ?&gt;&lt;\/label&gt;\n            &lt;input type=\"text\" class=\"widefat\" id=\"&lt;?php echo esc_attr($this-&gt;get_field_id('email_address')); ?&gt;\" name=\"&lt;?php echo esc_attr($this-&gt;get_field_name('email_address')); ?&gt;\" value=\"&lt;?php echo esc_attr($instance['email_address']); ?&gt;\" \/&gt;\n        &lt;\/p&gt;\n        &lt;p&gt;\n            &lt;label for=\"&lt;?php echo $this-&gt;get_field_id('phone_number'); ?&gt;\"&gt;&lt;?php _e('Phone number:', 'txtdomain'); ?&gt;&lt;\/label&gt;\n            &lt;input type=\"text\" class=\"widefat\" id=\"&lt;?php echo esc_attr($this-&gt;get_field_id('phone_number')); ?&gt;\" name=\"&lt;?php echo esc_attr($this-&gt;get_field_name('phone_number')); ?&gt;\" value=\"&lt;?php echo esc_attr($instance['phone_number']); ?&gt;\" \/&gt;\n        &lt;\/p&gt;\n        &lt;?php\n    }\n\u00a0\n    \/\/ Responsible for saving settings in admin\n    public function update($new_instance, $old_instance) {\n        $instance = [];\n        $instance['legal_name'] = (!empty($new_instance['legal_name']))? strip_tags($new_instance['legal_name']): '';\n        $instance['vat_id'] = (!empty($new_instance['vat_id']))? strip_tags($new_instance['vat_id']): '';\n        $instance['street_address'] = (!empty($new_instance['street_address']))? strip_tags($new_instance['street_address']): '';\n        $instance['postal_code'] = (!empty($new_instance['postal_code']))? strip_tags($new_instance['postal_code']): '';\n        $instance['postal_city'] = (!empty($new_instance['postal_city']))? strip_tags($new_instance['postal_city']): '';\n        $instance['email_address'] = (!empty($new_instance['email_address']))? strip_tags($new_instance['email_address']): '';\n        $instance['phone_number'] = (!empty($new_instance['phone_number']))? strip_tags($new_instance['phone_number']): '';\n        return $instance;\n    }\n}<\/code><\/pre>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">\u0179r\u00f3d\u0142o nagrywania:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/awhitepixel.com\" class=\"external external_icon\">awhitepixel.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>W tym samouczku om\u00f3wiono tworzenie niestandardowego wid\u017cetu, kt\u00f3ry wy\u015bwietla informacje biznesowe ze znacznikami schematu mikrodanych dla LocalBusiness.<\/p>\n","protected":false},"author":1,"featured_media":223853,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[984,897,721,721,984,997,897,997,1110,836,836,845,1008,1008,929,929,845,866,866],"tags":[1169],"class_list":["post-233830","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-biznes-pl","category-kod","category-deweloper","category-marketing-tresci","category-n-a","category-przewodnik-dla-poczatkujacych","category-samouczki","category-seo-8","category-tematy","category-wordpress-7","tag-affiai-pl"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts\/233830","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/comments?post=233830"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts\/233830\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/media\/223853"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/media?parent=233830"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/categories?post=233830"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/tags?post=233830"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}