Zeki Can - WordPress

  HTML

Head Etiketi Nedir? Head Etiketi Kullanımı

  HTML    26 Mayıs 2019
Yorum Yok

Bir çok konuda <head> </head> etiketleri arasına bu kodu eklemelisiniz diyoruz. Peki bu head etiketleri nerededir ? Head etiketleri arasına kod nasıl eklenir ? Head etiketleri nasıl kullanılır ? Head Nedir? Head Etiketinin Alt Etiketleri Nelerdir ? HTML Nedir? Body Nedir? 

Head Etiketleri Nedir ?

Head başlık anlamına gelmektedir. Head etiketleri de başlıkta kullanılan etiketlerdir. Bu etiketler bilgi vermek için kullanılırlar. <head> ile başlar. Bitişi ise </head> şeklindedir. Bu aralığa girdiğimiz bilgiler etiketlerdir (bilgilerdir de diyebiliriz.).

Head Etiketleri Ne İşe Yarar ?

Bu etiketleri kullanarak sitemizde kullanıcılara göstermeden, gelen botlara bilgileri sunarız. Bu bilgiler site hakkında ki bilgilerdir. Site dilimizi, Sitemizin açıklamasını, Open Graph Meta Etiketlerini, Sosyal Ağ etiketlerini siteye ait anahtar kelimelerimizi, dışarıdan çağrılan dosyalarımızı, Site başlığını, favicon tanımlaması, metaları tanımlayabiliriz.  

Kullanıcı bu verileri görmez. Örneğin başlığı head etiketleri arasında tanımladığımız da bunu sayfa da görmek, tarayıcının başlık kısmında görür. Head etiketlerinde tanımladığımız faviconu da Tarayıcı başlık kısmının yanında görür.

 Dip Not:    Site dili tanımlamanızı yapmak için Site Dili Tanımlaması adlı konuyu inceleyebilirsiniz. Open Graph Meta Etiketlerinizi tanımlamak isterseniz de Open Graph Meta Etiketleri Kullanımı adlı yazımı okuyarak fikir edinebilirsiniz. 

Head Etiketleri Nerededir ?

Bu etiketler kodlamanın başında yer alır. Başlangıç <head> ile başlar sonrasın da kodlar yazılır. </head> ile biter. Sonrasında <body> etiketi devam eder.

Head etiketleri kullandığınız sisteme göre değişmekte olsa bile kodlamanın başında yer aldığından bulmanız kolaydır.

WordPress’te Head Etiketleri Nerededir ?

WordPress kullanıcıların head etiketleri header.php dosyası içinde yer almaktadır. Bu dosyaya WordPress admin panelden Görünüm >>> Tema Düzenleyici kısmında ulaşabilirsiniz.

WordPress Header Php Nerededir
WordPress Header Php Nerededir

 1   WordPress admin paneline giriş yapın.

 2   Panelden Görünüm sekmesini açın.

 3   Seçeneklerden Tema Düzenleyici kısmına gelin.

 4   Sağ tarafta yer alan tema dosyalarından Tema Üst Bölümü (header.php) dosyasını seçin.

 5   Seçilen dosyanın içeriği bu alanda gözükecektir. Html etiketi ile başlamış, sonrasında <head> etiketi açılmış ve içerisine bahsettiğim kodlamalar girilmiş. Bu kısımda uygun bir yere genellikle ben </head> etiketini bulurum. Ondan (</head>) hemen önceye eklemek istediğim kodları eklerim. Sizde bu şekilde kodlarınızı ekledikten sonra dosyayı kayıt etmelisiniz.

 6   Kodumuzu ekledikten sonra   Dosyayı Güncelle  diyerek kayıt edelim.

 Dip Not:   WordPress admin panel yerine FTP programları (Dosya Transfer Programları) kullanarak header.php dosyanıza ulaşıp düzenleyebilirsiniz. FileZilla ile Tema Dosyasına Ulaşım adlı konumu inceleyerek header.php dosyanıza ulaşabilirsiniz. 

Blogger’da Head Etiketleri Nerededir ?

Blogger temamıza ulaştığımız da HTML düzenle diyerek tema içerik kodlarımızı düzenleyebiliriz. Bu kodlamada head kodlarımız en üst kısımda yer almaktadır. Her temada bu şekildedir. (Düzgün ve temiz kodlanmış temalardan bahsediyorum)

 1   Blogger Kontrol Panelinize giriş yapın. www.blogger.com adresinden giriş yapabilirsiniz.

 2   Düzenlemek istediğiniz blogu seçin.

 3   Kontrol panelinde Tema başlığını seçin.

 4   Kullandığınız temanın kodlarını düzenlemek için HTML’yi Düzenle butonuna tıklayın.

Blogger Tema Düzenleme
Blogger Tema Düzenleme

 5   Temamıza ait kodlamanın bulunduğu kısım açılacaktır. Bu bölümde head etiketlerini göreceksiniz. Bu etiketlerin arasına uygun bir bölüme kodlarınızı ekleyebilirsiniz.

 6   Benim size tavsiyem </head> etiketini bulun ve bunun önüne kodları ekleyin. Bu sayede kodlarda bir karışıklık olduğunda nerede arayacağınızı bilirsiniz. 

 7   Kodları ekledikten sonra   Temayı Kaydet   diyerek değişiklikleri kayıt ediyoruz. 

Header Php dosyası Nerede Blogger
Blogger da Head Etiketleri

Head etiketinin içerisinde kullanılabilecek HTML elementleri

Tabi bu etiketlerin arasına kafamıza göre HTML etiketleri kullanamayız. Kullanılabilen etiketler şu şekildedir:

  • <title> (bu element başlık için ve HTML sayfa oluşturmak için kullanılıyor)
  • <style> (stilleri belirlerken kullanılıyor)
  • <link>  (link vererek veri çekmeye yarıyor)
  • <script>  (scriptleri bu etiket ile tanımlıyoruz)
  • <meta>   (meta etiketlerini tanımlıyoruz)
  • <base>  (sitedeki tüm göreceli URL’lar için URL veya hedef belirtmek için kullanılır)
  • <noscript> (standart özellikleri, olay özellikleri ve örnekleri kullanırken bu etiketi kullanırız)

Örnek <head> </head> Kodu Kullanımı

Head taglarının kullanımı:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="tr-TR">

<head>
<title> Sayfa Başlığı </title>
<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/style.css" async>
<script>
  document.write("Merhaba Dünya!")
</script>
<meta charset="UTF-8">
<meta property="og:type" content="website">
<base href="https://www.zekican.net/wordpress/" target="_blank">
<noscript>Your browser does not support JavaScript!</noscript>
</head>

Hepsinden birer tane örnek kodlama olmasına dikkat ettim.

Etiketler : , , , , , , , , ,


  Benzer Yazılar


  Yorumlar

Bir Cevap Yazın

E-posta hesabınız yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Bu yazıya henüz yorum yapılmamıştır, yazı hakkındaki düşüncelerinizi paylaşmaktan çekinmeyin.