{"id":1848,"date":"2019-05-15T03:36:52","date_gmt":"2019-05-15T00:36:52","guid":{"rendered":"https:\/\/sitecenneti.com\/wordpress\/?p=1848"},"modified":"2019-05-18T05:54:35","modified_gmt":"2019-05-18T02:54:35","slug":"4-2-sayfalara-ust-kisim-gorseli-ekleme-resim","status":"publish","type":"post","link":"https:\/\/sitecenneti.com\/wordpress\/wordpress-tema-yapimi\/4-2-sayfalara-ust-kisim-gorseli-ekleme-resim\/","title":{"rendered":"4.2 Sayfalara \u00dcst K\u0131s\u0131m G\u00f6rseli Ekleme &#8211; Resim"},"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=\"#Add_theme_support_Fonksiyonu\"><span class=\"toc_number toc_depth_1\">1<\/span> Add_theme_support Fonksiyonu<\/a><\/li><li><a href=\"#Add_theme_support_Fonksiyonunun_Ikinci_Parametresi\"><span class=\"toc_number toc_depth_1\">2<\/span> Add_theme_support Fonksiyonunun \u0130kinci Parametresi<\/a><ul><li><a href=\"#default-image\"><span class=\"toc_number toc_depth_2\">2.1<\/span> default-image<\/a><\/li><li><a href=\"#random-default\"><span class=\"toc_number toc_depth_2\">2.2<\/span> random-default<\/a><\/li><li><a href=\"#header-text\"><span class=\"toc_number toc_depth_2\">2.3<\/span> header-text<\/a><\/li><li><a href=\"#default-text-color\"><span class=\"toc_number toc_depth_2\">2.4<\/span> default-text-color<\/a><\/li><li><a href=\"#width\"><span class=\"toc_number toc_depth_2\">2.5<\/span> width<\/a><\/li><li><a href=\"#height\"><span class=\"toc_number toc_depth_2\">2.6<\/span> height<\/a><\/li><li><a href=\"#flex-width\"><span class=\"toc_number toc_depth_2\">2.7<\/span> flex-width<\/a><\/li><li><a href=\"#flex-heigh\"><span class=\"toc_number toc_depth_2\">2.8<\/span> flex-heigh<\/a><\/li><li><a href=\"#uploads\"><span class=\"toc_number toc_depth_2\">2.9<\/span> uploads<\/a><\/li><li><a href=\"#wp-head-callback\"><span class=\"toc_number toc_depth_2\">2.10<\/span> wp-head-callback<\/a><\/li><li><a href=\"#admin-head-callback\"><span class=\"toc_number toc_depth_2\">2.11<\/span> admin-head-callback<\/a><\/li><li><a href=\"#admin-preview-callback\"><span class=\"toc_number toc_depth_2\">2.12<\/span> admin-preview-callback<\/a><\/li><li><a href=\"#video\"><span class=\"toc_number toc_depth_2\">2.13<\/span> video<\/a><\/li><li><a href=\"#video-active-callback\"><span class=\"toc_number toc_depth_2\">2.14<\/span> video-active-callback<\/a><\/li><li><a href=\"#Ornek-1\"><span class=\"toc_number toc_depth_2\">2.15<\/span> \u00d6rnek-1<\/a><\/li><\/ul><\/li><li><a href=\"#Birden_Fazla_Varsayilan_Ust_Kisim_Resmi_Kullanma\"><span class=\"toc_number toc_depth_1\">3<\/span> Birden Fazla Varsay\u0131lan \u00dcst K\u0131s\u0131m Resmi Kullanma<\/a><ul><li><a href=\"#Ornek-2\"><span class=\"toc_number toc_depth_2\">3.1<\/span> \u00d6rnek-2<\/a><\/li><\/ul><\/li><\/ul><\/div>\n\n<p>WordPress temalar\u0131, y\u00f6netim paneli ile, sayfa \u00fcstlerine, resim, video gibi ortam dosyalar\u0131 y\u00fcklemenize izin verir. Teman\u0131za, bu \u00f6zelli\u011fi kazand\u0131rmak i\u00e7in <code>functions.php<\/code> dosyan\u0131za, a\u015fa\u011f\u0131da bahsetti\u011fimiz kodlar\u0131 eklemeniz gerekmektedir. Bu kodlardan sonra, y\u00f6netim panelinden, <strong>G\u00f6r\u00fcn\u00fcm-&gt;\u00d6zelle\u015ftir-&gt;\u00dcst k\u0131s\u0131m g\u00f6rseli<\/strong> men\u00fcs\u00fc ile, sayfa \u00fcst\u00fc g\u00f6rsellerinizi, diledi\u011finiz gibi y\u00f6netebilirsiniz.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span id=\"Add_theme_support_Fonksiyonu\">Add_theme_support Fonksiyonu<\/span><\/h2>\n\n\n\n<p>Bir WordPress temam\u0131z\u0131n, <strong>\u00dcst k\u0131s\u0131m g\u00f6rseli<\/strong> men\u00fcs\u00fcne sahip olabilmesi i\u00e7in, bir <a rel=\"noreferrer noopener\" aria-label=\"tema fonksiyonu (yeni sekmede a\u00e7\u0131l\u0131r)\" href=\"https:\/\/sitecenneti.com\/wordpress\/wordpress-tema-yapimi\/2-10-tema-fonksiyonlari\/\" target=\"_blank\">tema fonksiyonu<\/a> olan, <code>add_theme_support()<\/code> fonksiyonunu a\u015fa\u011f\u0131daki parametre ile kullanmal\u0131y\u0131z:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>add_theme_support('custom-header');<\/code><\/pre>\n\n\n\n<p>Fonksiyon, bir <a rel=\"noreferrer noopener\" aria-label=\"bir tema fonksiyonu (yeni sekmede a\u00e7\u0131l\u0131r)\" href=\"https:\/\/sitecenneti.com\/wordpress\/wordpress-tema-yapimi\/2-10-tema-fonksiyonlari\/\" target=\"_blank\">tema fonksiyonu<\/a> oldu\u011fu i\u00e7in, bu fonksiyonu kapsay\u0131c\u0131 bir fonksiyonun i\u00e7ine al\u0131p (<code>ilktemam_setup<\/code> gibi), kapsay\u0131c\u0131 fonksiyonu da   <code>after_setup_theme<\/code> kancas\u0131 ile \u00e7a\u011f\u0131rmadan \u00e7al\u0131\u015fmaz. A\u015fa\u011f\u0131da bunun nas\u0131l yap\u0131laca\u011f\u0131 g\u00f6sterilmi\u015ftir:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>if ( ! function_exists( 'ilktemam_setup' ) ) :  \/\/ isim kar\u0131\u015f\u0131kl\u0131\u011f\u0131n\u0131 engelliyoruz\n  function ilktemam_setup() { \/\/ kapsay\u0131c\u0131 fonksiyon\n\n   \/\/ \u00dcst k\u0131s\u0131m g\u00f6rseli ile ilgili b\u00fct\u00fcn kodlar bu b\u00f6lgede olmal\u0131d\u0131r.\n   add_theme_support('custom-header');\n\n  }\nendif;\nadd_action( 'after_setup_theme', 'ilktemam_setup' ); \/\/ tema fonksiyonlar\u0131 bu kanca ile \u00e7al\u0131\u015f\u0131r<\/code><\/pre>\n\n\n\n<p>Fonksiyonu, yukar\u0131daki haliyle kullanmak, <strong>Y\u00f6netim Paneli : G\u00f6r\u00fcn\u00fcm -&gt; \u00d6zelle\u015ftir<\/strong> sayfan\u0131za &#8220;<strong>\u00dcst k\u0131s\u0131m g\u00f6rseli<\/strong>&#8221; ad\u0131nda bir men\u00fc eklenmesine sebep olur:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img loading=\"lazy\" decoding=\"async\" width=\"299\" height=\"654\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2019\/05\/wordpress-temasina-ust-kisim-g\u00f6rseli-ekleme.png\" alt=\"\" class=\"wp-image-2263\" srcset=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2019\/05\/wordpress-temasina-ust-kisim-g\u00f6rseli-ekleme.png 299w, https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2019\/05\/wordpress-temasina-ust-kisim-g\u00f6rseli-ekleme-137x300.png 137w\" sizes=\"auto, (max-width: 299px) 100vw, 299px\" \/><figcaption>Temam\u0131z \u0130\u00e7in Bir \u00dcst K\u0131s\u0131m G\u00f6rseli Men\u00fcs\u00fc Ekledik<\/figcaption><\/figure><\/div>\n\n\n\n<p>Bu men\u00fcye t\u0131klad\u0131\u011f\u0131m\u0131zda, \u015fu \u015fekilde bir sayfa ile kar\u015f\u0131la\u015f\u0131r\u0131z:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img loading=\"lazy\" decoding=\"async\" width=\"299\" height=\"654\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2019\/05\/wordpress-temasina-ust-kisim-gorseli-ekleme-2.png\" alt=\"\" class=\"wp-image-2265\" srcset=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2019\/05\/wordpress-temasina-ust-kisim-gorseli-ekleme-2.png 299w, https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2019\/05\/wordpress-temasina-ust-kisim-gorseli-ekleme-2-137x300.png 137w\" sizes=\"auto, (max-width: 299px) 100vw, 299px\" \/><figcaption> <br>Ekledi\u011fimiz \u00dcst K\u0131s\u0131m G\u00f6rseli Men\u00fcs\u00fcne T\u0131klad\u0131k <\/figcaption><\/figure><\/div>\n\n\n\n<p>Bu sayfada g\u00f6rd\u00fc\u011f\u00fcn\u00fcz, &#8220;Yeni g\u00f6rsel ekle&#8221; butonu, \u00e7al\u0131\u015f\u0131r ve istedi\u011finiz kadar \u00fcst k\u0131s\u0131m g\u00f6rseli ekleyebilir veya ekledi\u011finiz g\u00f6rselleri kald\u0131rabilirsiniz.<\/p>\n\n\n\n<p>Burada y\u00fckledi\u011finiz g\u00f6rseli, \u00fcst k\u0131s\u0131m g\u00f6rseli olarak kullanmak i\u00e7in, <code>header.php<\/code> <a rel=\"noreferrer noopener\" aria-label=\"\u015fablon par\u00e7as\u0131n\u0131n (yeni sekmede a\u00e7\u0131l\u0131r)\" href=\"https:\/\/sitecenneti.com\/wordpress\/wordpress-tema-yapimi\/2-1-sablon-template-dosyalari\/#Sablon_Parcalari\" target=\"_blank\">\u015fablon par\u00e7as\u0131n\u0131n<\/a>, uygun g\u00f6rd\u00fc\u011f\u00fcn\u00fcz bir yerine, a\u015fa\u011f\u0131daki kodu eklemeniz yeterlidir.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;img src=\"&lt;?php header_image(); ?>\"><\/code><\/pre>\n\n\n\n<p>Dilerseniz, bu g\u00f6rsel t\u0131kland\u0131\u011f\u0131nda, teman\u0131z her zaman ana sayfan\u0131za da y\u00f6nlendirebilir. O da \u015fu \u015fekilde olacakt\u0131r:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code> &lt;a href=\"&lt;?php echo esc_url( home_url( '\/' ) ); ?>\" rel=\"home\">\n    &lt;img src=\"&lt;?php header_image(); ?>\">\n &lt;\/a><\/code><\/pre>\n\n\n\n<p>Daha d\u00fczenli bir HTML yap\u0131s\u0131 i\u00e7in, bu g\u00f6rseli teman\u0131za \u015fu \u015fekilde eklemeyi de d\u00fc\u015f\u00fcnebilirsiniz:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;div id=\"ust-kisim-gorseli\"> \n   &lt;a href=\"&lt;?php echo esc_url( home_url( '\/' ) ); ?>\" rel=\"home\">\n    &lt;img src=\"&lt;?php header_image(); ?>\">\n   &lt;\/a>\n&lt;\/div><\/code><\/pre>\n\n\n\n<p>Ekledi\u011finiz g\u00f6rselin, belli bir geni\u015flik\/y\u00fckseklik de\u011ferinin olmas\u0131n\u0131 sa\u011flayabilirsiniz. Bunu yapman\u0131n yolu, <code>add_theme_support()<\/code> fonksiyonunun ikinci parametresini kullanmakt\u0131r.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span id=\"Add_theme_support_Fonksiyonunun_Ikinci_Parametresi\">Add_theme_support Fonksiyonunun \u0130kinci Parametresi<\/span><\/h2>\n\n\n\n<p>Kullanaca\u011f\u0131m\u0131z \u00fcst k\u0131s\u0131m g\u00f6rsellerini, y\u00fckleme a\u015famas\u0131nda k\u0131rpabiliriz veya temam\u0131z ile birlikte her zaman g\u00f6r\u00fcnecek bir varsay\u0131lan \u00fcst k\u0131s\u0131m resmi kullanabiliriz veya bu g\u00f6rsele daha ba\u015fka kontroller ekleyebiliriz. Bahsetti\u011fimiz bu kontroller, <code>add_theme_support('custom-header', $argumanlar)<\/code> fonksiyonunun <code>$argumanlar<\/code> parametresi ile yap\u0131l\u0131r. Bu parametre, fonksiyonun, ikinci parametresidir ve iste\u011fe ba\u011fl\u0131d\u0131r.<\/p>\n\n\n\n<p><code>$argumanlar<\/code> parametresi, bir dizidir ve \u00e7e\u015fitli arg\u00fcmanlar\u0131 vard\u0131r. Bu arg\u00fcmanlar\u0131n , varsay\u0131lan de\u011ferleri ile birlikte, tamam\u0131 a\u015fa\u011f\u0131da verilmi\u015ftir:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>$argumanlar = array(\n                'default-image'          => '',\n                'random-default'         => false,\n                'width'                  => 0,\n                'height'                 => 0,\n                'flex-height'            => false,\n                'flex-width'             => false,\n                'default-text-color'     => '',\n                'header-text'            => true,\n                'uploads'                => true,\n                'wp-head-callback'       => '',\n                'admin-head-callback'    => '',\n                'admin-preview-callback' => '',\n                'video'                  => false,\n                'video-active-callback'  => 'is_front_page',\n            );<\/code><\/pre>\n\n\n\n<p>E\u011fer, <code>add_theme_support('custom-header', $argumanlar)<\/code> fonksiyonunun ikinci parametresini bo\u015f b\u0131rak\u0131rsan\u0131z, WordPress, \u00fcst k\u0131s\u0131m g\u00f6rselleriniz i\u00e7in, arg\u00fcmanlar\u0131n yukar\u0131daki de\u011ferlerini kullan\u0131r.<\/p>\n\n\n\n<p>Parametrenin arg\u00fcmanlar\u0131n\u0131 teker teker incelersek:<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"default-image\">default-image<\/span><\/h3>\n\n\n\n<p>Yer tutucu <em>\u00fcst k\u0131s\u0131m g\u00f6rseli<\/em> olarak kullan\u0131lacak, bir resim linki olmal\u0131d\u0131r ve varsay\u0131lan de\u011feri bo\u015ftur. Teman\u0131z, ilk defa y\u00fcklendi\u011finde, bir \u00fcst k\u0131s\u0131m g\u00f6rseli ile birlikte kurulmu\u015f olmas\u0131n\u0131 istiyorsan\u0131z, kullan\u0131c\u0131n\u0131z, yeni bir resim ekleyene kadar, bu resmi yer tutucu olarak kullanabilirsiniz.<\/p>\n\n\n\n<p>Bu arg\u00fcmanda belirtti\u011finiz resmi, \u015fablon dosyan\u0131zda kullanmak i\u00e7in a\u015fa\u011f\u0131daki ifadeyi kullanmal\u0131s\u0131n\u0131z:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;img src=\"&lt;?php echo get_custom_header()->url; ?>\"><\/code><\/pre>\n\n\n\n<p>E\u011fer bu resmi, arg\u00fcmanlarda girdi\u011fimiz, geni\u015flik ve y\u00fckseklik de\u011ferlerini de kullanarak, temam\u0131za \u00e7a\u011f\u0131rmak istersek, \u015fu kodu kullan\u0131yoruz:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;img src=\"&lt;?php echo get_custom_header()->url; ?>\" \n  width=\"&lt;?php echo absint( get_custom_header()->width ); ?>\" \n  height=\"&lt;?php echo absint( get_custom_header()->height ); ?>\" \n  alt=\"&lt;?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>\">\n<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"random-default\">random-default<\/span><\/h3>\n\n\n\n<p><code>true\/false<\/code> de\u011ferini al\u0131r. <code>true<\/code> de\u011feri atad\u0131\u011f\u0131m\u0131z ve birden \u00e7ok \u00fcst k\u0131s\u0131m g\u00f6rseli kulland\u0131\u011f\u0131m\u0131z zaman, web sayfas\u0131 tazelendi\u011finde, rastgele se\u00e7ilen fakl\u0131 bir g\u00f6rselin g\u00f6sterilmesini sa\u011flar. (Bu arg\u00fcman, farkl\u0131 \u015fekillerde test etmeme ra\u011fmen, <em><strong>\u00dcst k\u0131s\u0131m g\u00f6rseli<\/strong><\/em> men\u00fcs\u00fcn\u00fcn kullan\u0131m\u0131nda bir fark g\u00f6remedim.)<\/p>\n\n\n\n<p> Asl\u0131nda bu \u00f6zelli\u011fi kullanmak i\u00e7in, alttaki resimde g\u00f6rd\u00fc\u011f\u00fcn\u00fcz &#8220;<strong>Y\u00fcklenen ba\u015fl\u0131klarda rastgele<\/strong>&#8221; ad\u0131ndaki butonu kullanabilirsiniz.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img loading=\"lazy\" decoding=\"async\" width=\"279\" height=\"481\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2019\/05\/ust-kisim-resmi-ekle-rastgele-secim.png\" alt=\"\" class=\"wp-image-2397\" srcset=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2019\/05\/ust-kisim-resmi-ekle-rastgele-secim.png 279w, https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2019\/05\/ust-kisim-resmi-ekle-rastgele-secim-174x300.png 174w\" sizes=\"auto, (max-width: 279px) 100vw, 279px\" \/><figcaption>WordPress \u00dcst K\u0131s\u0131m Resmi Ekleme &#8211; Y\u00fcklene Ba\u015fl\u0131klarda Rastgele Butonu<\/figcaption><\/figure><\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"header-text\">header-text<\/span><\/h3>\n\n\n\n<p><code>true\/false<\/code> de\u011ferini al\u0131r. Normalde, \u00fcst k\u0131s\u0131m g\u00f6rsellerinin \u00fczerine yaz\u0131 ekleme \u00f6zelli\u011fini y\u00f6netmesi gerekiyor fakat ke\u015ffedebildi\u011fim tek \u00f6zelli\u011fi,  <code>false<\/code> de\u011feri atand\u0131\u011f\u0131nda, <code>NO_HEADER_TEXT<\/code> sabitine 1 de\u011ferini atamas\u0131 oldu. (Bir \u00e7ok varyasyonu denedim, bir \u00e7ok yabanc\u0131 kayna\u011f\u0131 ara\u015ft\u0131rd\u0131m ama ba\u015fka ne i\u015fe yarad\u0131\u011f\u0131n\u0131 bulamad\u0131m. Bu konuda bizi ayd\u0131nlatacak arkada\u015flar, yorumlar\u0131n\u0131z\u0131 bekliyorum.)<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"default-text-color\">default-text-color<\/span><\/h3>\n\n\n\n<p><strong>header-text<\/strong> i\u00e7in varsay\u0131lan bir font rengi atar. Burada girdi\u011fimiz font rengi, WordPress&#8217;in olu\u015fturdu\u011fu bir PHP sabiti olan, <code>HEADER_TEXTCOLOR<\/code> sabitine de\u011fer olarak atan\u0131r.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"width\">width<\/span><\/h3>\n\n\n\n<p>G\u00f6rselin pixel cinsinden geni\u015fli\u011fidir. WordPress, g\u00f6rselin, sadece bu geni\u015flikte k\u0131rp\u0131lmas\u0131na izin verir.<\/p>\n\n\n\n<p>Burada verdi\u011finiz geni\u015flik de\u011ferini, \u015fablonlar\u0131n\u0131zda, \u015fu \u015fekilde \u00e7a\u011f\u0131rabilirsiniz:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;?php echo absint( get_custom_header()->width);<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"height\">height<\/span><\/h3>\n\n\n\n<p>G\u00f6rselin pixel cinsinden y\u00fcksekli\u011fidir. WordPress, g\u00f6rselin, sadece bu y\u00fckseklikte k\u0131rp\u0131lmas\u0131na izin verir. <\/p>\n\n\n\n<p>Burada verdi\u011finiz y\u00fckseklik de\u011ferini, \u015fablonlar\u0131n\u0131zda, \u015fu \u015fekilde \u00e7a\u011f\u0131rabilirsiniz:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;?php echo absint( get_custom_header()->height);<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"flex-width\">flex-width<\/span><\/h3>\n\n\n\n<p><code>true\/false<\/code> de\u011ferini al\u0131r. Bu arg\u00fcman <code>true<\/code> de\u011ferini ald\u0131\u011f\u0131nda,  k\u0131rpma i\u015flemi esnas\u0131nda, g\u00f6rselin geni\u015fli\u011fini fare ile de\u011fi\u015ftirebiliriz. <\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"flex-heigh\">flex-heigh<\/span><\/h3>\n\n\n\n<p><code>true\/false<\/code> de\u011ferini al\u0131r. Bu arg\u00fcman <code>true<\/code> de\u011ferini ald\u0131\u011f\u0131nda,  k\u0131rpma i\u015flemi esnas\u0131nda, g\u00f6rselin y\u00fcksekli\u011fini fare ile de\u011fi\u015ftirebiliriz.  <\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"uploads\">uploads<\/span><\/h3>\n\n\n\n<p><code>true\/false<\/code> de\u011ferini al\u0131r. Y\u00f6netim panelinden, g\u00f6rsel y\u00fckleme \u00f6zelli\u011fini etkinle\u015ftirir. (Yine bir \u00e7ok \u015fekilde test ettim, fakat bu arg\u00fcman\u0131n de\u011feri ne olursa olsun, g\u00f6rsel y\u00fckleme \u00f6zelli\u011fi \u00e7al\u0131\u015f\u0131yor fakat <code>false<\/code> de\u011ferini ald\u0131\u011f\u0131nda, g\u00f6rseli k\u0131rparken hata mesaj\u0131 ile kar\u015f\u0131la\u015f\u0131l\u0131yor. Daha sa\u011fl\u0131kl\u0131 bir bilgisi olan varsa yorumlar\u0131n\u0131 bekliyorum.)<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"wp-head-callback\"><strong>wp-head-callback<\/strong><\/span><\/h3>\n\n\n\n<p>Teman\u0131n \u00fcst k\u0131sm\u0131ndan \u00e7a\u011f\u0131r\u0131lacak fonksiyondur.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"admin-head-callback\"><strong>admin-head-callback<\/strong><\/span><\/h3>\n\n\n\n<p>Y\u00f6netim panelindeki \u00f6zelle\u015ftirme sayfas\u0131n\u0131n \u00fcst k\u0131sm\u0131ndan \u00e7a\u011f\u0131r\u0131lacak fonksiyondur.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"admin-preview-callback\"><strong>admin-preview-callback<\/strong><\/span><\/h3>\n\n\n\n<p>Y\u00f6netim ekran\u0131nda, \u00f6n izleme kodu \u00fcretecek fonksiyondur.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"video\">video<\/span><\/h3>\n\n\n\n<p><code>true\/false<\/code> de\u011ferini al\u0131r. \u00dcst k\u0131s\u0131m g\u00f6rseli olarak video kullan\u0131m\u0131n\u0131 y\u00f6netir. (\u00dcst k\u0131s\u0131m g\u00f6rseli olarak video ekleme konusu, bir sonraki derste ele al\u0131nacakt\u0131r.)<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"video-active-callback\">video-active-callback<\/span><\/h3>\n\n\n\n<p>\u00dcst k\u0131s\u0131mda, bir video kullan\u0131ld\u0131\u011f\u0131nda \u00e7al\u0131\u015fmak \u00fczere olu\u015fturulan fonksiyondur.<\/p>\n\n\n\n<p>Arg\u00fcmanlar\u0131n \u00e7oklu\u011fu g\u00f6z\u00fcn\u00fcz\u00fc korkutmas\u0131n. Genellikle kullan\u0131lanlar bellidir. A\u015fa\u011f\u0131daki \u00f6rne\u011fe dikkat edelim. <\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"Ornek-1\">\u00d6rnek-1<\/span><\/h3>\n\n\n\n<p>Arg\u00fcmanlar\u0131 ayarl\u0131yoruz ve <code>add_theme_support( 'custom-header' )<\/code> fonksiyonunu bu arg\u00fcmanlar ile birlikte tetikliyoruz:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>if ( ! function_exists( 'ilktemam_setup' ) ) :  \/\/ isim kar\u0131\u015f\u0131kl\u0131\u011f\u0131n\u0131 engelliyoruz\n  function ilktemam_setup() { \/\/ kapsay\u0131c\u0131 fonksiyon\n\n    $ust_kisim_gorseli_argumanlari= array(\n\t'flex-width'    => true, \/\/ k\u0131rpma i\u015fleminde geni\u015flik ayarlanabilsin\n\t'width'         => 980,  \/\/ k\u0131rpma i\u015fleminde ba\u015flang\u0131\u00e7 geni\u015fli\u011fi\n\t'flex-height'   => true, \/\/ k\u0131pma i\u015fleminde y\u00fckseklik ayarlanabilsin\n\t'height'        => 260,  \/\/ k\u0131rpma i\u015fleminde ba\u015flang\u0131\u00e7 y\u00fcksekli\u011fi\n\t'default-image' => get_template_directory_uri() . '\/images\/ust_kisim_icin.jpg', \/\/ teman\u0131n images klas\u00f6r\u00fcndeki ust_kisim_icin.jpg adl\u0131 resmi \u00f6nerilen resmin olarak kulland\u0131k\n    );\n    add_theme_support( 'custom-header', $ust_kisim_gorseli_argumanlari );\n\n}\nendif;\nadd_action( 'after_setup_theme', 'ilktemam_setup' ); \/\/ tema fonksiyonlar\u0131 bu kanca ile \u00e7al\u0131\u015f\u0131r<\/code><\/pre>\n\n\n\n<p>WordPress teman\u0131z\u0131n, <code>functions.php<\/code> dosyas\u0131na,  yukar\u0131daki kodlar\u0131 ekleyip, y\u00f6netim panelinden <strong>G\u00f6r\u00fcn\u00fcm-&gt;\u00d6zelle\u015ftir-&gt;\u00dcst k\u0131s\u0131m g\u00f6rseli<\/strong> men\u00fcs\u00fcne giderseniz, \u015f\u00f6yle bir men\u00fc sayfas\u0131 ile kar\u015f\u0131la\u015facaks\u0131n\u0131z:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img loading=\"lazy\" decoding=\"async\" width=\"299\" height=\"654\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2019\/05\/wordpress-temasina-ust-kisim-gorseli-ekleme-3.png\" alt=\"\" class=\"wp-image-2302\" srcset=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2019\/05\/wordpress-temasina-ust-kisim-gorseli-ekleme-3.png 299w, https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2019\/05\/wordpress-temasina-ust-kisim-gorseli-ekleme-3-137x300.png 137w\" sizes=\"auto, (max-width: 299px) 100vw, 299px\" \/><figcaption>WordPress Temas\u0131na Varsayal\u0131n Bir Resim \u0130le Birlikte \u00dcst K\u0131s\u0131m G\u00f6rseli \u00d6zelli\u011fi Ekleme<\/figcaption><\/figure><\/div>\n\n\n\n<p>Yukar\u0131daki resimde de g\u00f6rd\u00fc\u011f\u00fcn\u00fcz gibi, men\u00fc sayfas\u0131nda, &#8220;<strong>Mevcut ba\u015fl\u0131k<\/strong>&#8221; ve &#8220;<strong>\u00d6nerilen<\/strong>&#8221; olmak \u00fczere iki g\u00f6rsel b\u00f6lgesi vard\u0131r. Bu b\u00f6lgeler birbirinden farkl\u0131 \u00e7al\u0131\u015f\u0131r.<\/p>\n\n\n\n<p><em><strong>\u00d6nerilen <\/strong><\/em>b\u00f6lgesindeki resim, y\u00f6netim panelinden silinemez veya de\u011fi\u015ftirilemez. Ancak, biraz \u00f6ne girdi\u011fimiz koddaki &#8220;<strong>default-image<\/strong>&#8221; arg\u00fcman\u0131n\u0131 de\u011fi\u015ftirerek kald\u0131rabilir veya de\u011fi\u015ftirebiliriz. <em><strong>\u00d6nerilen <\/strong><\/em>b\u00f6lgesindeki bir resmi, \u00fcst k\u0131s\u0131m g\u00f6rseli olarak kullanmak istiyorsak, \u00fczerine t\u0131klamam\u0131z yeterlidir. \u00dczerine t\u0131klad\u0131\u011f\u0131m\u0131z g\u00f6rsel, <strong><em>mevcut ba\u015fl\u0131k<\/em><\/strong> olarak atanacakt\u0131r.<\/p>\n\n\n\n<p>E\u011fer, <strong><em>\u00d6nerilen<\/em><\/strong> b\u00f6lgesindeki g\u00f6rselin \u00fczerine t\u0131klarsak veya &#8220;<strong>Yeni g\u00f6rsel ekle<\/strong>&#8221; butonunu kullan\u0131rsak, <strong><em>Mevcut ba\u015fl\u0131k<\/em><\/strong> b\u00f6lgesine g\u00f6rsel eklemi\u015f oluruz. \u0130\u015fte bizim kontrol\u00fcm\u00fczde olan ve temam\u0131zda kullanmak istedi\u011fimiz as\u0131l g\u00f6rsel bu b\u00f6lgedekidir.<\/p>\n\n\n\n<p><strong><em>Mevcut ba\u015fl\u0131k<\/em><\/strong> b\u00f6lgesi, bizim as\u0131l kullanmak istedi\u011fimiz \u00fcst k\u0131s\u0131m g\u00f6rseli oldu\u011fu i\u00e7in, bu b\u00f6lgeye bir g\u00f6rsel eklenip eklenmedi\u011fini anlamak da isteyebiliriz. A\u015fa\u011f\u0131daki ko\u015fullu ifade, bu b\u00f6lgede bir g\u00f6rsel varsa <code>true<\/code> de\u011ferini d\u00f6nd\u00fcr\u00fcr:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>if ( get_header_image() ) { \/\/ Mevcut ba\u015fl\u0131k b\u00f6lgesi bo\u015f de\u011filse buras\u0131 \u00e7al\u0131\u015f\u0131r }<\/code><\/pre>\n\n\n\n<p><strong><em>Mevcut ba\u015fl\u0131k<\/em><\/strong> b\u00f6lgesindeki resmi, temam\u0131zda kullanmak i\u00e7in gerekli kodlar \u015funlard\u0131r:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;img src=\"&lt;?php header_image()->url; ?>\"><\/code><\/pre>\n\n\n\n<p>E\u011fer <strong><em>Mevcut ba\u015fl\u0131k<\/em><\/strong> b\u00f6lgesindeki resmi, arg\u00fcmanlarda girdi\u011fimiz, geni\u015flik ve y\u00fckseklik de\u011ferlerini de kullanarak, temam\u0131za \u00e7a\u011f\u0131rmak istersek, \u015fu kodu kullan\u0131yoruz:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;img src=\"&lt;?php header_image()->url; ?>\"\n  width=\"&lt;?php echo absint( get_custom_header()->width ); ?>\" \n  height=\"&lt;?php echo absint( get_custom_header()->height ); ?>\" \n  alt=\"&lt;?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>\">\n<\/code><\/pre>\n\n\n\n<p><em>Default-image<\/em> arg\u00fcman\u0131nda belirtti\u011finiz resmi, <em>Mevcut ba\u015fl\u0131k<\/em> b\u00f6lgesi bo\u015f iken g\u00f6sterilecek \u015fekilde ayarlayabilirsiniz. Ayn\u0131 zamanda, b\u00fct\u00fcn \u00fcst k\u0131s\u0131m resimlerini, ana sayfaya g\u00f6t\u00fcren birer link haline de getirebiliriz.  Bunu yapmak i\u00e7in, yukar\u0131da verdi\u011fimiz kodlar\u0131 birle\u015ftiriyoruz:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>if ( get_header_image() ) { ?>\n&lt;div id=\"ust-kisim-gorseli\">\n &lt;a href=\"&lt;?php echo esc_url( home_url( '\/' ) ); ?>\" rel=\"home\">\n  &lt;img src=\"&lt;?php header_image(); ?>\" \n   width=\"&lt;?php echo absint( get_custom_header()->width ); ?>\" \n   height=\"&lt;?php echo absint( get_custom_header()->height ); ?>\" \n   alt=\"&lt;?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>\">\n &lt;\/a>\n&lt;\/div>\n&lt;?php  } else { ?>\n&lt;div id=\"varsayilan-ust-kisim-gorseli\">\n &lt;a href=\"&lt;?php echo esc_url( home_url( '\/' ) ); ?>\" rel=\"home\">\n  &lt;img src=\"&lt;?php echo get_custom_header()->url; ?>\" \n   width=\"&lt;?php echo absint( get_custom_header()->width ); ?>\" \n   height=\"&lt;?php echo absint( get_custom_header()->height ); ?>\" \n   alt=\"&lt;?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>\">\n &lt;\/a>\n&lt;\/div>\n&lt;?php } ?><\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span id=\"Birden_Fazla_Varsayilan_Ust_Kisim_Resmi_Kullanma\">Birden Fazla Varsay\u0131lan \u00dcst K\u0131s\u0131m Resmi Kullanma<\/span><\/h2>\n\n\n\n<p>WordPress, birden fazla, <em>varsay\u0131lan \u00fcst k\u0131s\u0131m resmi<\/em> tan\u0131tmam\u0131za olanak tan\u0131r. Bunu yapmak i\u00e7in, a\u015fa\u011f\u0131daki fonksiyon, parametresi ile birlikte kullan\u0131l\u0131r:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>register_default_headers( $varsayilan_ust_kisim_resimleri );<\/code><\/pre>\n\n\n\n<p>Bu fonksiyonun parametresi \u015fu arg\u00fcmanlar\u0131 al\u0131r:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>$varsayilan_ust_kisim_resimleri = array(\n  'resim_1_alternatif_ad' => array(\n        'url'           => get_template_directory_uri() . '\/images\/ust_kisim_icin.jpg', \/\/ Resim yolu\n        'thumbnail_url' => get_template_directory_uri() . '\/images\/ust_kisim_icin_kucuk.jpg', \/\/ Resmin k\u00fc\u00e7\u00fck boyutlusunun yolu\n        'description'   => __( 'Resmin k\u0131sa tan\u0131t\u0131m\u0131', 'twentyeleven' )\n    ),\n    'resim_2_alternatif_ad' => array(\n        'url'           => get_template_directory_uri() . '\/images\/ust_kisim_icin_kucuk_2.jpg', \/\/ Resim yolu\n        'thumbnail_url' => get_template_directory_uri() . '\/images\/ust_kisim_icin.jpg', \/\/ Resmin k\u00fc\u00e7\u00fck boyutlusunun yolu\n        'description'   => __( 'Resmin k\u0131sa tan\u0131t\u0131m\u0131', 'twentyeleven' )\n    ),\n    'resim_3_alternatif_ad' => array(\n        'url'           => get_template_directory_uri() . '\/images\/ust_kisim_icin_3.jpg', \/\/ Resim yolu\n        'thumbnail_url' => get_template_directory_uri() . '\/images\/ust_kisim_icin_kucuk_3.jpg', \/\/ Resmin k\u00fc\u00e7\u00fck boyutlusunun yolu\n        'description'   => __( 'Resmin k\u0131sa tan\u0131t\u0131m\u0131', 'twentyeleven' )\n    )\n);<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\"><span id=\"Ornek-2\">\u00d6rnek-2<\/span><\/h3>\n\n\n\n<p>A\u015fa\u011f\u0131da, <code>add_theme_support()<\/code> fonksiyonunu  ve <code>register_default_headers()<\/code>  fonksiyonunun birlikte kullan\u0131m\u0131na bir \u00f6rnek verilmi\u015ftir.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>if ( ! function_exists( 'ilktemam_setup' ) ) :  \/\/ isim kar\u0131\u015f\u0131kl\u0131\u011f\u0131n\u0131 engelliyoruz\n  function ilktemam_setup() { \/\/ kapsay\u0131c\u0131 fonksiyon\n\n    $ust_kisim_gorseli_argumanlari= array(\n     'flex-width'    => true, \/\/ k\u0131rpma i\u015fleminde geni\u015flik ayarlanabilsin\n     'width'         => 980,  \/\/ k\u0131rpma i\u015fleminde ba\u015flang\u0131\u00e7 geni\u015fli\u011fi\n     'flex-height'   => true, \/\/ k\u0131pma i\u015fleminde y\u00fckseklik ayarlanabilsin\n     'height'        => 260,  \/\/ k\u0131rpma i\u015fleminde ba\u015flang\u0131\u00e7 y\u00fcksekli\u011fi\n     'default-image' => get_template_directory_uri() . '\/images\/ust_kisim_icin.jpg', \/\/ teman\u0131n images klas\u00f6r\u00fcndeki ust_kisim_icin.jpg adl\u0131 resmi \u00f6nerilen resmin olarak kulland\u0131k\n    );\n  add_theme_support( 'custom-header', $ust_kisim_gorseli_argumanlari );\n\n \/\/\n \/\/ Varsay\u0131lan Resimler Ekliyoruz\n \/\/\n\n $varsayilan_ust_kisim_resimleri = array(\n  'resim_1' => array(\n        'url'           => get_template_directory_uri() . '\/images\/ust_kisim_icin.jpg', \/\/ Resim yolu\n        'thumbnail_url' => get_template_directory_uri() . '\/images\/ust_kisim_icin_kucuk.jpg', \/\/ Resmin k\u00fc\u00e7\u00fck boyutlusunun yolu\n        'description'   => __( 'Resmin k\u0131sa tan\u0131t\u0131m\u0131', 'textdomain' )\n    ),\n    'resim_2' => array(\n        'url'           => get_template_directory_uri() . '\/images\/ust_kisim_icin_kucuk_2.jpg', \/\/ Resim yolu\n        'thumbnail_url' => get_template_directory_uri() . '\/images\/ust_kisim_icin.jpg', \/\/ Resmin k\u00fc\u00e7\u00fck boyutlusunun yolu\n        'description'   => __( 'Resmin k\u0131sa tan\u0131t\u0131m\u0131', 'textdomain' )\n    )\n );\n\n \/\/\n \/\/ Ekledi\u011fimiz resimleri kaydediyoruz\n \/\/\n register_default_headers( $varsayilan_ust_kisim_resimleri ); \n\n}\nendif;\nadd_action( 'after_setup_theme', 'ilktemam_setup' ); \/\/ tema fonksiyonlar\u0131 bu kanca ile \u00e7al\u0131\u015f\u0131r<\/code><\/pre>\n\n\n\n<p>WordPress teman\u0131z\u0131n, <code>functions.php<\/code> dosyas\u0131na,  yukar\u0131daki kodlar\u0131 ekleyip, y\u00f6netim panelinden <strong>G\u00f6r\u00fcn\u00fcm-&gt;\u00d6zelle\u015ftir-&gt;\u00dcst k\u0131s\u0131m g\u00f6rseli<\/strong> men\u00fcs\u00fcne giderseniz, \u015f\u00f6yle bir men\u00fc sayfas\u0131 ile kar\u015f\u0131la\u015facaks\u0131n\u0131z:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img loading=\"lazy\" decoding=\"async\" width=\"282\" height=\"385\" src=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2019\/05\/birden-cok-varsayilan-ust-kisim-gorseli-ekleme.png\" alt=\"\" class=\"wp-image-2408\" srcset=\"https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2019\/05\/birden-cok-varsayilan-ust-kisim-gorseli-ekleme.png 282w, https:\/\/sitecenneti.com\/wordpress\/wp-content\/uploads\/sites\/15\/2019\/05\/birden-cok-varsayilan-ust-kisim-gorseli-ekleme-220x300.png 220w\" sizes=\"auto, (max-width: 282px) 100vw, 282px\" \/><figcaption>Varsay\u0131lan Olarak Birden \u00c7ok \u00dcst K\u0131s\u0131m Resmi Ekleme<\/figcaption><\/figure><\/div>\n\n\n\n<p>\u00dcst k\u0131s\u0131mda kullanmak \u00fczere, birden \u00e7ok resim y\u00fckledi\u011fimizde veya varsay\u0131lan olarak birden \u00e7ok resim kaydetti\u011fimizde, kar\u015f\u0131m\u0131za &#8220;<em><strong>\u00d6nerilen ba\u015fl\u0131klarda rastgele<\/strong><\/em>&#8221; ad\u0131nda bir buton \u00e7\u0131kacakt\u0131r. Bu butona t\u0131klarsak, sayfam\u0131z tekrar y\u00fcklendi\u011finde, \u00fcst k\u0131s\u0131m resmini, se\u00e7ti\u011fimiz di\u011fer resimlerden biriyle, rastgele de\u011fi\u015ftirecektir.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Daha canl\u0131 bir WordPress temas\u0131 olu\u015fturabilmek amac\u0131yla, sayfalara \u00fcst k\u0131s\u0131m resmi veya resimleri eklemek ve bu resimleri de y\u00f6netim panelinden kontrol etmeyi \u00f6\u011frenmek i\u00e7in okuyun.<\/p>\n","protected":false},"author":1,"featured_media":25,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9],"tags":[92,93,95,91],"class_list":["post-1848","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress-tema-yapimi","tag-add_theme_support","tag-custom-header","tag-ozellestirilmis-sayfa-ustu","tag-sayfa-ustu-resmi"],"_links":{"self":[{"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/posts\/1848","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=1848"}],"version-history":[{"count":0,"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/posts\/1848\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/media\/25"}],"wp:attachment":[{"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/media?parent=1848"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/categories?post=1848"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sitecenneti.com\/wordpress\/wp-json\/wp\/v2\/tags?post=1848"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}