Kolları sıvayıp Blogger XML Eğitim Serisi’nin ilk dersini, doğrudan blogunda yayınlayabileceğin akıcı, profesyonel ve teknik detayları net bir formatta hazırlayalım.

Bu derste hedefimiz; okuyucuya işin mantığını anlatmak, gözlerini korkutmadan onları standart HTML dünyasından XML dünyasına geçirmek ve en önemlisi Blogger panelinin hata vermeden kabul edeceği en temiz, saf (pure) iskeleti sunmak.

Blogger XML Dersleri #1: Blogger XML Nedir ve Standart HTML'den Farkı Ne?

Merhaba değerli geliştiriciler ve içerik üreticileri! Kendi Blogger temanızı sıfırdan kodlamak, hazır şablonların kod kalabalığından kurtulmak veya mevcut temanıza tamamen kendinize ait dinamik özellikler kazandırmak istiyorsanız, doğru yerdesiniz.

Bu eğitim serimizde, Blogger temalarının arkasındaki gizli gücü, yani XML yapısını adım adım öğreneceğiz. İlk dersimizin konusu: Temel mantığı kavramak ve hatasız çalışan ilk boş şablonumuzu oluşturmak.

🛠️ Blogger XML Nedir? Standart HTML'den Farkı Ne?

Normal bir web sitesi yaparken .html uzantılı bir dosya açar, içine statik kodlar yazarız. Ancak Blogger dinamik bir platformdur. Sizin panelden yazdığınız yazıların, yüklediğiniz resimlerin veya blog başlığınızın veri tabanından anlık olarak çekilip siteye basılması gerekir.

İşte bu noktada devreye XML (Extensible Markup Language) girer. Blogger XML, standart HTML5 etiketlerini alıp, Google’ın kendi geliştirdiği özel dinamik etiketlerle harmanlar.

Özellik	Standart HTML	Blogger XML
Dosya Yapısı	Statik içerik barındırır.	Dinamik ve esnektir, veriyi sunucudan çeker.
Etiket Esnekliği	Sadece standart tarayıcı etiketleri (`<div>`, `<p>`) vardır.	Google'ın özel etiketlerini (`<b:if>`, `<b:loop>`) destekler.
Hata Toleransı	Kapatılmamış bir etiket tasarımı bozsa da sayfa açılır.	Tek bir etiket bile kapatılmazsa panel hata verir ve kaydedilmez.

Blogger XML'in Can Damarı: Namespace (Önekler)

Blogger şablon kodlarının en üstünde, <html> etiketinin içinde daha önce görmediğiniz bazı tanımlamalar yer alır. Bunlara Namespace denir ve tarayıcıya "Hey, aşağıda göreceğin özel kodlar Google'ın sistemine aittir, bunları yabancılama" mesajı verir:

xmlns:b: Blogger'ın mantıksal döngülerini, koşullarını ve widget yapılarını (<b:if>, <b:section>) çalıştırır.
xmlns:data: Sunucudaki verileri (Yazı başlığı, blog açıklaması vb.) ekrana basmayı sağlar.
xmlns:expr: Standart HTML niteliklerine matematiksel veya mantıksal ifadeler atamak için kullanılır (Örn: expr:href, expr:src).

En Saf ve Hafif (Pure) Boş Blogger İskeleti

Blogger paneline girip Tema > HTML'i Düzenle dediğinizde, sistemin hata vermeden kabul edeceği, içinde hiçbir şişirilmiş kod barındırmayan, en optimize ve temiz başlangıç kodu şudur:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html b:css='false' b:defaultmessages='false' b:layoutsVersion='3' b:responsive='true' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<meta charset='utf-8'/>
<meta name='viewport' content='width=device-width, initial-scale=1'/>
<title><data:blog.pageTitle/></title>

<b:skin><![CDATA[
/* Temanızın Tüm CSS Kodları ve
Gelişmiş Animasyonları Buraya Gelecek
*/
body {
margin: 0;
padding: 0;
background-color: #f5f5f5;
font-family: sans-serif;
}
]]></b:skin>
</head>
<body>

<b:section id='main-layout' showaddelement='yes'>
</b:section>

</body>
</html>

Kodun Kritik Noktaları:

b:css='false': Blogger'ın arka planda otomatik olarak yüklediği ve sitenizi yavaşlatan gereksiz, eski CSS dosyalarını tamamen engeller. Sitenizin hız optimizasyonu için bu altın kuraldır.
<b:skin>: Standart HTML’deki <style> etiketinin yerini alır. İçindeki <![CDATA[ ve ]]> yapıları, CSS kodlarınızın XML derleyicisi tarafından hata olarak algılanmasını önler.
<b:section>: Blogger paneline girdiğinizde "Düzen" sekmesinde bir kutu (alan) oluşmasını sağlar. Şablonunuzda en az bir adet id değeri benzersiz olan <b:section> bulunması zorunludur, aksi halde şablon kaydedilemez.

1. Dersin Özeti ve Ödev

Bu derste Blogger XML dünyasına adım attık ve en temiz şablon iskeletimizi çıkardık.

Küçük bir deneme: Test blogunuzun kod alanındaki her şeyi silin, yukarıdaki temiz kodu yapıştırıp kaydedin. Ardından blogunuzun "Düzen" paneline giderek oluşturduğumuz main-layout isimli bölümün orada nasıl belirdiğini kendi gözlerinizle görün!

Bir sonraki dersimizde, "Düzen" panelinin mimarisini oluşturan, yönetim panelinden sitenize eleman eklemenizi sağlayan <b:section> ve <b:widget> (Gadget) etiketlerinin anatomisini derinlemesine inceleyeceğiz. xml,nedir,ders