{"id":229347,"date":"2022-11-16T19:46:00","date_gmt":"2022-11-16T16:46:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=229347"},"modified":"2022-11-09T06:36:21","modified_gmt":"2022-11-09T03:36:21","slug":"szablony-wordpress-dla-poczatkujacych-jak-to-jest","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/pl\/szablony-wordpress-dla-poczatkujacych-jak-to-jest\/","title":{"rendered":"Szablony WordPress dla pocz\u0105tkuj\u0105cych: jak to jest"},"content":{"rendered":"\n<p>Kiedy po raz pierwszy zacz\u0105\u0142em my\u015ble\u0107 o szablonowaniu w WordPressie, pomy\u015bla\u0142em o dw\u00f3ch aspektach:<\/p>\n<ol>\n<li>tre\u015bci specjalnie dla <a href=\"https:\/\/tommcfarlin.com\/register\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">cz\u0142onk\u00f3w<\/a> ,<\/li>\n<li>tre\u015bci, kt\u00f3re mo\u017cna podzieli\u0107 na jeden post.<\/li>\n<\/ol>\n<p>Ale im wi\u0119cej o tym my\u015bla\u0142em, tym bardziej zdawa\u0142em sobie spraw\u0119, \u017ce mo\u017cna to (i zapewne powinno) wyja\u015bni\u0107 w kilku postach.<\/p>\n<p>Zamierzam wi\u0119c podzieli\u0107 obecny stan szablon\u00f3w WordPress, a nast\u0119pnie praktyczne sposoby organizowania, powiedzmy, naszych wtyczek, tak aby u\u017cywali\u015bmy standardowego PHP.<\/p>\n<p>Nast\u0119pnie w przysz\u0142ej serii przyjrz\u0119 si\u0119, co to znaczy u\u017cywa\u0107 innych silnik\u00f3w szablon\u00f3w (zar\u00f3wno PHP, jak i JavaScript w pracy, kt\u00f3r\u0105 wykonujemy).<\/p>\n<p>Na pocz\u0105tek chcia\u0142bym jednak przyjrze\u0107 si\u0119, jak cz\u0119sto widzimy szablony napisane w kontek\u015bcie zar\u00f3wno motyw\u00f3w WordPress, jak i wtyczek.<\/p>\n<h2>Szablony WordPress dla pocz\u0105tkuj\u0105cych<\/h2>\n<p>W zale\u017cno\u015bci od Twojego do\u015bwiadczenia z WordPressem i innymi systemami opartymi na PHP, Twoja definicja szablon\u00f3w b\u0119dzie inna ni\u017c czyja\u015b inna.<\/p>\n<p>Wi\u0119c pr\u00f3buj\u0105c stworzy\u0107 wsp\u00f3ln\u0105 definicj\u0119, kt\u00f3rej b\u0119d\u0119 u\u017cywa\u0142 w tej serii post\u00f3w, <a href=\"https:\/\/codex.wordpress.org\/Templates\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">u\u017cyj\u0119 Kodeksu WordPress:<\/a><\/p>\n<blockquote>\n<p>Szablony to pliki, kt\u00f3re kontroluj\u0105 spos\u00f3b wy\u015bwietlania witryny WordPress w Internecie.<\/p>\n<\/blockquote>\n<p>Strona dalej m\u00f3wi o tym, jak dzia\u0142a w po\u0142\u0105czeniu z baz\u0105 danych i innymi zasobami, i polecam przeczyta\u0107 o tym, je\u015bli nie jeste\u015b z ni\u0105 zaznajomiony.<\/p>\n<p>Jednak powy\u017csza definicja dobrze sprawdza si\u0119 w tym, jak zamierzam i\u015b\u0107 naprz\u00f3d, my\u015bl\u0105c o tym.<\/p>\n<h3>1 Jak to jest (teraz)<\/h3>\n<p>Je\u015bli chodzi o my\u015blenie o szablonach WordPress, my\u015bl\u0119, \u017ce warto rozwa\u017cy\u0107 jeden szablon, kt\u00f3ry z kodem <a href=\"https:\/\/gist.github.com\/tommcfarlin\/2c02b22272f645076f7f735bd61a4034#file-00-content-container-php\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">wygl\u0105da mniej wi\u0119cej tak:<\/a><\/p>\n<pre><code>&lt;div id=\"content-container\"&gt;\n\n  &lt;p&gt;\n    Oh! The garbage chute was a really wonderful idea. What an incredible smell you've discovered! Let's get out of here! \n    Get away from there... No! wait! Will you forget it? I already tried it. It's magnetically sealed! Put that \n    thing away! You're going to get us all killed.\n  &lt;\/p&gt;\n\n  &lt;h2&gt;List of Post Titles For Acme Post Type&lt;\/h2&gt;\n  &lt;?php\n  $args = array(\n    'post_status'    =&gt; 'publish',\n    'post_type'      =&gt; 'acme',\n    'posts_per_page' =&gt; '10'\n  );\n  $custom_query = new WP_Query( $args );\n\n  if ($custom_query-&gt;have_posts()) {\n    echo '&lt;ul&gt;';\n    while ($custom_query-&gt;have_posts()) {\n      $custom_query-&gt;the_post();\n      echo '&lt;li&gt;'. get_the_title(). '&lt;\/li&gt;';\n    }\n    echo '&lt;\/ul&gt;';\n    wp_reset_postdata();\n  }\n  ?&gt;\n\n  &lt;p&gt;\n    Absolutely, Your Worship. Look, I had everything under control until you led us down here. You know, it's not \n    going to take them long to figure out what happened to us. It could be worst... It's worst. \n    There's something alive in here! That's your imagination. Something just moves past my leg! \n    Look! Did you see that? What? Help!\n  &lt;\/p&gt;\n\n&lt;\/div&gt;&lt;!-- #content-container --&gt;<\/code><\/pre>\n<p>Punktem powy\u017cszego kodu jest to, \u017ce widzisz, \u017ce miesza PHP i HTML.<\/p>\n<p>Ponadto wa\u017cne jest, aby pami\u0119ta\u0107, \u017ce ka\u017cdy z tych plik\u00f3w jest stylizowany za pomoc\u0105 CSS i mo\u017ce mie\u0107 dodatkowe zachowanie kontrolowane przez JavaScript. W tym celu mo\u017cesz to konceptualizowa\u0107 w ten spos\u00f3b:<\/p>\n<p>Reprezentuje pojedynczy szablon \u0142\u0105cz\u0105cy HTML i PHP w jeden szablon. A ten szablon jest nast\u0119pnie stylizowany za pomoc\u0105 CSS i kontrolowany za pomoc\u0105 JavaScript.<\/p>\n<p>Wszystkie te elementy wsp\u00f3\u0142pracuj\u0105 ze sob\u0105, aby zapewni\u0107 to, co widzi u\u017cytkownik.<\/p>\n<h3>2 Czy organizacja deweloperska generuje wydajno\u015b\u0107?<\/h3>\n<p>Ale spos\u00f3b, w jaki to dzia\u0142a, jest troch\u0119 ba\u0142aganiarski i chocia\u017c mo\u017ce wygl\u0105da\u0107 dobrze dla u\u017cytkownika, rodzi kilka pyta\u0144:<\/p>\n<ul>\n<li>Czy jest tak wydajny, jak m\u00f3g\u0142by by\u0107?<\/li>\n<li>Jak \u0142atwo jest utrzyma\u0107 programist\u0119?<\/li>\n<li>Jak wygl\u0105da proces kompilacji?<\/li>\n<li>jak s\u0105 utrzymywane i zorganizowane aktywa?<\/li>\n<\/ul>\n<p>Jasne, wi\u0119kszo\u015b\u0107 tego, co czytasz powy\u017cej, jest bardzo skupiona na programistach, ale uwa\u017cam, \u017ce kiedy kod jest zorganizowany w taki spos\u00f3b, \u017ce programi\u015bci mog\u0105 z nim \u0142atwo pracowa\u0107, cz\u0119sto jest to \u0142atwe nawet szybciej dla u\u017cytkownika.<\/p>\n<p>Ale co to znaczy?<\/p>\n<ul>\n<li>Czy wprowadzamy Sassa?<\/li>\n<li>Czy minimalizujemy JavaScript?<\/li>\n<li>Jak \u0142\u0105czymy te zasoby i importujemy je?<\/li>\n<li>A co z niestandardowymi zapytaniami PHP, kt\u00f3re wyst\u0119puj\u0105 w kontek\u015bcie ka\u017cdego szablonu?<\/li>\n<\/ul>\n<p>I chocia\u017c pierwsze rzeczy s\u0105 wa\u017cne i warte zachodu (i om\u00f3wi\u0119 to p\u00f3\u017aniej w serii), oddzielenie logiki od szablonu, nawet bez silnika szablon\u00f3w, mo\u017ce sprawi\u0107, \u017ce kod b\u0119dzie bardziej skoncentrowany na programistach.<\/p>\n<p>Czy to przyspiesza prac\u0119 u\u017cytkownika? Niekoniecznie. Ale pomaga nam to zrobi\u0107 pierwszy krok w tym kierunku.<\/p>\n<h2>Zorganizujmy si\u0119 ponownie<\/h2>\n<p>W nast\u0119pnym po\u015bcie z tej serii podziel\u0119 na przyk\u0142ad zawarto\u015b\u0107, do kt\u00f3rej jeste\u015bmy przyzwyczajeni w szablonach WordPress, i zaczn\u0119 j\u0105 reorganizowa\u0107, aby by\u0142a lepiej zorganizowana w taki spos\u00f3b, aby techniki mo\u017cna by\u0142o wykorzysta\u0107 w r\u00f3\u017cnych projektach.<\/p>\n<p>Oznacza to przenoszenie rzeczy do ich funkcji (lub nawet w ich klasach, a tym samym do ich funkcji) i jak mo\u017cemy je wywo\u0142ywa\u0107 z kontekstu naszych szablon\u00f3w.<\/p>\n<p>Ostatecznie doprowadzi to do \u0142atwiejszego odczytania kodu, lepszego oddzielenia problem\u00f3w i skierowania nas w stron\u0119 sposob\u00f3w zmiany sposobu wstrzykiwania danych do szablonu.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">\u0179r\u00f3d\u0142o nagrywania:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/tommcfarlin.com\" class=\"external external_icon\">tommcfarlin.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Szablony to spos\u00f3b, w jaki dane s\u0105 wy\u015bwietlane u\u017cytkownikowi, ale jak mo\u017cemy wykorzysta\u0107 szablony WordPress i poprawi\u0107 ich organizacj\u0119 dla u\u017cytkownik\u00f3w i programist\u00f3w?<\/p>\n","protected":false},"author":1,"featured_media":223990,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[897,845,929,866],"tags":[1169],"class_list":["post-229347","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-kod","category-samouczki","category-tematy","category-wordpress-7","tag-affiai-pl"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts\/229347","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=229347"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts\/229347\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/media\/223990"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/media?parent=229347"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/categories?post=229347"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/tags?post=229347"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}