{"id":6829,"date":"2023-06-19T23:59:53","date_gmt":"2023-06-19T20:59:53","guid":{"rendered":"https:\/\/sitecenneti.com\/wordpress\/?p=6829"},"modified":"2023-06-22T23:25:34","modified_gmt":"2023-06-22T20:25:34","slug":"sablonlar-ve-sablon-parcalari","status":"publish","type":"post","link":"https:\/\/sitecenneti.com\/wordpress\/wordpress-blok-tabanli-tema-kodlama\/sablonlar-ve-sablon-parcalari\/","title":{"rendered":"\u015eablonlar ve \u015eablon Par\u00e7alar\u0131"},"content":{"rendered":"<div id=\"toc_container\" class=\"toc_transparent no_bullets\"><p class=\"toc_title\">BU DERS\u0130N BA\u015eLIKLARI<\/p><ul class=\"toc_list\"><li><a href=\"#Bloklarin_Sablon_Dosyalarina_Kodlanmasi\"><span class=\"toc_number toc_depth_1\">1<\/span> Bloklar\u0131n \u015eablon Dosyalar\u0131na Kodlanmas\u0131<\/a><\/li><li><a href=\"#Bloklarin_HTML_Kodlarinin_Tespiti\"><span class=\"toc_number toc_depth_1\">2<\/span> Bloklar\u0131n HTML Kodlar\u0131n\u0131n Tespiti<\/a><\/li><li><a href=\"#Sablonlar\"><span class=\"toc_number toc_depth_1\">3<\/span> \u015eablonlar<\/a><ul><li><a href=\"#Bir_Sablon_Dosyasi_Nasil_Kodlanir\"><span class=\"toc_number toc_depth_2\">3.1<\/span> Bir \u015eablon Dosyas\u0131 Nas\u0131l Kodlan\u0131r?<\/a><\/li><li><a href=\"#Site_Duzenleyicisi_Ile_Sablon_Dosyasi_Olusturmak\"><span class=\"toc_number toc_depth_2\">3.2<\/span> Site D\u00fczenleyicisi \u0130le \u015eablon Dosyas\u0131 Olu\u015fturmak<\/a><\/li><li><a href=\"#Hazir_Sablonlar\"><span class=\"toc_number toc_depth_2\">3.3<\/span> Haz\u0131r \u015eablonlar<\/a><\/li><li><a href=\"#Sablon_Editoru_Ile_Sablon_Hazirlama\"><span class=\"toc_number toc_depth_2\">3.4<\/span> \u015eablon Edit\u00f6r\u00fc \u0130le \u015eablon Haz\u0131rlama<\/a><\/li><\/ul><\/li><li><a href=\"#Sablon_Parcalari\"><span class=\"toc_number toc_depth_1\">4<\/span> \u015eablon Par\u00e7alar\u0131<\/a><ul><li><a href=\"#Bir_Sablon_Parcasi_Nasil_Kodlanir\"><span class=\"toc_number toc_depth_2\">4.1<\/span> Bir \u015eablon Par\u00e7as\u0131 Nas\u0131l Kodlan\u0131r?<\/a><\/li><li><a href=\"#Sablon_Parcalari_Bir_Sablon_Dosyasina_Nasil_Cagirilir\"><span class=\"toc_number toc_depth_2\">4.2<\/span> \u015eablon Par\u00e7alar\u0131 Bir \u015eablon Dosyas\u0131na Nas\u0131l \u00c7a\u011f\u0131r\u0131l\u0131r?<\/a><\/li><\/ul><\/li><li><a href=\"#Sablon_Parcalarini_themejson_Dosyasina_Ekleme\"><span class=\"toc_number toc_depth_1\">5<\/span> \u015eablon Par\u00e7alar\u0131n\u0131 theme.json Dosyas\u0131na Ekleme<\/a><ul><li><a href=\"#Site_Editoru_ile_Sablon_Parcasi_Olusturma\"><span class=\"toc_number toc_depth_2\">5.1<\/span> Site Edit\u00f6r\u00fc ile \u015eablon Par\u00e7as\u0131 Olu\u015fturma<\/a><\/li><\/ul><\/li><li><a href=\"#Sablonlarda_Yapilan_Degisiklikler_Nerede_Kaydedilir\"><span class=\"toc_number toc_depth_1\">6<\/span> \u015eablonlarda Yap\u0131lan De\u011fi\u015fiklikler Nerede Kaydedilir?<\/a><\/li><\/ul><\/div>\n\n<p>Bir WordPress blok temas\u0131nda her bir sayfadan sorumlu bir \u015fablon dosyas\u0131 vard\u0131r. Yani web sitemizin ziyaret\u00e7ileri, sitemizde bir sayfay\u0131 a\u00e7t\u0131\u011f\u0131nda, sayfadaki i\u00e7erik, o sayfa i\u00e7in haz\u0131rlad\u0131\u011f\u0131m\u0131z \u015fablona g\u00f6re sunulur. Bundan, her sayfa i\u00e7in ayr\u0131 ayr\u0131 \u015fablon haz\u0131rlamak zorunda oldu\u011fumuz anla\u015f\u0131lmas\u0131n. Bir tane \u015fablon haz\u0131rlayarak, sitemizde ayn\u0131 t\u00fcrden b\u00fct\u00fcn i\u00e7erikler i\u00e7in ayn\u0131 \u015fablonu kullanabiliriz. Hatta, WordPress mecbur kald\u0131\u011f\u0131nda, b\u00fct\u00fcn i\u00e7eriklerimizi sunmak i\u00e7in <strong>index.html<\/strong> \u015fablonunu kullan\u0131r.<\/p>\n\n\n\n<p><strong>\u015eablon par\u00e7alar\u0131<\/strong> ise, tek ba\u015flar\u0131na de\u011fil de bir \u015fablonun par\u00e7as\u0131 olarak kullan\u0131labilen \u015fablonlard\u0131r. Bir \u015fablon i\u00e7inde birden \u00e7ok \u015fablon par\u00e7as\u0131 kullanabiliriz. (WordPress baz\u0131 yerlerde &#8220;<strong>\u015fablon par\u00e7as\u0131<\/strong>&#8221; kavram\u0131n\u0131 &#8220;<strong>\u015fablon b\u00f6l\u00fcm\u00fc<\/strong>&#8221; olarak da kullanmaktad\u0131r.)<\/p>\n\n\n\n<p>Mesela sayfa \u015fablonlar\u0131nda bulunan <em>logo<\/em>, <em>header <\/em>veya <em>footer <\/em>gibi k\u0131s\u0131mlar genellikle birer \u015fablon par\u00e7as\u0131d\u0131r.<\/p>\n\n\n\n<p>Blok temalar\u0131n \u015fablonlar\u0131na &#8220;blok \u015fablonlar\u0131&#8221; da denir.<\/p>\n\n\n\n<p>Bir blok \u015fablonu, bir veya daha \u00e7ok blo\u011fun bir araya gelmesinden olu\u015fur. \u015eablonlarda ve \u015fablon par\u00e7alar\u0131nda WordPress bloklar\u0131 s\u0131n\u0131rs\u0131z bir \u015fekilde kullan\u0131labilir.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span id=\"Bloklarin_Sablon_Dosyalarina_Kodlanmasi\">Bloklar\u0131n \u015eablon Dosyalar\u0131na Kodlanmas\u0131<\/span><\/h2>\n\n\n\n<p>Bir blo\u011fu bir \u015fablon dosyas\u0131na ve bir \u015fablon par\u00e7as\u0131 dosyas\u0131na kodlamak aras\u0131nda bir fark yoktur.<\/p>\n\n\n\n<p>Bloklar, HTML dosyalar\u0131nda kulland\u0131\u011f\u0131m\u0131z yorum taglar\u0131 (<code>&lt;!-- --&gt;<\/code>) aras\u0131nda kodlan\u0131r.<\/p>\n\n\n\n<p>Bir blo\u011fu bir \u015fablon dosyas\u0131na kodlarken \u015fu kal\u0131p kullan\u0131l\u0131r:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!-- prefix:blok-adi {json format\u0131nda blok ayarlar\u0131n\u0131n \"key\":\"value\" \u00e7iftleri} \/--&gt;<\/code><\/pre>\n\n\n\n<p>Mesela bir \u015fablon dosyas\u0131nda &#8220;<em>Site ba\u015fl\u0131\u011f\u0131<\/em>&#8221; blo\u011funu kullanmak istersek \u015f\u00f6yle bir kod yazmal\u0131y\u0131z:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!-- wp:site-title \/--&gt;<\/code><\/pre>\n\n\n\n<p>Ayn\u0131 blo\u011fu &#8220;level&#8221; ayar\u0131 yaparak kullanmak istersek \u015f\u00f6yle yazmal\u0131y\u0131z:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!-- wp:site-title {\"level\":2} \/--&gt;<\/code><\/pre>\n\n\n\n<p>Yukar\u0131dakiler gibi tek sat\u0131rl\u0131k bloklar oldu\u011fu gibi \u00e7ok sat\u0131rl\u0131 bloklar da vard\u0131r. Mesela a\u015fa\u011f\u0131daki blok WordPress&#8217;in standart ba\u015fl\u0131k blo\u011fudur, \u00e7ok sat\u0131rl\u0131d\u0131r, hem yorum tag\u0131 hem de HTML taglar\u0131 ile birlikte yaz\u0131l\u0131r:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!-- wp:heading {\"level\":3} --&gt;\n&lt;h3 id=\"hello-world\"&gt;Hello world&lt;\/h3&gt;\n&lt;!-- \/wp:heading --&gt;<\/code><\/pre>\n\n\n\n<p>Yukar\u0131daki gibi \u00e7ok sat\u0131rl\u0131 bloklarda a\u00e7\u0131l\u0131\u015f ve kapan\u0131\u015f taglar\u0131 ayn\u0131 dosyada olmal\u0131d\u0131r. Aksi taktirde <em>blok do\u011fruma hatalar\u0131<\/em> alabilirsiniz ve blo\u011funuz do\u011fru g\u00f6sterilmeyebilir.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span id=\"Bloklarin_HTML_Kodlarinin_Tespiti\">Bloklar\u0131n HTML Kodlar\u0131n\u0131n Tespiti<\/span><\/h2>\n\n\n\n<p>Bir blo\u011fun \u015fablon dosyas\u0131na eklenirken ad\u0131n\u0131, ayarlar\u0131n\u0131n key ve value de\u011ferlerini&#8230; tespit etmek zahmetli bir i\u015f olabilir. Bizi bu zahmetten kurtaracak basit bir yol \u015fudur:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>WordPress y\u00f6netim panelinde blok edit\u00f6r a\u00e7\u0131l\u0131r.<\/li>\n\n\n\n<li>\u015eablon dosyas\u0131na kodlanacak blok edit\u00f6re eklenir.<\/li>\n\n\n\n<li>Gerekli ayarlamalar yap\u0131l\u0131r.<\/li>\n\n\n\n<li>Blo\u011fun ayarlar men\u00fcs\u00fcnde bulunan &#8220;Blo\u011fu kopyala&#8221; men\u00fcs\u00fc t\u0131klanarak bir kopyas\u0131 al\u0131n\u0131r.<\/li>\n<\/ul>\n\n\n\n<div class=\"wp-block-group scmb-30 has-white-background-color has-background is-content-justification-center is-nowrap is-layout-flex wp-container-core-group-is-layout-94bc23d7 wp-block-group-is-layout-flex\">\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-bloklarin-kodlarininin-tespiti.jpg\" alt=\"WordPress-Blok-block-tabanl\u0131-tema-tasar\u0131m\u0131-bloklar\u0131n-kodlar\u0131n\u0131n\u0131n-tespiti\" class=\"wp-image-6851\" width=\"542\" height=\"170\" srcset=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-bloklarin-kodlarininin-tespiti.jpg 723w, https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-bloklarin-kodlarininin-tespiti-300x94.jpg 300w\" sizes=\"auto, (max-width: 542px) 100vw, 542px\" \/><\/figure>\n<\/div>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Son olarak, al\u0131nan kopya, \u015fablon dosyas\u0131nda istenilen yere \u015fu tu\u015flara bas\u0131larak yap\u0131\u015ft\u0131r\u0131l\u0131r: <code>Ctrl + V<\/code><\/li>\n<\/ul>\n\n\n\n<p class=\"has-white-background-color has-background\">WordPress bloklar\u0131n\u0131n adlar\u0131n\u0131n ve ayarlar\u0131n\u0131n topluca verildi\u011fi <a href=\"https:\/\/design.oit.ncsu.edu\/docs\/gutenberg\/block-attributes\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u015fu sayfa<\/a> da belki ilginizi \u00e7ekebilir.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span id=\"Sablonlar\">\u015eablonlar<\/span><\/h2>\n\n\n\n<p>Bir WordPress temas\u0131 farkl\u0131 ama\u00e7lar i\u00e7in farkl\u0131 \u015fablonlar i\u00e7erebilir. Bunlardan baz\u0131lar\u0131 \u015funlard\u0131r:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>home<\/li>\n\n\n\n<li>404<\/li>\n\n\n\n<li>archive<\/li>\n\n\n\n<li>single<\/li>\n\n\n\n<li>page &#8230;<\/li>\n<\/ul>\n\n\n\n<p>WordPress temalar\u0131n\u0131n hangi \u015fablon dosyalar\u0131n\u0131 kulland\u0131klar\u0131n\u0131 hat\u0131rlamak i\u00e7in <a href=\"https:\/\/sitecenneti.com\/wordpress\/wordpress-tema-yapimi\/2-5-sablon-hiyerarsisi\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u015eablon Hiyerar\u015fisi<\/a> yaz\u0131m\u0131za g\u00f6z atabilirsiniz.<\/p>\n\n\n\n<p>Bir Blok Temas\u0131nda \u015fablon dosyalar\u0131 <em>site d\u00fczenleyicisi<\/em> (<em>Y\u00f6netim paneli: G\u00f6r\u00fcn\u00fcm -&gt; D\u00fczenleyici<\/em>) ile d\u00fczenlenebilir.<\/p>\n\n\n\n<p>WordPress, \u015fablonlar\u0131 bir i\u00e7erip tipi olarak <strong><code>wp_template<\/code><\/strong> ad\u0131yla kaydeder.<\/p>\n\n\n\n<p>Blok Temalar\u0131, \u015fablon dosyalar\u0131n\u0131 HTML format\u0131nda kullan\u0131r, klasik temalar ise PHP format\u0131nda. Web sitemizde bir sayfa y\u00fcklenirken o sayfaya ait bir HTML \u015fablonu aran\u0131r varsa sayfa o HTML \u015fablonuna g\u00f6re y\u00fcklenir. \u015eayet yoksa, ilgili sayfaya uygun olan PHP \u015fablonu kullan\u0131l\u0131r ve sayfa o PHP \u015fablonuna g\u00f6re g\u00f6sterilir. Yani PHP format\u0131ndaki \u015fablon dosyalar\u0131, HTML format\u0131ndakilerin <em>fallback<\/em>&#8216;leridir.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"Bir_Sablon_Dosyasi_Nasil_Kodlanir\">Bir \u015eablon Dosyas\u0131 Nas\u0131l Kodlan\u0131r?<\/span><\/h3>\n\n\n\n<p>Manuel olarak bir \u015fablon dosyas\u0131 kodlamak i\u00e7in \u015fu ad\u0131mlar takip edilir:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Bir HTML dosyas\u0131 olu\u015fturulur.<\/li>\n\n\n\n<li>Dosyan\u0131n ismi <a href=\"https:\/\/sitecenneti.com\/wordpress\/wordpress-tema-yapimi\/2-5-sablon-hiyerarsisi\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u015fablon hiyerar\u015fisinde<\/a> belirtilen kriterlere uygun se\u00e7ilmelidir.<\/li>\n\n\n\n<li>Dosya teman\u0131n ana dizininde olu\u015fturulan <strong>templates<\/strong> klas\u00f6r\u00fcne konmal\u0131d\u0131r.<\/li>\n\n\n\n<li>Olu\u015fturdu\u011fumuz HTML dosyas\u0131na \u015fablonumuzu diledi\u011fimiz gibi kodlayabiliriz.<\/li>\n<\/ul>\n\n\n\n<p>Bir \u015fablon dosyas\u0131 olu\u015fturman\u0131n kodlamaya g\u00f6re daha basit bir yolu vard\u0131r: <strong>Site D\u00fczenleyici (Tam Site D\u00fczenleyici)<\/strong><\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"Site_Duzenleyicisi_Ile_Sablon_Dosyasi_Olusturmak\">Site D\u00fczenleyicisi \u0130le \u015eablon Dosyas\u0131 Olu\u015fturmak<\/span><\/h3>\n\n\n\n<p>Bir Blok Temada, <em>Site d\u00fczenleyicisi<\/em> (<em>Y\u00f6netim paneli: G\u00f6r\u00fcn\u00fcm -&gt; D\u00fczenleyici<\/em>) ile yeni bir \u015fablon olu\u015fturmak \u015fu \u015fartlara ba\u011fl\u0131d\u0131r:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>\u015eablon dosyas\u0131 WordPress&#8217;in <a href=\"https:\/\/sitecenneti.com\/wordpress\/wordpress-tema-yapimi\/2-5-sablon-hiyerarsisi\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u015fablon hiyerar\u015fisi<\/a>nde yer almak zorundad\u0131r.<\/li>\n\n\n\n<li>Daha \u00f6nce o i\u00e7erik i\u00e7in bir \u015fablon olu\u015fturulmam\u0131\u015f olmal\u0131d\u0131r.<\/li>\n<\/ol>\n\n\n\n<p> Site D\u00fczenleyicisi ile \u015fablon olu\u015fturmak i\u00e7in \u015fu ad\u0131mlar takip edilir:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>\u00d6nce y\u00f6netim paneline yeterli yetki ile (administrator yetkisi ile) giri\u015f yap\u0131l\u0131r.<\/li>\n\n\n\n<li>Y\u00f6netim panelinden <em><strong>G\u00f6r\u00fcn\u00fcm -&gt; D\u00fczenleyici<\/strong><\/em> sayfas\u0131na ge\u00e7ilir:<\/li>\n<\/ol>\n\n\n\n<div class=\"wp-block-group scmb-30 has-white-background-color has-background is-content-justification-center is-nowrap is-layout-flex wp-container-core-group-is-layout-94bc23d7 wp-block-group-is-layout-flex\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"341\" height=\"148\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyicisinin-acilmasi.jpg\" alt=\"WordPress-Blok-block-tabanl\u0131-tema-tasar\u0131m\u0131-site-d\u00fczenleyicisinin-a\u00e7\u0131lmas\u0131\" class=\"wp-image-6901\" srcset=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyicisinin-acilmasi.jpg 341w, https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyicisinin-acilmasi-300x130.jpg 300w\" sizes=\"auto, (max-width: 341px) 100vw, 341px\" \/><\/figure>\n<\/div>\n\n\n\n<ol class=\"wp-block-list\" start=\"3\">\n<li>D\u00fczenleyiciyi a\u00e7t\u0131\u011f\u0131m\u0131zda bizi \u015f\u00f6yle bir sayfa kar\u015f\u0131layacakt\u0131r (WordPress s\u00fcr\u00fcm\u00fcn\u00fcze ve ana sayfa g\u00f6r\u00fcn\u00fcm\u00fcn\u00fcze ba\u011fl\u0131 olarak farkl\u0131 bir g\u00f6r\u00fcnt\u00fc ile kar\u015f\u0131la\u015fabilirsiniz):<\/li>\n<\/ol>\n\n\n\n<div class=\"wp-block-group scmb-30 has-white-background-color has-background is-content-justification-center is-nowrap is-layout-flex wp-container-core-group-is-layout-94bc23d7 wp-block-group-is-layout-flex\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"900\" height=\"435\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-acilis-sayfasi.jpg\" alt=\"WordPress-Blok-block-tabanl\u0131-tema-tasar\u0131m\u0131-site-d\u00fczenleyici-a\u00e7\u0131l\u0131\u015f-sayfas\u0131\" class=\"wp-image-6925\" srcset=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-acilis-sayfasi.jpg 900w, https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-acilis-sayfasi-300x145.jpg 300w, https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-acilis-sayfasi-768x371.jpg 768w\" sizes=\"auto, (max-width: 900px) 100vw, 900px\" \/><\/figure>\n<\/div>\n\n\n\n<ol class=\"wp-block-list\" start=\"4\">\n<li>Yukar\u0131daki resimde de g\u00f6r\u00fcld\u00fc\u011f\u00fc gibi, site d\u00fczenleyicisinin sol taraf\u0131nda &#8220;<strong>Tasar\u0131m<\/strong>&#8221; ad\u0131nda bir men\u00fc bulunmaktad\u0131r ve bu men\u00fcde iki adet ba\u011flant\u0131 vard\u0131r:\n<ul class=\"wp-block-list\">\n<li><strong>\u015eablonlar<\/strong>: \u015eablon dosyalar\u0131 haz\u0131rlamak i\u00e7in kullan\u0131l\u0131r.<\/li>\n\n\n\n<li><strong>\u015eablon par\u00e7alar\u0131:<\/strong> \u015eablon dosyalar\u0131nda kullan\u0131lacak \u015fablon par\u00e7alar\u0131 olu\u015fturmak i\u00e7in kullan\u0131l\u0131r.<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Bir \u015fablon dosyas\u0131 olu\u015fturmak i\u00e7in <strong>\u015eablonlar<\/strong> ba\u011flant\u0131s\u0131n\u0131 t\u0131klamal\u0131y\u0131z.\n<ul class=\"wp-block-list\">\n<li>Bu ba\u011flant\u0131y\u0131 t\u0131klad\u0131\u011f\u0131m\u0131zda kar\u015f\u0131m\u0131za bir alt men\u00fc \u00e7\u0131kar.<\/li>\n\n\n\n<li>Bu alt men\u00fcde listelenen \u00f6\u011feler, daha \u00f6nce haz\u0131rlad\u0131\u011f\u0131m\u0131z \u015fablon dosyalar\u0131d\u0131r:<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n\n\n\n<div class=\"wp-block-group scmb-30 has-white-background-color has-background is-content-justification-center is-nowrap is-layout-flex wp-container-core-group-is-layout-94bc23d7 wp-block-group-is-layout-flex\">\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-Tema-Kodlama-Site-Duzenleyicisi-Sablonlar-Alt-Menusu.gif\" alt=\"WordPress-Blok-Tema-Kodlama-Site-D\u00fczenleyicisi-\u015eablonlar-Alt-Men\u00fcs\u00fc\" class=\"wp-image-6933\" width=\"242\" height=\"392\"\/><\/figure>\n<\/div>\n\n\n\n<ol class=\"wp-block-list\" start=\"6\">\n<li>Yeni bir \u015fablon dosyas\u0131 eklemek i\u00e7in;\n<ul class=\"wp-block-list\">\n<li>&#8220;<strong>\u015eablonlar<\/strong>&#8221; ba\u015fl\u0131\u011f\u0131n\u0131n yan\u0131ndaki &#8220;<strong>+<\/strong>&#8221; i\u015fareti t\u0131klan\u0131r veya<\/li>\n\n\n\n<li>&#8220;<strong>\u015eablonlar<\/strong>&#8221; men\u00fcs\u00fcn\u00fcn en alt\u0131ndaki &#8220;<strong>T\u00fcm \u015fablonlar\u0131 y\u00f6net<\/strong>&#8221; ba\u011flant\u0131s\u0131na t\u0131klan\u0131r, a\u00e7\u0131lan sayfada &#8220;<strong>Yeni ekle<\/strong>&#8221; butonu t\u0131klan\u0131r.\n<ul class=\"wp-block-list\">\n<li>Her iki \u015fekilde kar\u015f\u0131m\u0131za &#8220;<strong>YEN\u0130 \u015eABLON EKLE<\/strong>&#8221; ad\u0131nda bir pop up men\u00fc \u00e7\u0131kar.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n\n\n\n<div class=\"wp-block-group scmb-30 has-white-background-color has-background is-content-justification-center is-nowrap is-layout-flex wp-container-core-group-is-layout-94bc23d7 wp-block-group-is-layout-flex\">\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-yeni-sablon-ekle.jpg\" alt=\"WordPress-Blok-block-tabanl\u0131-tema-tasar\u0131m\u0131-site-d\u00fczenleyici-yeni-\u015fablon-ekle\" class=\"wp-image-6944\" width=\"386\" height=\"439\" srcset=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-yeni-sablon-ekle.jpg 515w, https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-yeni-sablon-ekle-264x300.jpg 264w\" sizes=\"auto, (max-width: 386px) 100vw, 386px\" \/><\/figure>\n<\/div>\n\n\n\n<ol class=\"wp-block-list\" start=\"7\">\n<li>&#8220;<strong>YEN\u0130 \u015eABLON EKLE<\/strong>&#8221; men\u00fcs\u00fc bize ne t\u00fcr bir \u015fablon dosyas\u0131 olu\u015fturmak istedi\u011fimizi sorar.\n<ul class=\"wp-block-list\">\n<li>Kar\u015f\u0131m\u0131za \u00e7\u0131kan liste, WordPress&#8217;in <a href=\"https:\/\/sitecenneti.com\/wordpress\/wordpress-tema-yapimi\/2-5-sablon-hiyerarsisi\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u015fablon hiyerar\u015fisinde<\/a> izin verilen \u015fablon sayfalar\u0131d\u0131r.<\/li>\n\n\n\n<li>Bu listede, daha \u00f6nce \u015fablonlar\u0131 haz\u0131rlanm\u0131\u015f i\u00e7erikler yer almaz.\n<ul class=\"wp-block-list\">\n<li>Haz\u0131rlanm\u0131\u015f \u015fablonlar\u0131m\u0131z, &#8220;<strong>\u015eablonlar -&gt; T\u00fcm \u015fablonlar\u0131 y\u00f6net&#8221;<\/strong> sayfas\u0131nda listelenir.<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Listedeki \u00f6\u011felerin her biri sitemizde ba\u015fka bir i\u00e7eri\u011fi g\u00f6stermek i\u00e7in kullan\u0131l\u0131r. (Biz burada WordPress&#8217;in <a href=\"https:\/\/sitecenneti.com\/wordpress\/wordpress-tema-yapimi\/2-5-sablon-hiyerarsisi\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u015fablon hiyerar\u015fisi<\/a> mant\u0131\u011f\u0131n\u0131 bildi\u011finizi kabul ediyoruz.)<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Listeden se\u00e7ti\u011fimiz \u00f6\u011fe;\n<ul class=\"wp-block-list\">\n<li>&#8220;<strong>Ana sayfa<\/strong>&#8220;, &#8220;<strong>\u00d6n sayfa<\/strong>&#8220;, &#8220;<strong>404 (sayfa bulunamad\u0131 sayfas\u0131)<\/strong>&#8220;, &#8220;<strong>Ara (arama sonu\u00e7lar\u0131 sayfas\u0131)<\/strong>&#8221;  gibi bir \u015fablon ise do\u011frudan \u015fablon olu\u015fturma sayfas\u0131na gideriz.<\/li>\n\n\n\n<li>T\u0131klad\u0131\u011f\u0131m\u0131z \u00f6\u011fe bir i\u00e7erik ya da taxonomy ise, \u00f6nce ilgili \u00f6\u011fe i\u00e7in;\n<ul class=\"wp-block-list\">\n<li>genel bir \u015fablon mu yoksa<\/li>\n\n\n\n<li>bu \u00f6\u011fenin \u00f6zel bir unsuruna has bir \u015fablon mu olu\u015fturmak istedi\u011fimizi soran bir tercih formu \u00e7\u0131kacakt\u0131r.\n<ul class=\"wp-block-list\">\n<li>Mesela &#8220;<strong>Tek \u00f6\u011fe: Yaz\u0131<\/strong>&#8220;ya t\u0131klad\u0131\u011f\u0131m\u0131zda, kar\u015f\u0131m\u0131za \u015f\u00f6yle bir form \u00e7\u0131kacakt\u0131r:<br><img loading=\"lazy\" decoding=\"async\" width=\"400\" height=\"256\" class=\"wp-image-6963\" style=\"width: 400px;\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-yeni-sablon-ekle-tek-yazi-ekle.jpg\" alt=\"WordPress-Blok-block-tabanl\u0131-tema-tasar\u0131m\u0131-site-d\u00fczenleyici-yeni-\u015fablon-ekle-tek-yaz\u0131-ekle\" srcset=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-yeni-sablon-ekle-tek-yazi-ekle.jpg 628w, https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-yeni-sablon-ekle-tek-yazi-ekle-300x192.jpg 300w\" sizes=\"auto, (max-width: 400px) 100vw, 400px\" \/><\/li>\n\n\n\n<li>Bu formda;\n<ul class=\"wp-block-list\">\n<li>&#8220;<strong>T\u00fcm yaz\u0131lar<\/strong>&#8220;\u0131 se\u00e7ersek, olu\u015fturdu\u011fumuz \u015fablon, b\u00fct\u00fcn yaz\u0131lar i\u00e7in kullan\u0131lacakt\u0131r.<\/li>\n\n\n\n<li>&#8220;<strong>Yaz\u0131<\/strong>&#8220;y\u0131 se\u00e7ersek, kar\u015f\u0131m\u0131za kay\u0131tl\u0131 yaz\u0131lar\u0131n bir listesi gelecek, o listeden bir yaz\u0131 se\u00e7mek zorunda kalaca\u011f\u0131z.\n<ul class=\"wp-block-list\">\n<li>Yaz\u0131y\u0131 se\u00e7tikten sonra \u015fablonunu olu\u015fturaca\u011f\u0131m\u0131z sayfaya y\u00f6nlendirilece\u011fiz.<\/li>\n\n\n\n<li>Olu\u015fturdu\u011fumuz \u015fablon ise, web sitemizde, sadece se\u00e7ti\u011fimiz yaz\u0131y\u0131 sunmak i\u00e7in kullan\u0131lacakt\u0131r.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>E\u011fer se\u00e7ti\u011finiz \u00f6\u011fenin zaten bir \u015fablon dosyas\u0131 varsa kar\u015f\u0131m\u0131za haz\u0131rlanm\u0131\u015f bir \u015fablon \u00e7\u0131kacakt\u0131r, yoksa da bo\u015f bir \u015fablon dosyas\u0131 \u00e7\u0131kacakt\u0131r.\n<ul class=\"wp-block-list\">\n<li>Daha \u00f6nce haz\u0131rlad\u0131\u011f\u0131m\u0131z bir \u015fablon dosyas\u0131n\u0131 a\u00e7t\u0131ysak, \u00fczerinde de\u011fi\u015fiklikler yaparak kaydedebiliriz.<\/li>\n\n\n\n<li>Bo\u015f \u015fablon dosyalar\u0131nda diledi\u011fimiz \u015fablon par\u00e7alar\u0131n\u0131 veya bloklar\u0131 kullanarak bir \u015fablon dosyas\u0131 meydana getirir ve sonunda de\u011fi\u015fiklikleri kaydederiz.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"Hazir_Sablonlar\">Haz\u0131r \u015eablonlar<\/span><\/h3>\n\n\n\n<p><strong>Site d\u00fczenleyicisinin <\/strong>giri\u015f sayfas\u0131ndaki &#8220;<strong>Tasar\u0131m<\/strong>&#8221; men\u00fcs\u00fc vard\u0131r. Bu men\u00fcde, &#8220;<strong>\u015eablonlar<\/strong>&#8220;a t\u0131klad\u0131\u011f\u0131m\u0131zda bir alt men\u00fc a\u00e7\u0131l\u0131r demi\u015ftik. A\u00e7\u0131lan men\u00fcden &#8220;<strong>T\u00fcm \u015fablonlar\u0131 y\u00f6net<\/strong>&#8220;i se\u00e7ersek, tema dosyalar\u0131 ile birlikte gelen ve sonradan kullan\u0131c\u0131lar taraf\u0131ndan olu\u015fturulan \u015fablonlar\u0131n bir listesini g\u00f6r\u00fcr\u00fcz. Bu listede:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u00d6nceden haz\u0131rlanm\u0131\u015f \u015fablonlar\u0131 ad\u0131n\u0131n \u00fczerine t\u0131klayarak tekrar d\u00fczenleyebiliriz.<\/li>\n\n\n\n<li>Tema dosyalar\u0131 ile birlikte gelen bir \u015fablonda yap\u0131lan de\u011fi\u015fikleri iptal edebiliriz.<\/li>\n\n\n\n<li>Kullan\u0131c\u0131lar\u0131n olu\u015fturdu\u011fu \u015fablonlar\u0131 silebiliriz.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"Sablon_Editoru_Ile_Sablon_Hazirlama\">\u015eablon Edit\u00f6r\u00fc \u0130le \u015eablon Haz\u0131rlama<\/span><\/h3>\n\n\n\n<p>&#8220;<strong>\u015eablon Edit\u00f6r\u00fc<\/strong>&#8220;, WrodPress&#8217;in Blok Temalar\u0131 ile birlikte gelen bir \u00f6zelliktir. Klasik temalara bu \u00f6zellik sonradan eklenebilir. Bu edit\u00f6r, WordPress&#8217;in block edit\u00f6r\u00fc ile bir i\u00e7erik olu\u015ftururken &#8220;<strong>\u015eablon<\/strong>&#8221; ad\u0131yla kar\u015f\u0131m\u0131za \u00e7\u0131kar:<\/p>\n\n\n\n<div class=\"wp-block-group scmb-30 is-content-justification-center is-nowrap is-layout-flex wp-container-core-group-is-layout-94bc23d7 wp-block-group-is-layout-flex\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"413\" height=\"541\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-yeni-sablon-editoru-ile-sablon-ekle-duzenle-.jpg\" alt=\"WordPress-Blok-block-tabanl\u0131-tema-tasar\u0131m\u0131-site-d\u00fczenleyici-yeni-\u015fablon-edit\u00f6r\u00fc-ile-\u015fablon-ekle-d\u00fczenle-\" class=\"wp-image-6986\" srcset=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-yeni-sablon-editoru-ile-sablon-ekle-duzenle-.jpg 413w, https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-yeni-sablon-editoru-ile-sablon-ekle-duzenle--229x300.jpg 229w\" sizes=\"auto, (max-width: 413px) 100vw, 413px\" \/><\/figure>\n<\/div>\n\n\n\n<p>Yukar\u0131da da g\u00f6rd\u00fc\u011f\u00fcm\u00fcz gibi, <strong>\u015eablon Edit\u00f6r\u00fcn\u00fc<\/strong>, blok edit\u00f6r\u00fcn\u00fcn sa\u011f taraf\u0131nda a\u00e7\u0131lan &#8220;<strong>Ayarlar<\/strong>&#8221; yan men\u00fcs\u00fcnde, &#8220;<em>Kategori<\/em>&#8220;, &#8220;<em>\u00d6ne \u00e7\u0131kan g\u00f6rsel<\/em>&#8221; gibi ayarlar\u0131n\u0131 yapt\u0131\u011f\u0131m\u0131z sekmede g\u00f6r\u00fcr\u00fcz. Burada, &#8220;\u015eablon&#8221; \u00f6zelli\u011fi, o an olu\u015fturdu\u011fumuz i\u00e7eri\u011fin \u015fablonunu g\u00f6sterir. \u015eablonun kar\u015f\u0131s\u0131nda yazan isme t\u0131klad\u0131\u011f\u0131m\u0131zda bir popup men\u00fcs\u00fc a\u00e7\u0131l\u0131r. Bu men\u00fcde:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u0130\u00e7eri\u011fin \u015fablonunu de\u011fi\u015ftirebiliriz.<\/li>\n\n\n\n<li>Bir <strong>\u00f6zel \u015fablon<\/strong> ekleyebilir ve i\u00e7eri\u011fi o \u015fablon ile sergileyebiliriz.\n<ul class=\"wp-block-list\">\n<li>Haz\u0131rlad\u0131\u011f\u0131m\u0131z <strong>\u00f6zel \u015fablonlar\u0131<\/strong>, daha sonra diledi\u011fimiz herhangi bir i\u00e7erik i\u00e7in de kullanabiliriz.\n<ul class=\"wp-block-list\">\n<li>Bunu i\u00e7in herhangi i\u00e7eri\u011fi d\u00fczenlerken yine <strong>\u015fablon edit\u00f6r\u00fc<\/strong> yard\u0131m\u0131 ile o i\u00e7erik i\u00e7in haz\u0131rlad\u0131\u011f\u0131m\u0131z \u00f6zel \u015fablonu se\u00e7memiz yeterli olacakt\u0131r.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>O i\u00e7eri\u011fin \u015fablonun tekrar d\u00fczenleyebiliriz.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><span id=\"Sablon_Parcalari\">\u015eablon Par\u00e7alar\u0131<\/span><\/h2>\n\n\n\n<p><strong>\u015eablon par\u00e7as\u0131 (\u015fablon b\u00f6l\u00fcm\u00fc)<\/strong> bir \u00e7e\u015fit bloktur, sitemizi olu\u015fturmak i\u00e7in kullan\u0131l\u0131rlar. \u015eablon par\u00e7as\u0131, ba\u015fka bloklardan olu\u015fan bir kapsay\u0131c\u0131 bloktur. Birden \u00e7ok blok i\u00e7ermek zorunda de\u011fildir. Mesela sitelerin footer veya header k\u0131s\u0131mlar\u0131 genellikle birere \u015fablon par\u00e7as\u0131d\u0131r.<\/p>\n\n\n\n<p>\u015eablon par\u00e7alar\u0131, <strong>site d\u00fczenleyicisinde<\/strong> ya da <strong>blok edit\u00f6rde<\/strong>, yeni bir blok eklerken kar\u015f\u0131m\u0131za \u00e7\u0131kar.<\/p>\n\n\n\n<p>WordPress, \u015fablon par\u00e7alar\u0131n\u0131 <strong><code>wp_template_part<\/code><\/strong> ad\u0131nda bir i\u00e7erik tipi olarak saklar.<\/p>\n\n\n\n<p>\u015eablon par\u00e7alar\u0131 \u015fu niteliklerle (attributes) tan\u0131mlan\u0131r:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>slug<\/strong>: \u015eablon par\u00e7as\u0131n\u0131n kimli\u011fidir.<\/li>\n\n\n\n<li><strong>theme<\/strong>: Teman\u0131n slug de\u011feridir (T\u00fcrk\u00e7e karakter ve bo\u015fluk i\u00e7ermeyen ad\u0131). \u015eablon par\u00e7as\u0131n\u0131, \u015fablonlar\u0131n d\u0131\u015f\u0131nda bir yerde kullanmak istedi\u011fimizde kullanaca\u011f\u0131m\u0131z isimdir.\n<ul class=\"wp-block-list\">\n<li>Mesela \u015fablon par\u00e7as\u0131n\u0131 bir &#8220;<strong>blok modeli (block pattern)<\/strong>&#8221; i\u00e7inde kullanmak istedi\u011fimizde bu nitelikte verdi\u011fimiz isim ile \u00e7a\u011f\u0131r\u0131r\u0131z.<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li><strong>area<\/strong>: \u015eu 3 de\u011ferden birini al\u0131r:\n<ol class=\"wp-block-list\">\n<li>uncategorized (general),<\/li>\n\n\n\n<li>header<\/li>\n\n\n\n<li>footer<\/li>\n<\/ol>\n<\/li>\n\n\n\n<li><strong>tagName<\/strong>: \u015eablon par\u00e7as\u0131n\u0131 saracak HTML tag\u0131d\u0131r. \u015eu de\u011ferlerden biridir:\n<ul class=\"wp-block-list\">\n<li>header<\/li>\n\n\n\n<li>main<\/li>\n\n\n\n<li>section<\/li>\n\n\n\n<li>article<\/li>\n\n\n\n<li>aside<\/li>\n\n\n\n<li>footer<\/li>\n\n\n\n<li>div<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"Bir_Sablon_Parcasi_Nasil_Kodlanir\">Bir \u015eablon Par\u00e7as\u0131 Nas\u0131l Kodlan\u0131r?<\/span><\/h3>\n\n\n\n<p>Manuel olarak bir \u015fablon par\u00e7as\u0131 kodlamak i\u00e7in, bir HTML dosyas\u0131 olu\u015fturmal\u0131y\u0131z. Olu\u015fturdu\u011fumuz HTML dosyas\u0131n\u0131, temam\u0131z\u0131n ana dizinindeki <strong>parts<\/strong> klas\u00f6r\u00fcnde saklamal\u0131y\u0131z.<\/p>\n\n\n\n<p>Mesela b\u00fct\u00fcn \u015fablon dosyalar\u0131m\u0131zda kullanmak \u00fczere, site ba\u015fl\u0131\u011f\u0131n\u0131 i\u00e7eren <strong>header<\/strong> ad\u0131na bir \u015fablon par\u00e7as\u0131 olu\u015ftural\u0131m. Bunun i\u00e7in h\u0131zl\u0131 bir yol olarak \u015fu ad\u0131mlar\u0131 takip edebiliriz:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Teman\u0131n ana dizininde <strong><em>parts\/header.html<\/em><\/strong> dosyas\u0131 olu\u015fturulur.<\/li>\n\n\n\n<li>Y\u00f6netim panelinden <strong><em>Sayfalar->Yeni ekle<\/em><\/strong> sayfas\u0131na gidilir.<\/li>\n\n\n\n<li>A\u00e7\u0131lan sayfada <strong>blok edit\u00f6r<\/strong>de bir &#8220;<strong>Grup<\/strong>&#8221; blo\u011fu ve bu blo\u011fun i\u00e7erisinde &#8220;<strong>Site ba\u015fl\u0131\u011f\u0131<\/strong>&#8221; blo\u011fu olu\u015fturulur. (Biz \u00f6rnek olsun diye bu bloklar\u0131 se\u00e7tik, siz diledi\u011finiz bloklar\u0131 kullanabilirsiniz.)<\/li>\n\n\n\n<li>\u0130stenilen d\u00fczenlemeler yap\u0131l\u0131r.<\/li>\n\n\n\n<li><strong>Grup<\/strong> blo\u011funun ayarlar men\u00fcs\u00fc (\u00fcst \u00fcste 3 nokta) t\u0131klanarak &#8220;<strong><em>Blo\u011fu kaplaya<\/em><\/strong>&#8221; se\u00e7ilir.<\/li>\n\n\n\n<li>Kopyalanan i\u00e7erik, <strong>parts<\/strong> dizininde olu\u015fturdu\u011fumuz <strong>header.html<\/strong> dosyas\u0131na yap\u0131\u015ft\u0131r\u0131l\u0131r:<\/li>\n<\/ol>\n\n\n\n<p><code><strong>header.html<\/strong><\/code><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!-- wp:group {\"style\":{\"spacing\":{\"padding\":{\"top\":\"2em\",\"right\":\"2em\",\"bottom\":\"2em\",\"left\":\"2em\"}}},\"backgroundColor\":\"vivid-cyan-blue\",\"layout\":{\"type\":\"constrained\"}} -->&lt;div class=\"wp-block-group has-vivid-cyan-blue-background-color has-background\" style=\"padding-top:2em;padding-right:2em;padding-bottom:2em;padding-left:2em\">&lt;!-- wp:site-title \/-->&lt;\/div>&lt;!-- \/wp:group --><\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"Sablon_Parcalari_Bir_Sablon_Dosyasina_Nasil_Cagirilir\">\u015eablon Par\u00e7alar\u0131 Bir \u015eablon Dosyas\u0131na Nas\u0131l \u00c7a\u011f\u0131r\u0131l\u0131r?<\/span><\/h3>\n\n\n\n<p>\u015eablon par\u00e7as\u0131n\u0131n ad\u0131, o par\u00e7ay\u0131 yaratt\u0131\u011f\u0131m\u0131z HTML dosyas\u0131n\u0131n ad\u0131d\u0131r (uzant\u0131s\u0131n\u0131 dahil etmeden).<\/p>\n\n\n\n<p>\u015eablon par\u00e7alar\u0131 bir \u015fablon dosyas\u0131na \u015fu kal\u0131ba g\u00f6re \u00e7a\u011f\u0131r\u0131l\u0131r:<\/p>\n\n\n\n<p><code><strong>herhangi bir \u015fablon dosyas\u0131 (html format\u0131nda)<\/strong><\/code><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!-- wp:template-part {\"slug\":\"dosyasinin-adi\"} \/-->\r<\/code><\/pre>\n\n\n\n<p>Mesela, biraz \u00f6nceki \u00f6rnekte <strong>header.html<\/strong> dosyas\u0131 i\u00e7erisinde bir \u015fablon par\u00e7as\u0131 olu\u015fturmu\u015ftuk. Bu \u015fablon par\u00e7as\u0131n\u0131 \u00e7a\u011f\u0131rmak i\u00e7in \u015fu kodu yazmak yeterlidir:<\/p>\n\n\n\n<p><code><strong>herhangi bir \u015fablon dosyas\u0131 (html format\u0131nda)<\/strong><\/code><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!-- wp:template-part {\"slug\":\"header\"} \/-->\r<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span id=\"Sablon_Parcalarini_themejson_Dosyasina_Ekleme\">\u015eablon Par\u00e7alar\u0131n\u0131 theme.json Dosyas\u0131na Ekleme<\/span><\/h2>\n\n\n\n<p>Blok edit\u00f6rde yeni bir blok eklerken de kullanmak istiyorsak, olu\u015fturdu\u011fumuz \u015fablon par\u00e7alar\u0131n\u0131 temam\u0131z\u0131n <strong>theme.json<\/strong> dosyas\u0131na kaydetmeliyiz.<\/p>\n\n\n\n<p>A\u015fa\u011f\u0131da, <strong>header.html<\/strong> ve <strong>footer.html<\/strong> dosyalar\u0131 ile olu\u015fturulan \u015fablon par\u00e7alar\u0131n\u0131n <strong>theme.json<\/strong> dosyas\u0131na nas\u0131l kaydedildi\u011fini g\u00f6rmekteyiz:<\/p>\n\n\n\n<p><strong><code>theme.json<\/code><\/strong><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>{\n...\n\"templateParts\": &#91;\r\n\t{\r\n\t\t\"name\": \"header\",\r\n\t\t\"title\": \"Header\",\r\n\t\t\"area\": \"header\"\r\n\t},\r\n\t{\r\n\t\t\"name\": \"footer\",\r\n\t\t\"title\": \"Footer\",\r\n\t\t\"area\": \"footer\"\r\n\t}\r\n]\n...\n}\r<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"Site_Editoru_ile_Sablon_Parcasi_Olusturma\">Site Edit\u00f6r\u00fc ile \u015eablon Par\u00e7as\u0131 Olu\u015fturma<\/span><\/h3>\n\n\n\n<p><strong>Site D\u00fczenleyicinin<\/strong> giri\u015f sayfas\u0131nda bulunan &#8220;<strong>Tasar\u0131m<\/strong>&#8221; men\u00fcs\u00fcnde &#8220;<strong>\u015eablon par\u00e7alar\u0131<\/strong>&#8221; ad\u0131nda bir ba\u011flant\u0131 bulunmaktad\u0131r. Buraya t\u0131klad\u0131\u011f\u0131m\u0131zda, teman\u0131n sahip oldu\u011fu \u015fablon par\u00e7alar\u0131 &#8220;<strong>\u015eablon b\u00f6l\u00fcmleri<\/strong>&#8221; ba\u015fl\u0131\u011f\u0131 ile kar\u015f\u0131m\u0131za \u00e7\u0131kar. Temaya eklenen b\u00fct\u00fcn \u015fablon par\u00e7alar\u0131 bu g\u00f6l\u00fcmde listelenir.<\/p>\n\n\n\n<p>Temam\u0131za diledi\u011fimiz kadar \u015fablon par\u00e7as\u0131 ekleyebiliriz.<\/p>\n\n\n\n<p>Bir \u015fablon par\u00e7as\u0131 eklemek i\u00e7in \u015fu iki yolu kullanabiliriz:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>&#8220;<strong>\u015eablon B\u00f6l\u00fcmleri<\/strong>&#8221; ba\u015fl\u0131\u011f\u0131n\u0131n hemen yan\u0131ndaki &#8220;<strong>+<\/strong>&#8221; i\u015faretini t\u0131klar\u0131z.<\/li>\n\n\n\n<li>&#8220;<strong>\u015eablon  B\u00f6l\u00fcmleri<\/strong>&#8221; ba\u015fl\u0131\u011f\u0131n\u0131n alt\u0131ndaki listenin sonunda bulunan &#8220;<strong>T\u00fcm \u015fablon b\u00f6l\u00fcmlerini y\u00f6net<\/strong>&#8221; ba\u011flant\u0131s\u0131n\u0131 t\u0131klar\u0131z.\n<ul class=\"wp-block-list\">\n<li>Ekli olan \u015fablon par\u00e7alar\u0131n\u0131 listeleyen bir sayfa a\u00e7\u0131lacakt\u0131r.\n<ul class=\"wp-block-list\">\n<li>A\u00e7\u0131lan sayfan\u0131n sa\u011f \u00fcst k\u00f6\u015fesindeki &#8220;<strong>Yeni ekle<\/strong>&#8221; butonuna t\u0131klar\u0131z.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n\n\n\n<div class=\"wp-block-group scmb-30 has-white-background-color has-background is-content-justification-center is-nowrap is-layout-flex wp-container-core-group-is-layout-94bc23d7 wp-block-group-is-layout-flex\">\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-Tema-Kodlama-Site-Duzenleyicisi-Sablon-Parcalari-Bolumleri-Alt-Menusu.gif\" alt=\"WordPress-Blok-Tema-Kodlama-Site-D\u00fczenleyicisi-\u015eablon-Par\u00e7alar\u0131-B\u00f6l\u00fcmleri-Alt-Men\u00fcs\u00fc\" class=\"wp-image-7049\" width=\"242\" height=\"392\"\/><\/figure>\n<\/div>\n\n\n\n<p>Hangi yolla olursa olsun bir \u015fablon par\u00e7as\u0131 eklemek i\u00e7in t\u0131klad\u0131\u011f\u0131m\u0131zda kar\u015f\u0131m\u0131za \u00f6nce &#8220;<strong>Bir \u015fablon b\u00f6l\u00fcm\u00fc olu\u015ftur<\/strong>&#8221; ad\u0131nda bir form \u00e7\u0131kar:<\/p>\n\n\n\n<div class=\"wp-block-group scmb-30 is-content-justification-center is-nowrap is-layout-flex wp-container-core-group-is-layout-94bc23d7 wp-block-group-is-layout-flex\">\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-yeni-sablon-editoru-ile-sablon-parcasi-ekle-duzenle-.jpg\" alt=\"WordPress-Blok-block-tabanl\u0131-tema-tasar\u0131m\u0131-site-d\u00fczenleyici-yeni-\u015fablon-edit\u00f6r\u00fc-ile-\u015fablon-par\u00e7as\u0131-ekle-d\u00fczenle-\" class=\"wp-image-7059\" width=\"400\" height=\"406\" srcset=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-yeni-sablon-editoru-ile-sablon-parcasi-ekle-duzenle-.jpg 533w, https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-yeni-sablon-editoru-ile-sablon-parcasi-ekle-duzenle--296x300.jpg 296w\" sizes=\"auto, (max-width: 400px) 100vw, 400px\" \/><\/figure>\n<\/div>\n\n\n\n<p>Bu formda, yapmam\u0131z gereken, \u015fablon par\u00e7as\u0131n\u0131n ad\u0131n\u0131 girmek ve alan\u0131n\u0131 se\u00e7mektir.<\/p>\n\n\n\n<p>Ad verirken kendinizi \u00f6zg\u00fcr hissedebilirsiniz fakat verdi\u011finiz addaki T\u00fcrk\u00e7e karakterleri \u0130ngilizceleri yer de\u011fi\u015ftirip, bo\u015fluklar\u0131n yerine de tire koyarsan\u0131z, \u015fablon par\u00e7an\u0131z\u0131n kimli\u011fini elde edersiniz. Bu kimlik, bu \u015fablon par\u00e7as\u0131n\u0131 \u00e7a\u011f\u0131rman\u0131z gerekti\u011finde laz\u0131m olacakt\u0131r.<\/p>\n\n\n\n<p>Daha sonra &#8220;<strong>Olu\u015ftur<\/strong>&#8221; diyerek \u015fablon par\u00e7am\u0131z\u0131 veritaban\u0131na kaydetmi\u015f oluruz. Bu a\u015famadan sonra d\u00fczenleyici bizi \u015fablon par\u00e7as\u0131n\u0131 tasarlay\u0131p d\u00fczenleyebilece\u011fimiz sayfaya y\u00f6nlendirecektir.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span id=\"Sablonlarda_Yapilan_Degisiklikler_Nerede_Kaydedilir\">\u015eablonlarda Yap\u0131lan De\u011fi\u015fiklikler Nerede Kaydedilir?<\/span><\/h2>\n\n\n\n<p>\u015eablonlarda veya \u015fablon par\u00e7alar\u0131nda de\u011fi\u015fiklik yapman\u0131n 2 yolu vard\u0131r:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Site d\u00fczenleyicisi ile<\/li>\n\n\n\n<li>\u015eablonun\/par\u00e7as\u0131n\u0131n HTML dosyas\u0131n\u0131 do\u011frudan de\u011fi\u015ftirerek<\/li>\n<\/ul>\n\n\n\n<p>Site d\u00fczenleyici ile yapt\u0131\u011f\u0131n\u0131z de\u011fi\u015fiklikler veritaban\u0131nda saklan\u0131r ve \u015fablonun HTML dosyas\u0131na etki etmez. Site d\u00fczenleyici ile yapt\u0131\u011f\u0131n\u0131z de\u011fi\u015fikliklerin \u00f6nceli\u011fi veya \u00fcst\u00fcnl\u00fc\u011f\u00fc vard\u0131r.<\/p>\n\n\n\n<p>HTML dosyas\u0131ndaki kodlarda yapt\u0131\u011f\u0131n\u0131z de\u011fi\u015fiklikler \u015fablonda hemen g\u00f6r\u00fcnmez. Bu de\u011fi\u015fikliklerin \u015fablonda g\u00f6r\u00fcnmesini istiyorsan\u0131z yapman\u0131z gereken \u015fudur:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u015eablon\/par\u00e7as\u0131 &#8220;<strong>Site D\u00fczenleyicisi<\/strong>&#8221; ile a\u00e7\u0131l\u0131r.<\/li>\n\n\n\n<li>D\u00fczenleme sayfas\u0131n\u0131n sa\u011f taraftaki &#8220;<strong>Ayarlar<\/strong>&#8221; men\u00fcs\u00fc a\u00e7\u0131l\u0131r ve &#8220;<strong>\u015eablon<\/strong>&#8221; sekmesinde oldu\u011fundan emin olunur:<br><img loading=\"lazy\" decoding=\"async\" width=\"250\" height=\"178\" class=\"wp-image-7090\" style=\"width: 250px;\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-Tema-Kodlama-Site-Duzenleyicisi-Sablon-Parcalari-HTML-kodlarini-degistirme-gorme.gif\" alt=\"WordPress-Blok-Tema-Kodlama-Site-D\u00fczenleyicisi-\u015eablon-Par\u00e7alar\u0131-HTML-kodlar\u0131n\u0131-de\u011fi\u015ftirme-g\u00f6rme\"><\/li>\n\n\n\n<li>Sekmede, \u015fablon ad\u0131n\u0131n kar\u015f\u0131s\u0131nda bulunan 3 nokta t\u0131klan\u0131r.\n<ul class=\"wp-block-list\">\n<li>Burada 3 nokta g\u00f6rm\u00fcyorsan\u0131z geri alabilece\u011finiz bir de\u011fi\u015fiklik yap\u0131lmam\u0131\u015f demektir.<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>A\u00e7\u0131lan popup men\u00fcde, &#8220;<strong>\u00d6zelle\u015ftirmeleri temizle<\/strong>&#8221; ba\u011flant\u0131s\u0131 t\u0131klan\u0131r.<\/li>\n<\/ul>\n\n\n\n<div class=\"wp-block-group has-white-background-color has-background is-content-justification-center is-nowrap is-layout-flex wp-container-core-group-is-layout-94bc23d7 wp-block-group-is-layout-flex\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"299\" height=\"304\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-yeni-sablon-editoru-ile-sablon-parcasi-HTML-kodlari-degisirse.jpg\" alt=\"WordPress-Blok-block-tabanl\u0131-tema-tasar\u0131m\u0131-site-d\u00fczenleyici-yeni-\u015fablon-edit\u00f6r\u00fc-ile-\u015fablon-par\u00e7as\u0131-HTML-kodlar\u0131-de\u011fi\u015firse\" class=\"wp-image-7077\" srcset=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-yeni-sablon-editoru-ile-sablon-parcasi-HTML-kodlari-degisirse.jpg 299w, https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2023\/06\/WordPress-Blok-block-tabanli-tema-tasarimi-site-duzenleyici-yeni-sablon-editoru-ile-sablon-parcasi-HTML-kodlari-degisirse-295x300.jpg 295w\" sizes=\"auto, (max-width: 299px) 100vw, 299px\" \/><\/figure>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Blok tabanl\u0131 bir WordPress Temas\u0131 kodlarken \u015fablonlar ve \u015fablon par\u00e7alar\u0131 nas\u0131l olu\u015fturulur.<\/p>\n","protected":false},"author":1,"featured_media":6724,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[264],"tags":[265],"class_list":["post-6829","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress-blok-tabanli-tema-kodlama","tag-blok-tema-kodlama"],"_links":{"self":[{"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/posts\/6829","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/comments?post=6829"}],"version-history":[{"count":2,"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/posts\/6829\/revisions"}],"predecessor-version":[{"id":7096,"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/posts\/6829\/revisions\/7096"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/media\/6724"}],"wp:attachment":[{"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/media?parent=6829"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/categories?post=6829"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/tags?post=6829"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}