Alt temalar, etrafta çokça kullanılan ve yeni başlayanların kafasını karıştıran WordPress terimlerinden biridir. Hatta bunları duymuş ve ne kadar karmaşık göründükleri için oluşturmayı atlamaya karar vermiş olabilirsiniz.
Bunu anlıyoruz. Ancak deneyimlerimize göre, alt temalar ileride sizi bir sürü baş ağrısından kurtarabilir. Değerli özelleştirmelerinizi korur, sitenizi bozmadan denemeler yapmanızı sağlar ve temanızı güncellemeyi çocuk oyuncağı haline getirir.
İlgileniyorsanız, bu yeni başlayan dostu kılavuzda bir alt temanın nasıl çalıştığını, nasıl özelleştirileceğini ve üzerinde nasıl değişiklik yapılacağını açıkladık.
Alt Tema Nasıl Çalışır ve Neden İhtiyacınız Var?
Bir alt tema, başka bir WordPress temasının tüm özelliklerini, işlevlerini ve stillerini devralır. Bir alt tema oluşturduğunuzda, orijinal tema ana tema olarak adlandırılır.
Kalıtım, temanın ana stilini tanımlayan üst temanın style.css dosyasını içerir. Alt tema, kendi dosyalarını ekleyerek veya mevcut olanları değiştirerek devralınan özellikleri geçersiz kılabilir veya genişletebilir.
WordPress tem anızı bir alt tema yüklemeden özelleştirmek mümkün olsa da, yine de bir temaya ihtiyaç duymanızın birkaç nedeni vardır:
- Alt temalar, tema güncellemeleri sırasında özelleştirmelerinizi koruyarak üzerlerine yazılmasını önler. Ana temayı doğrudan değiştirirseniz, güncelleme yaptığınızda bu ince ayarlar kaybolabilir.
- Alt temalar, bir hazırlama ortamına benzer şekilde, sitenin orijinal temasını bozmadan yeni tasarımları veya özellikleri güvenle denemenizi sağlar.
- Kod yazmayı biliyorsanız, alt temalar geliştirme sürecini daha verimli hale getirebilir. Bir alt temanın dosyaları ana temanınkilerden çok daha basittir. Ana temanın yalnızca değiştirmek veya genişletmek istediğiniz kısımlarını değiştirmeye odaklanabilirsiniz.
WordPress Alt Teması Oluşturmadan Önce Yapılması Gerekenler
Birçok WordPress kullanıcısının teknik konulara dalmak için heyecanlandığını, ancak hatalar ortaya çıktığında cesaretlerinin kırıldığını gördük. Bunu anlıyoruz. Bu yüzden bir alt tema oluşturmadan önce neye bulaştığınızı bilmek önemlidir.
İşte bu adım adım kılavuza devam etmeden önce yapmanızı önerdiğimiz bazı şeyler:
- Kod ile çalışacağınızın farkında olun. Yapmanız gereken değişiklikleri anlamak için en azından temel düzeyde HTML, CSS, PHP ve isteğe bağlı olarak JavaScript bilgisine sahip olmanız gerekecektir. WordPress tema el kitabında bu konuda daha fazla bilgi edinebilirsiniz.
- İstediğiniz web sitesi tasarımına ve özelliklerine sahip bir ana tema seçin. Mümkünse, yalnızca birkaç değişiklik yapmanız gereken bir tema bulun. Gerekirse WordPress temalarını değiştirmeden önce yapılması gerekenler kontrol listemizi takip edebilirsiniz.
- Tema geliştirme için yerel bir site veya hazırlık sitesi kullanın. Canlı sitenizde istemediğiniz hatalar oluşturmak istemezsiniz.
- Önceweb sitenizi yedekleyin. Eğer bu ilk seferinizse Duplicator gibi bir yedekleme eklentisi kullanmanızı öneririz.
Mevcut temanızdan bir alt tema oluşturmanın birkaç yolu vardır. Biri manuel kodla yapılırken, diğerleri çok daha acemi dostu olan bir eklenti gerektirir.
Teknik deneyiminiz yoksa ilk yöntem göz korkutucu görünebilir. Bununla birlikte, eklenti yöntemlerinden birini seçseniz bile, sürece ve ilgili dosyalara aşina olmak için manuel yöntemi okumanızı öneririz.
Profesyonel İpucu: Temanızı alt tema oluşturmadan özelleştirmek mi istiyorsunuz? Web sitenizi bozmadan özel kod parçacıklarıyla yeni özellikleri güvenle etkinleştirmek için WPCode ‘u kullanın.
Tüm bunları aklımızda tutarak, WordPress’te bir alt temanın nasıl oluşturulacağına geçelim. Aşağıdaki bağlantıları kullanarak tercih ettiğiniz yönteme geçebilirsiniz:
- Method 1: Creating a Child WordPress Theme Manually
- Method 2: Creating a Child Classic Theme With a Plugin
- Method 3: Creating a Child Block Theme With a Plugin
- Bonus Tip: Find Out If Your Theme Has a Child Theme Generator
- How to Customize Your Classic Child Theme
- How to Customize Your Block Child Theme
- How to Edit a Child Theme's Template Files
- How to Add New Functionality to Your Child Theme
- How to Troubleshoot Your WordPress Child Theme
Yöntem 1: Manuel Olarak Alt WordPress Teması Oluşturma
Öncelikle WordPress kurulum klasörünüzdeki /wp-content/themes/
dosyasını açmanız gerekir.
Bunu WordPress hosting ‘inizin dosya yöneticisini veya bir FTP istemcisini kullanarak yapabilirsiniz. Biz ilk seçeneğin çok daha kolay olduğunu düşünüyoruz, bu yüzden bunu kullanacağız.
Bluehost müşterisiyseniz, barındırma hesabı kontrol panelinize giriş yapabilir ve ‘Web Siteleri’ sekmesine gidebilirsiniz. Bundan sonra, ‘Ayarlar’a tıklayın.
Genel Bakış sekmesinde, ‘Hızlı Bağlantılar’ bölümüne ilerleyin.
Ardından, ‘Dosya Yöneticisi’ni seçin.
Bu aşamada, web sitenizin public_html klasörüne gitmeniz ve /wp-content/themes/
yolunu açmanız gerekir.
Burada, alt temanız için yeni bir klasör oluşturmak için sol üst köşedeki ‘+ Klasör’ düğmesine tıklamanız yeterlidir.
Klasöre istediğiniz ismi verebilirsiniz.
Bu eğitimde, ana temamız olarak Twenty Twenty-One kullanacağımız için sadece twentytwentyone-child klasör adını kullanacağız. İşiniz bittiğinde, ‘Yeni Klasör Oluştur’a tıklayın.
Ardından, yeni oluşturduğunuz klasörü açmalı ve alt temanızın ilk dosyasını oluşturmak için ‘+ Dosya’ya tıklamalısınız.
Bir FTP istemcisi kullanıyorsanız, Notepad gibi bir metin düzenleyici kullanabilir ve dosyayı daha sonra yükleyebilirsiniz.
Devam edin ve bu dosyaya ‘style.css’ adını verin, çünkü bu dosya çocuğunuzun ana stil sayfasıdır ve çocuk teması hakkında bilgi içerecektir.
Ardından, ‘Yeni Dosya Oluştur’a tıklayın.
Şimdi, style.css dosyasına sağ tıklayın.
Bundan sonra, aşağıdaki ekran görüntüsünde olduğu gibi yeni bir sekme açmak için ‘Düzenle’ye tıklayın.
Bu yeni sekmede, aşağıdaki metni yapıştırabilir ve ihtiyaçlarınıza göre ayarlayabilirsiniz:
/*
Theme Name: Twenty Twenty-One Child
Theme URI: https://wordpress.org/themes/twentytwentyone/
Description: Twenty Twenty-One child theme
Author: WordPress.org
Author URI: https://wordpress.org/
Template: twentytwentyone
Version: 1.0.0
Text Domain: twentytwentyonechild
*/
İşiniz bittiğinde, ‘Değişiklikleri Kaydet’e tıklayın.
Yapmanız gereken bir sonraki şey ikinci bir dosya oluşturmak ve ona functions.php adını vermektir. Bu dosya, stil sayfalarını ana temanın dosyalarından içe aktaracak veya sıraya alacaktır.
Belgeyi oluşturduktan sonra, aşağıdaki wp_enqueue kodunu ekleyin:
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
$parenthandle = 'twenty-twenty-one-style'; // This is 'twenty-twenty-one-style' for the Twenty Twenty-one theme.
$theme = wp_get_theme();
wp_enqueue_style( $parenthandle, get_template_directory_uri() . '/style.css',
array(), // if the parent theme code has a dependency, copy it to here
$theme->parent()->get('Version')
);
wp_enqueue_style( 'custom-style', get_stylesheet_uri(),
array( $parenthandle ),
$theme->get('Version') // this only works if you have Version in the style header
);
}
İşiniz bittiğinde, dosyayı önceki adımda olduğu gibi kaydedin.
Not: Bu yöntemde, alt temanızın stil sayfalarının düzgün şekilde yüklendiğinden emin olmak için resmi Alt Temalar ve Varlıkları Dahil Etme belgelerini okumanızı öneririz.
Artık çok temel bir alt tema oluşturdunuz. WordPress yönetici panelinizde Görünüm ” Temalar bölümüne gittiğinizde Twenty Twenty-One Çocuk seçeneğini görmelisiniz.
Sitenizde alt temayı kullanmaya başlamak için ‘Etkinleştir’ düğmesine tıklayın.
Yöntem 2: Bir Eklenti ile Klasik Çocuk Teması Oluşturma
Sıradaki yöntemde Child Theme Configurator eklentisi kullanılmaktadır. Bu kullanımı kolay WordPress eklentisi, kod kullanmadan hızlı bir şekilde WordPress alt temaları oluşturmanızı ve özelleştirmenizi sağlar, ancak yalnızca klasik (blok olmayan) bir tema ile iyi çalışır.
Yapmanız gereken ilk şey WordPress eklentisini yüklemek ve etkinleştirmektir. Etkinleştirdikten sonra, WordPress panonuzda Araçlar ” Alt Temalar bölümüne gitmeniz gerekir.
Ebeveyn/Çocuk sekmesinde sizden bir eylem seçmeniz istenecektir. Başlamak için ‘Yeni bir Alt Tema Oluştur’ seçeneğini seçin.
Ardından, açılır menüden bir üst tema seçin. Biz Hestia temasını seçeceğiz.
Bundan sonra, temanın ana tema olarak kullanıma uygun olduğundan emin olmak için ‘Analiz Et’ düğmesine tıklamanız yeterlidir.
Ardından, alt temanın kaydedileceği klasörü adlandırmanız istenecektir. İstediğiniz herhangi bir klasör adını kullanabilirsiniz.
Bunun altında, yeni stillerin nereye kaydedileceğini seçmeniz gerekir: birincil stil sayfasına veya ayrı bir stil sayfasına.
Birincil stil sayfası, alt temanızla birlikte gelen varsayılan stil sayfasıdır. Bu dosyaya yeni özel stiller kaydettiğinizde, doğrudan alt temanızın ana stillerini değiştirmiş olursunuz. Her değişiklik orijinal temanın stilinin üzerine yazılır.
Ayrı seçeneği, yeni bir özel stili ayrı bir stil sayfası dosyasına kaydetmenizi sağlar. Bu, orijinal temanın stilini korumak ve üzerine yazmamak istiyorsanız kullanışlıdır.
Gösterim amacıyla ilk seçeneği seçeceğiz. Ancak alt tema özelleştirmelerinizle daha yaratıcı hale geldikçe, bu işlemi her zaman tekrarlayabilir ve ikinci seçeneği seçebilirsiniz.
Aşağı doğru ilerlerken, ana temanın stil sayfasına nasıl erişileceğini seçmeniz gerekir.
Eklentinin uygun eylemleri otomatik olarak belirlemesine izin vereceği için varsayılan ‘WordPress stil kuyruğunu kullan’ seçeneğini kullanacağız.
Adım 7’ye geldiğinizde, ‘Alt Tema Özelliklerini Düzenlemek için Tıklayın’ etiketli düğmeye tıklamanız gerekecektir.
Daha sonra alt temanızın ayrıntılarını doldurabilirsiniz.
Manuel olarak bir alt tema oluşturduğunuzda, ana temanın menülerini ve widget’larını kaybedersiniz. Alt Tema Yapılandırıcısı bunları ana temadan alt temaya kopyalayabilir. Bunu yapmak istiyorsanız 8. adımdaki kutuyu işaretleyin.
Son olarak, yeni alt temanızı oluşturmak için ‘Yeni Alt Tema Oluştur’ düğmesine tıklayın.
Eklenti, alt temanız için bir klasör oluşturacak ve temayı daha sonra özelleştirmek için kullanacağınız style.css ve functions.php dosyalarını ekleyecektir.
Temayı etkinleştirmeden önce, önizleme yapmak ve iyi göründüğünden ve sitenizi bozmadığından emin olmak için ekranın üst kısmındaki bağlantıya tıklamalısınız.
Her şey çalışıyor gibi görünüyorsa, ‘Etkinleştir ve Yayınla’ düğmesine tıklayın.
Şimdi, alt temanız yayına girecektir.
Bu aşamada, alt tema tam olarak ana tema gibi görünecek ve davranacaktır.
Yöntem 3: Bir Eklenti ile Alt Blok Teması Oluşturma
Eğer bir blok tema kullanıyorsanız, WordPress Create Block Theme eklentisi ile bir alt tema oluşturmanın kolay bir yolunu sunar.
İlk olarak, WordPress eklentisini yüklemeniz ve etkinleştirmeniz gerekecektir. Bundan sonra, Görünüm ” Blok Tema Oluştur‘a gidin.
Burada, ‘Create a Child of [current theme name]’ seçeneğini seçmeniz yeterlidir.
Ardından, alt temanızın bilgilerini doldurun. Bu örnekte Twenty Twenty-Four kullandığımız için temaya Twenty Twenty-Four Child adını vereceğiz.
Ayrıca alt tema için bir açıklama ve yazar da verdik. Tamamlandığında, ‘Alt Tema Oluştur’ düğmesine tıklayın.
Eklenti şimdi WordPress tema zip dosyasını oluşturacak ve yönetici alanınıza yükleyecektir.
Bu işlem tamamlandığında, web siteniz yeni oluşturulan bu alt temayı otomatik olarak etkinleştirecektir. Bunu Görünüm ” Temalar bölümüne giderek onaylayabilirsiniz.
Bonus İpucu: Temanızın Alt Tema Oluşturucusu Olup Olmadığını Öğrenin
Şanslıysanız, WordPress temanız zaten bir alt tema oluşturmak için mevcut bir özelliğe sahip olabilir.
Örneğin, Astra kullanıyorsanız, Astra Çocuk Teması Oluşturucu web sitesine gidebilirsiniz. Bundan sonra, sadece alt tema adınızı girin ve ‘Oluştur’ düğmesine tıklayın.
Tarayıcınız daha sonra alt temanızı otomatik olarak bilgisayarınıza indirecek ve bunu WordPress’e kendiniz yükleyebileceksiniz.
Ayrıca alt tema oluşturucusu olan başka popüler WordPress tem aları da bulduk:
Klasik Alt Temanızı Özelleştirme
Not: Bu bölüm klasik WordPress teması kullanıcıları içindir. Eğer blok tema kullanıyorsanız, bir sonraki bölüme geçebilirsiniz.
Teknik olarak, Tema Özelleştirici’yi kullanarak alt temanızı kod olmadan özelleştirebilirsiniz. Burada yaptığınız değişiklikler ana temanızı etkilemeyecektir. Kodlama konusunda henüz rahat değilseniz, Özelleştirici’yi kullanmaktan çekinmeyin.
Bununla birlikte, alt temayı kodla özelleştirmenizi de öneririz.
WordPress tema geliştirme hakkında daha fazla bilgi edinmenin yanı sıra, kod özelleştirme, değişikliklerin alt temanın dosyalarında belgelenmesine olanak tanıyarak bunların izlenmesini kolaylaştırır.
Şimdi, bir alt temayı özelleştirmenin en temel yolu style.css dosyasına özel CSS eklemektir. Bunu yapmak için hangi kodu özelleştirmeniz gerektiğini bilmeniz gerekir.
Ana temadaki mevcut kodu kopyalayıp değiştirerek süreci basitleştirebilirsiniz. Bu kodu Chrome veya Firefox Inspect aracını kullanarak ya da doğrudan ana temanın CSS dosyasından kopyalayarak bulabilirsiniz.
Yöntem 1: Chrome veya Firefox Inspector’dan Kod Kopyalama
Değiştirmeniz gereken CSS kodunu keşfetmenin en kolay yolu, Google Chrome ve Firefox ile birlikte gelen denetçi araçlarını kullanmaktır. Bu araçlar, bir web sayfasının herhangi bir öğesinin arkasındaki HTML ve CSS’ye bakmanıza olanak tanır.
Denetçi aracı hakkında daha fazla bilgiyi denetleme öğesinin temelleri: WordPress’i kendin yap kullanıcıları için özelleştirme başlıklı kılavuzumuzda bulabilirsiniz.
Web sayfanıza sağ tıkladığınızda ve inspect öğesini kullandığınızda, sayfanın HTML ve CSS’sini göreceksiniz.
Farenizi farklı HTML satırlarının üzerine getirdiğinizde, denetçi bunları üst pencerede vurgulayacaktır. Ayrıca, vurgulanan öğeyle ilgili CSS kurallarını da gösterecektir:
Nasıl görüneceğini görmek için CSS’yi orada düzenlemeyi deneyebilirsiniz. Örneğin, temanın gövdesinin arka plan rengini #fdf8ef olarak değiştirmeyi deneyelim. body {
yazan kod satırını ve içinde color:
yazan kodu bulun.
Renk:
öğesinin yanındaki renk seçici simgesine tıklayın ve HEX kodunu aşağıdaki gibi uygun alana yapıştırın:
Artık CSS kullanarak arka plan rengini nasıl değiştireceğinizi biliyorsunuz. Değişiklikleri kalıcı hale getirmek için, style.css dosyanızı alt tema dizininde açabilirsiniz ( dosya yöneticisini veya FTP‘yi kullanarak).
Ardından, aşağıdaki kodu alt tema bilgilerinin altına aşağıdaki gibi yapıştırın:
/*
Theme Name: Twenty Twenty-One Child
Theme URI: https://wordpress.org/themes/twentytwentyone/
Description: Twenty Twenty-One child theme
Author: WordPress.org
Author URI: https://wordpress.org/
Template: twentytwentyone
Version: 1.0.0
Text Domain: twentytwentyonechild
*/
body {
background-color: #fdf8ef
}
WordPress yöneticisine gidip Görünüm ” Tema Dosyası Düzenleyicisi‘ni açarsanız aşağıdaki gibi görünecektir:
Yeni başlayan biriyseniz ve başka değişiklikler yapmak istiyorsanız, her kodun tam olarak hangi öğeye atıfta bulunduğunu bilmeniz için HTML ve CSS’ye aşina olmanızı öneririz. İnternette başvurabileceğiniz birçok HTML ve CSS kopya sayfası bulunmaktadır.
İşte alt tema için oluşturduğumuz stil sayfasının tamamı. Denemekten ve değiştirmekten çekinmeyin:
/*
Theme Name: Twenty Twenty-One Child
Theme URI: https://wordpress.org/themes/twentytwentyone/
Description: Twenty Twenty-One child theme
Author: WordPress.org
Author URI: https://wordpress.org/
Template: twentytwentyone
Version: 1.0.0
Text Domain: twentytwentyonechild
*/
.site-title {
color: #7d7b77;
}
.site-description {
color: #aba8a2;
}
body {
background-color: #fdf8ef;
color: #7d7b77;
}
.entry-footer {
color: #aba8a2;
}
.entry-title {
color: #aba8a2;
font-weight: bold;
}
.widget-area {
color: #7d7b77;
}
Yöntem 2: Ana Temanın style.css Dosyasından Kod Kopyalama
Belki de alt temanızda özelleştirmek istediğiniz pek çok şey vardır. Bu durumda, bazı kodları doğrudan ana temanın style.css dosyasından kopyalayıp alt temanızın CSS dosyasına yapıştırmak ve ardından değiştirmek daha hızlı olabilir.
İşin zor kısmı, bir temanın stil sayfası dosyasının yeni başlayanlar için gerçekten uzun ve bunaltıcı görünebilmesidir. Ancak, temelleri anladıktan sonra aslında o kadar da zor değildir.
Twenty Twenty-One ana temasının stil sayfasından gerçek bir örnek kullanalım. WordPress kurulum klasörünüzde /wp-content/themes/twentytwentyone
adresine gitmeniz ve ardından style.css dosyasını dosya yöneticinizde, FTP’de veya Tema Dosyası Düzenleyicisinde açmanız gerekir.
Aşağıdaki kod satırlarını göreceksiniz:
:root {
/* Colors */
--global--color-black: #000;
--global--color-dark-gray: #28303d;
--global--color-gray: #39414d;
--global--color-light-gray: #f0f0f0;
--global--color-green: #d1e4dd;
--global--color-blue: #d1dfe4;
--global--color-purple: #d1d1e4;
--global--color-red: #e4d1d1;
--global--color-orange: #e4dad1;
--global--color-yellow: #eeeadd;
--global--color-white: #fff;
--global--color-white-50: rgba(255, 255, 255, 0.5);
--global--color-white-90: rgba(255, 255, 255, 0.9);
--global--color-primary: var(--global--color-dark-gray); /* Body text color, site title, footer text color. */
--global--color-secondary: var(--global--color-gray); /* Headings */
--global--color-primary-hover: var(--global--color-primary);
--global--color-background: var(--global--color-green); /* Mint, default body background */
--global--color-border: var(--global--color-primary); /* Used for borders (separators) */
}
3 ila 15. satırlar, tüm temanın kendi özel HEX kodlarında kullanacağı renk türlerini (sarı, yeşil, mor gibi) kontrol eder. Ve sonra, ‘global-color-primary’ veya ‘global-color-secondary’ gibi satırlar için, bunlar o temanın birincil ve ikincil renkleri anlamına gelir.
Bu kod satırlarını alt temanızın stil sayfasına kopyalayabilir ve ardından mükemmel renk düzeninizi oluşturmak için HEX kodlarını değiştirebilirsiniz.
Ana temanın stil sayfasında aşağı doğru ilerlediğinizde, burada olduğu gibi diğer değişkenlerin de bu renk değişkenlerine sahip olabileceğini fark edeceksiniz:
/* Buttons */
--button--color-text: var(--global--color-background);
Bu temel olarak, tüm düğme metinlerinin --global--color-background:
içinde bildirilen aynı rengi kullanacağı anlamına gelir; bu renk nane yeşilidir(--global--color-green: #d1e4dd
). Eğer --global--color-green:
içindeki HEX değerini değiştirirseniz, düğme metni de farklı görünecektir.
Not: Twenty Twenty-One alt temasını kullanıyorsanız ve herhangi bir değişiklik görmüyorsanız, style.css dosyasını her güncellediğinizde tema dosyası bilgilerinin ‘Sürüm’ kısmını güncellemeniz gerekebilir (örneğin, 1.0’dan 2.0’a).
Alt tema özelleştirmelerinizi denemek için bu eğitimleri de takip edebilirsiniz:
- WordPress’te Metin Rengi Nasıl Değiştirilir
- WordPress Logo Boyutunuzu Değiştirme (Tüm Temalarla Çalışır)
- WordPress Temalarında Blockquotes Stili Nasıl Özelleştirilir
- WordPress Body Class 101: Tema Tasarımcıları için İpuçları ve Püf Noktaları
- Herhangi Bir WordPress Temasına Paralaks Efekti Nasıl Eklenir?
Block Alt Temanızı Özelleştirme
Bir alt blok teması kullanıyorsanız, özelleştirmelerinizin çoğu style .css değil theme.json dosyanızda yapılacaktır.
Ancak testlerimiz sırasında sürecin karmaşık olduğunu gördük. Klasik alt temaların aksine, WordPress tema geliştirmede yeniyseniz doldurmanız gereken daha büyük bir bilgi boşluğu var (özellikle JSON ve CSS’nin orada nasıl işlendiği hakkında).
Bununla birlikte, Create Block Theme eklentisini kullanarak çok daha kolay bir alternatif bulduk. Bu araç WordPress Tam Site Editöründe yapılan tüm değişiklikleri alt tema.json dosyanıza kaydedebilir. Böylece, herhangi bir koda dokunmanız gerekmeyecek çünkü eklenti bunu sizin için halledecek.
Size bir örnek gösterelim. İlk olarak, Görünüm ” Düzenleyici‘ye giderek WordPress Tam Site Düzenleyicisi ‘ni açın.
Aralarından seçim yapabileceğiniz birkaç menü göreceksiniz.
Burada, sadece ‘Stiller’i seçin.
Bir sonraki sayfada, aralarından seçim yapabileceğiniz çeşitli yerleşik stil kombinasyonları göreceksiniz.
Bizim amacımız için, tüm bunları atlayabilir ve sadece kalem simgesine tıklayabilirsiniz.
Şimdi, alt temanızın yazı tipleri gibi bazı kısımlarını değiştirmeyi deneyelim.
Bu örnek için, devam edin ve sağ kenar çubuğundaki ‘Tipografi’ye tıklayın.
Ardından, metin, bağlantılar, başlıklar, alt yazılar ve düğmeler için temanın genel yazı tiplerini değiştirmek üzere bazı seçenekler göreceksiniz.
Göstermek için ‘Başlıklar’a tıklayalım.
Yazı Tipi açılır menüsünde, orijinal seçimi mevcut olan herhangi bir yazı tipiyle değiştirin.
Gerekirse görünümü, satır yüksekliğini, harf aralığını ve harf kaplamasını değiştirmekten çekinmeyin.
İşiniz bittiğinde, sadece ‘Kaydet’e tıklayın. Bundan sonra, ‘Kaydet’in yanındaki Blok Teması Oluştur düğmesine (İngiliz anahtarı simgesi) tıklayabilirsiniz.
Ardından, ‘Değişiklikleri Temaya Kaydet’e tıklayın.
Ardından, devam edin ve alt temaya hangi değişikliklerin kaydedileceğini seçin.
Örnekler arasında yazı tipleri, özel stiller, şablon değişiklikleri ve daha fazlası yer alır.
İşiniz bittiğinde, kenar çubuğunu sonuna kadar kaydırın.
Ardından, ‘Değişiklikleri Kaydet’e tıklayın.
Şimdi, koda yansıyan değişiklikleri görebilmeniz için theme.json dosyanızı görüntüleyelim.
Bunu yapmak için Blok Teması Oluştur düğmesine tekrar tıklayın ve ‘Tema.json’u görüntüle’yi seçin.
Üzerine tıkladıktan sonra, dosyanın bazı yeni kod eklemeleri içerdiğini göreceksiniz.
Bizim durumumuzda, dosya başlık etiketlerinin yarı kalın görünümlü, 1,2 satır yüksekliğinde, 1 piksel satır aralığında ve küçük harflerle Inter yazı tipini kullanacağını belirten kodu içerir.
Bu nedenle, alt blok temanızı her düzenlediğinizde, İngiliz anahtarı simgesine tıkladığınızdan ve değişikliklerinizi kaydettiğinizden emin olun, böylece iyi belgelenmiş olurlar.
Alt Temanın Şablon Dosyaları Nasıl Düzenlenir?
Çoğu WordPress teması, tema içindeki belirli bir alanın tasarımını ve düzenini kontrol eden tema dosyaları olan şablonlara sahiptir. Örneğin, altbilgi bölümü genellikle footer.php dosyası tarafından ele alınır ve üstbilgi header.php dosyası tarafından ele alınır.
Her WordPress temasının da farklı bir düzeni vardır. Örneğin, Twenty Twenty-One temasında bir üstbilgi, içerik döngüsü, altbilgi widget alanı ve altbilgi bulunur.
Bir şablonu değiştirmek istiyorsanız, dosyayı ana tema klasöründe bulmanız ve alt tema klasörüne kopyalamanız gerekir. Bundan sonra, dosyayı açmalı ve istediğiniz değişiklikleri yapmalısınız.
Örneğin, Bluehost kullanıyorsanız ve ana temanız Twenty Twenty-One ise, dosya yöneticinizde /wp-content/themes/twentytwentyone
adresine gidebilirsiniz. Ardından footer.php gibi bir şablon dosyasına sağ tıklayın ve ‘Kopyala’yı seçin.
Bundan sonra, alt temanızın dosya yolunu girin.
İşiniz bittiğinde, ‘Dosyaları Kopyala’ya tıklamanız yeterlidir.
Daha sonra dosya yoluna yönlendirileceksiniz.
Footer.php dosyasını düzenlemek için üzerine sağ tıklayın ve ‘Düzenle’yi seçin.
Örnek olarak, ‘Proudly powered by WordPress’ bağlantısını altbilgi alanından kaldıracağız ve oraya bir telif hakkı bildirimi ekleyeceğiz.
Bunu yapmak için, <div class="powered-by">
etiketleri arasındaki her şeyi silmelisiniz:
<div class="powered-by">
<?php
printf(
/* translators: %s: WordPress. */
esc_html__( 'Proudly powered by %s.', 'twentytwentyone' ),
'<a href="' . esc_url( __( 'https://wordpress.org/', 'twentytwentyone' ) ) . '">WordPress</a>'
);
?>
</div><!-- .powered-by -->
Ardından, aşağıdaki örnekte bu etiketlerin altında bulduğunuz kodu yapıştırmanız gerekir:
<div class="powered-by">
<p>© Copyright <?php echo date("Y"); ?>. All rights reserved.</p>
</div><!-- .powered-by -->
İşte şimdi metin düzenleyicide sahip olmanız gereken şey:
Devam edin ve değişiklikleri resmi hale getirmek için dosyayı kaydedin.
Bundan sonra, yeni telif hakkı bildirimini görmek için web sitenizi ziyaret edin.
Alt Temanıza Yeni İşlevsellik Ekleme
Bir temadaki functions.php dosyası, bir WordPress sitesine özellikler eklemek veya varsayılan özellikleri değiştirmek için PHP kodunu kullanır. WordPress siteniz için mevcut temanızla otomatik olarak etkinleştirilen bir eklenti gibi davranır.
Kod parçacıklarını kopyalayıp functions.php’ye yapıştırmanızı isteyen birçok WordPress eğitimi bulacaksınız. Ancak değişikliklerinizi ana temaya eklerseniz, temaya yeni bir güncelleme yüklediğinizde bunların üzerine yazılacaktır.
Bu nedenle özel kod parçacıkları eklerken bir alt tema kullanmanızı öneririz. Bu eğitimde, temamıza yeni bir widget alanı ekleyeceğiz.
Bu kod parçacığını alt temamızın functions.php dosyasına ekleyerek bunu yapabiliriz. İşlemi daha da güvenli hale getirmek için WPCode eklentisini kullanmanızı öneririz, böylece functions.php dosyasını doğrudan düzenlemeyerek hata riskini azaltırsınız.
Daha fazla bilgi için özel kod parçacıklarının nasıl ekleneceğine ilişkin kılavuzumuzu okuyabilirsiniz.
İşte functions.php dosyanıza eklemeniz gereken kod:
// Register Sidebars
function custom_sidebars() {
$args = array(
'id' => 'custom_sidebar',
'name' => __( 'Custom Widget Area', 'text_domain' ),
'description' => __( 'A custom widget area', 'text_domain' ),
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget' => '</aside>',
);
register_sidebar( $args );
}
add_action( 'widgets_init', 'custom_sidebars' );
Dosyayı kaydettikten sonra, WordPress kontrol panelinizin Görünüm ” Widget ‘lar sayfasını ziyaret edebilirsiniz.
Burada, widget ekleyebileceğiniz yeni özel widget alanınızı göreceksiniz.
Özel kod parçacıklarını kullanarak temanıza ekleyebileceğiniz pek çok başka özellik vardır. WordPress functions.php dosyası için bu son derece kullanışlı püf noktalarına ve yeni başlayanlar için faydalı WordPress kod parçacıklarına göz atın.
WordPress Alt Temanızdaki Sorunlar Nasıl Giderilir?
Daha önce hiç alt tema oluşturmadıysanız, bazı hatalar yapma olasılığınız yüksektir ve bu normaldir. Bu nedenle bir yedekleme eklentisi kullanmanızı, yerel bir site veya hazırlama ortamı oluşturmanızı ve demo siteniz için kukla içerik kullanmanızı öneririz.
Tüm bunlar söylenirken, çok çabuk pes etmeyin. WordPress topluluğu çok beceriklidir, bu nedenle yaşadığınız sorun ne olursa olsun, muhtemelen bir çözümü zaten vardır.
Başlangıç olarak, bir çözüm bulmak için en yaygın WordPress hatalarımıza göz atabilirsiniz.
Muhtemelen göreceğiniz en yaygın hatalar, kodda gözden kaçırdığınız bir şeyden kaynaklanan sözdizimi hatalarıdır. WordPress’te söz dizimi hatasının nasıl bulunacağı ve düzeltileceğine ilişkin hızlı kılavuzumuzda bu sorunları çözme konusunda yardım bulabilirsiniz.
Ayrıca, bir şeyler çok yanlış giderse her zaman yeniden başlayabilirsiniz. Örneğin, ana temanızın gerektirdiği bir şeyi yanlışlıkla sildiyseniz, dosyayı alt temanızdan silebilir ve baştan başlayabilirsiniz.
Umarız bu makale bir WordPress alt temasının nasıl oluşturulacağını öğrenmenize yardımcı olmuştur. WordPress temanızı en son standartlara göre nasıl test edeceğinize dair nihai kılavuzumuza ve ücretsiz ve premium WordPress temaları hakkındaki karşılaştırma yazımıza da göz atmak isteyebilirsiniz.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Mahesh Yadav
One thing I want to know, if we make a child theme then we have 2 CSS files to load one parent theme CSS and second child them CSS. Wouldn’t it increase the site load time and It added one more CSS to load?
WPBeginner Support
While the load time would technically increase, it shouldn’t be by a noticeable amount.
Yönetici
Nadia Shaheen
Great work!
stay blessed and keep sharing awesome content.
WPBeginner Support
Thank you, glad you liked our content
Yönetici
Fahad
Great Work !
This site is super helpful
Keep it up !!
WPBeginner Support
Thank you, glad our article was helpful
Yönetici
Daniel Waduka
I am just starting to use child themes, and this article has been of so much help to me.
Thanks so much.
WPBeginner Support
Glad our guide could be helpful
Yönetici
Marcos Flores
Hi! i’ve been reading this article and it works! but i also read wordpress documentation about this and they say this
“Note that the previous method was to import the parent theme stylesheet using @import: this is no longer best practice, as it increases the amount of time it takes style sheets to load. The correct method of enqueuing the parent theme stylesheet is to add a wp_enqueue_scripts action and use wp_enqueue_style() in your child theme’s functions.php ”
Should i use both method? or if i user the function.php i dont need to write import function inside style.css (located in my child-theme folder)
Khema
Your instructions are missing a step with the functions.php creation. It should mention that needs to wrap the whole file. In this case I didn’t want to add the example you used and to another piece of code from the article you linked to. Naturally those codes didn’t include the php tag.
Thanks for the article. It’s very very helpful.
rReons
So question. I was using my wordpress theme without any child theme and was doing all the changes in to it. I have created a child theme thanks to your guide and I’m using that now as the website theme.
My question is both themes have the same modifications changes. If I update the main theme from now on, will the changes affect the child theme also?
balu
He! wpbeginner. Wordpress official site saying this. You need to update the post. Thank You!
Note that the previous method was to import the parent theme stylesheet using @import: this is no longer best practice, as it increases the amount of time it takes style sheets to load. The correct method of enqueuing the parent theme stylesheet is to add a wp_enqueue_scripts action and use wp_enqueue_style() in your child theme’s functions.php. You will therefore need to create a functions.php in your child theme directory. The first line of your child theme’s functions.php will be an opening PHP tag (<?php), after which you can enqueue your parent and child theme stylesheets. The following example function will only work if your Parent Theme uses only one main style.css to hold all of the css. If your child theme has more than one .css file (eg. ie.css, style.css, main.css) then you will have to make sure to maintain all of the Parent Theme dependencies.
Pat
Great info…you made it to my save list!! Thanks!
Alfonso de Garay
I have a Child theme with the theme latest version installed in my site. WP version 4.7.5. Received a notice that says WP version is available please update now.
1. Do I have to backup my site again before updating?
2. Do I have to create another Child theme using Child version 1 one?
2. How can I change the Name, email and URL to Chile version 1
WPBeginner Support
Hi Alfonso,
WordPress updates normally do not affect your themes so you do not need to create another child theme. You should always backup your website before updating WordPress.
Yönetici
Lisa Bruce
Hi, I can see that this video/post is a few years old, so I’m a little late to the party, but I have a questions I was hoping you could help me with.
I am a relatively new to WP and just came to realize the importance of child themes. I have been working on developing a site for a friend and have made several changes to the theme that I am using. I found a bug in the theme and contacted the theme developer and they said that the bug had been fixed in a recent update.
If I install the update I believe I will loose all my customizations. Is it too late to create a child them? Is it possible to do it now and then install the update? I prefer not to have to start from scratch.
WPBeginner Support
Hi Lisa,
If you know what changes you made and to which files, then first download a backup of your existing theme to your computer. After that, install the updated version. You can now create a child theme and then copy and paste the code from your customized version to the child theme.
Yönetici
Nell Yang
Thank you for this helpful post. I have always been looking for a video to show me how exactly should I use child theme. It is quite time consuming that each time after I updated my theme, all my styles just went away. It is frustrating to do everything over again. I tried to read the documents from wordpress but still don’t know how to proceed after activate the child theme. Keep up the good work! Thank you again!
Tony Agee
Good instructional video. Most tutorials I have watched tell you to paste the code in the file but they neglect to tell you what medium to paste the code to. I was going to use Notepad++ but I guess you can use regular notepad.
JP
Hello, i just want to say that you are a very good writer, very clear and simple. I past a long time on your article for learn WP.
Thank you!
Rob Brooks
Hi. Thank you for being a great WP resource. I am new to WP and really appreciate your guidance. I have followed the article to the letter but when I go to enable the child template on the site, I get the error “The parent theme is missing. Please install the “Real Estate Lite” parent theme. As you see I am using a free template called Real Estate light. it is located in the ../real-estate-lite/ directory of wp-content/themes. My code is below… did I do something wrong?
1-click Use in WordPress
In addition, I will mention the theme was free and is running on WP version 4.7.2 (Running on Plesk). I created style.css file directly on the server so no FTP issues.
I have already made significant changes to the parent style.css file as well as functions.php … I am not sure if this would affect this, but going to test on an unedited dummy domain to see if I get the same results
Any guidance/assistance you can provide would be greatly appreciated.
WPBeginner Support
Hey Rob,
You will need parent theme to be installed on your site and Template value should match parent theme’s actual name which you can see in it’s style.css file.
Yönetici
Carrie
Hi! Great article! I am finally starting to understand how to edit css so that I get the result I want, thanks to this article.
Thanks much for the simplified explanation!
Nalin
I created a child theme & Using @import for the “style.css” on a child theme. Now I want to change in another css file of parent theme’s folder ….. /font_awesome/css/fontawesome.css
Now, I want to know that where I will put my new fontawesome.css in child theme & how to use @import command.
or any other process to use more css file in child theme.
Rebecca
So, I don’t have the wp content folder on my computer. What should I do?
Should I have downloaded this at some point?
WPBeginner Support
Hi Rebecca,
The wp-content file is hosted on your hosting account not on your computer. You will need an FTP client to connect to your server.
Yönetici
Brad
Using @ import is no longer best practice
SAppa
Then what is the best practice now? You should be able to back up your comment.
Jual beli rumah
Thankyou
Jean-philippe
I am learning so much since a few hours on your website. Everytime I search something in google related to “how to” in wordpress I find that the best information is here at WPbeginner. It is always well explained and easy to understand. I will always come back for information here without a doubt.
WPBeginner Support
Hi Jean-philippe,
Thanks for the kind words, we are glad you find WPBeginner helpful Don’t forget to join us on Twitter for more WordPress tips and tutorials.
Yönetici
Smart Rashed
This is the article ,which i am looking for,thanks man.
Kevin
I know this will be a stupid question. I’m so new to this and have no skills at all. If I am creating a file, style sheet, etc. on my wp installation file on my local pc, how does that get onto my website? I guess I’m missing that? I use like 3 different PCs to work on my website and those local files aren’t on all of them. Again, I am sure I am missing something really dumb. Not seeing the connection.
WPBeginner Support
The files you edit on your computer need to be transferred to your website using an FTP client. See our guide on how to upload WordPress files using FTP.
Yönetici
Kevin
Ok, I got that and made a child theme, but when I activate it, the formatting on the site is all off from the parent theme. What did I do wrong?
Francesco
Hi there,
I’m following your tutorial but WordPress (4.5.3) doesn’t recognise the new folder on my online server. How can I work around this?
Thanks,
F.
Muhammad Moosa
Helpful article indeed, I followed it and created a child theme. Thanks.
Carolina
Hi, thanks for the tutorial, very helpfull. But I have a question. Can I create a child theme from an already established website? I have a client who designed his own website but did not create a child theme. How to go about it?
WPBeginner Support
If their current theme follows WordPress coding standards and best practices then you should have no trouble creating a child theme.
Yönetici
Mike
Thank you so much for the article and video. Apparently since these were created WordPress has new best practices listed in their codex which is confusing me.
“The final step is to enqueue the parent and child theme stylesheets. Note that the previous method was to import the parent theme stylesheet using @import: this is no longer best practice.”
Do I stick with the steps you outlined herein verbosely, or do I omit the import function and create the PHP file, or do I implement both?
My theme’s style.css file only contains a header so importing that file seems irrelevant, and there are multiple CSS files like main.css located elsewhere in the parent’s file structure. Not knowing any better as a beginner I have already made changes to main.css to achieve some of my goals and only now I realize the child theme is necessary.
Any advice is greatly appreciated.
Best regards,
Mike
WPBeginner Support
You will need to import at least your style.css file it should be in your parent themes main directory. It should automatically import other CSS files.
Yönetici
Mike
Even if the style.css has nothing but the header?
Jack
If your style.css file do not have imports to other css styles, you can import them directly, just like style.css.
Olamide
Good day. When I did a live preview of the child theme, I noticed that it didn’t have the css of the parent theme. Maybe this is as a result of an error in the way I inserted the code?
This is the code that I inserted:
/*
Theme Name: sparkling child
Theme URI: https://www.wpbeginner.com/
Description: sparkling child theme
Author: djetlawyer
Author URI: http://www.example.com
Template: sparkling
Version: 1.0.0
*/
@import url(“../sparkling/style.css”);
The parent theme is “sparkling”. If there is any error, please correct me.
Thank you.
WPBeginner Support
The code is correct.
Yönetici
lucia
Hi there,
I am trying to set up a child theme to activate my footer on twenty twelve, but I don’t know what code to use to set it up.
I tried this webpage
with various suggestions , and I have tried to change your suggestion as given on twenty thirteen , but I don’t succeed.
Could you please give me the right working code for setting up a child them for twelve twelve.
Leigh
This was incredibly helpful – especially your HTML for us to copy. I’ve never been so excited to see colors change on a website before. This is easily the best “how-to” out there for this theme!
Bhautik Andhariya
Hello, I have tried same example that you shown. But my child theme is replacing all the style of its parent theme.
It doesn’t have any style of it’s parent. What is the solution? Can you please help me? I am new in wordpress and i am learning it.
Angelo
Hi there!
I’ve just installed the Bose template and also created a child theme for it. However, the following error message appears on the center of my website:
Warning: implode(): Invalid arguments passed in /home/hello582/public_html/teste/wp-content/themes/bose/featured.php on line 12
I’m a very beginner at websites creation, so I haven’t got any clue about what the problem is. Could anyone help me?
Thanks a lot!
WPBeginner Support
Please contact the theme developer for support.
Yönetici
Djamila
Hi,
Thanks for the article! I could not get my child theme to ‘appear’ in the template section and it turned out I indeed misspelled the way the original template was named. What a difference a capital makes, huh?
However, now that I have my child theme I was able to update the parent theme and when I did all of a sudden I got an issue with a super important plugin ( I am building a review blog on a local database, for now and it’s the wrap up/grading plugin belong to the template designers).
In the parent template they ‘upgraded’ this plugin. I personally prefer the old one, but okay…anyway…underneath my review you now see *both*, the old wrap up with grades and the new one, which looks out of whack too. I have de-activated and re-activated but it stays like that. Super annoying and I don’t know where to look to either keep the old one (prettier) or only the new one and outlines as should.
Where should I start? Thanks for any help you can give me.
WPBeginner Support
Contact the plugin support.
Yönetici
Amanda
Thanks for a great article!
If I use a child theme, will I still be able to customize it using the Appearance> Theme Options that comes with my theme in the admin panel such as font size, background colors etc. or do I have to go the code route?
If I have activated the Child theme and I use the Appearance tab to update the styling instead of using code, is it essentially still updating the parent theme because the related files are not in the child theme folder?
WPBeginner Support
Yes, your child theme will inherit all these options.
Yönetici
Amanda
Thanks for your reply.
So if I activate the Child Theme and use the settings in the Appearance tab of my admin panel to change the styling (instead of writing css code), my changes won’t be overwritten when I do a theme or Wordpress update on the parent theme?
Would I still need to copy the stylesheet, header, footer files etc. to the child theme folder to make the scenario above work?
Laura
I’ve been following these (and other) steps to create a child theme based on twentytwelve. The issue I’m running into is that wordpress seems to ignore only some of the css I’ve changed from the original theme and it’s driving me nuts. For example, I’ve successfully changed the background colour of the menu, but it simply won’t let me change the text colours of anything. I’ve used your approach of editing it in chrome’s code inspector thing (which worked great, the colour got changed, suggesting my code was correct) and pasting the changed code into the style.css of the child theme, but it doesn’t seem to get picked up at all. I don’t know what to do about this, any insights would be very welcome!
Boyet
Thank you very much for this tutorial. I don’t have problem editing my child theme’s stylesheet, header, and footer files.
My question is, what will I do if I wanted to change something in a file located in my mother theme’s folder like: public_html/wp-content/themes/shopera/woocommerce?
Do I need to create the same path in my child theme?
Thanks in advance…
WPBeginner Support
Yes.
Yönetici
Tony Arnold
Very helpful and largely understood and executed.
I am trying to make my header image full width.My theme doesn’t ‘allow’ this as standard so do i change the file?
Thank you
Sohail Farooq
Love this article I tried and got it worked at once.
Xander
Hi, there!
It seems I have got stuck a little bit. I have already made some changes in the some .php-files (e.g. header.php, footer.php and so on) of my parent theme without having a child theme installed.
Now I want to create a child theme because updates of the parent one have been coming. What should I do with all those already modified files? Should I copy them in the child theme’s directory? What are folder I need to have it it? Should I create the same folders that the parent theme has got for the child theme?
Thank you,
WPBeginner Support
You don’t need all the folders of your parent theme. You just need to recreate the files where you have made changes. We have a tutorial on how update themes without losing changes. It has a section where you can find out which files you have modified in your theme and what changes you have made to them.
Download a fresh copy of your parent theme on your computer. Download the old theme to your computer and then upload the fresh copy. After that create a new child theme. Copy the files where you have made changes from the fresh theme to your child theme. Copy the changes you have made in the old theme files into the files of your new child theme.
It would take some troubleshooting before you get it right. So we strongly recommend you to backup your site first. If possible test your changes on a local WordPress install first.
Yönetici
Xander
Thank you. Could you please give me a link on the tutorial mentioned?
There is another obstacle – I have changed functions.php file, how can I reconcile both of them in the parent and child themes?
Chris
Can I load and install my new child theme on another site? If so how?
Thanks!
WPBeginner Support
Download your child theme to your computer. Create a zip file containing the theme folder. Go to the admin area of another site and then visit Appearance » Themes. Click on the add new theme button and then click on the upload button. Upload the zip file you created earlier. WordPress will extract and install your child theme.
You will also need to install the parent theme as well.
Yönetici
Daniel Garneau
Hello,
I find this tutorial very useful to learn how to create a child theme. But in the process I made the following ajustments. There needs to be two files in the child-theme directory. They have to be named style.css and functions.php.
style.css must contain at least (supposing one is using the TwentyTen theme):
@import url(“../twentyten/style.css”);
Template: twentyten
When I consulted the turorial on 2015-05-12, the “template: twentyten” line was in the comment block. It must be a command that can be read by WordPress.
Also, there must be a functions.php file, and it has to have minimally the following line of command :
<?php
Your tutorial along with the wp codex, helped me creating my first child theme. Thank you.
Maria
Is it safe to say that the changes I made in the custom css field can be placed into my child’s theme style.css?
WPBeginner Support
Yes.
Yönetici
Louise Mason
I am falling at the first fence – how do i find /wp-content/themes/? Actually where is the WordPress installation folder? In the video i can’t see what you click on or how you open it, the file manager just appears by magic!
WPBeginner Support
You can access File Manager by visiting your web hosting dashboard. Login to your web hosting account and locate File Manager.
Yönetici
Sonam
when I select the file manager of my web hosting account , I get four options :
1)home directory
2)web root
3)public ftp root
4)Document root
which one should I select to work on.
Kylee
Hi – I go with Home Directory. That takes me to all the files. I click on Public HTML on the left to access my various sites. You probably figured it out at some stage but just in case you didn’t…
Viju
Hi,
I’m using a child theme for my website. What I’m struggling is to give a version to my style.css of the child theme. Wordpress seems to append default wordpress version at the end of the file like /style.css?ver=4.1.1
I’m incrementing the value of ‘version’ in my child’s style.css , but wordpress is not picking it.
Because of this my changes to the child theme are not getting reflected to users who has the cached version of the css.
can you advise how to handle this ?
Stephen James
At the very start I am lost. Where did you get the style css code at the start???? You only tell us to past it in but not where it came from. Surely if I am using a different theme it will be a different code.
Vatsal Savani
Hey Stephen,
The code at the start is like general info for the theme, it is nearly the same for every theme, you just have to change the content after the colon, i.e. If your theme name was stephenstheme, you may have the code at the start be like:
Theme Name: stephenstheme
Theme URI: http://www.yourwebsite.com
Description: A Twenty Thirteen child theme made by stephen
Author: Stephen James
Author URI: http://www.yourwebsite.com
Template: twentythirteen
Version: x.x.x
Hope you get what I mean, good luck!
Ariz Khan
Hi WPB, I solved it, reference to my previous mail. Guess what – it was syntax error on my part – I uploaded Style.css, which I renamed to style.css as required and voila it worked. Thanks.
WPBeginner Staff
Did you save the template file as style.css
ada
I also had the same problem. I deleted the numbers on notepad and could see the template.
Kim
I’m trying to create a child theme for twentythirteen following your instructions above. I created the folder and copied the code you have listed above into a text file. I saved the code to the new folder. I am unable to activate the child theme because the “template is missing”. Help!?
canciller
Using @import for the “style.css” on a child theme is not reccommended by wordpress codex
http://codex.wordpress.org/Child_Themes
is it safe to use it ? what are the downsides of using @import ?
Pat
The downside of using @import instead of wp_enqueue_script(), as recommended in the codex, is slower page loading. An employee at Automattic gives an explanation at this link https://kovshenin.com/2014/child-themes-import/
Vatsal Savani
In short, it will decrease the performance of your site and also make it slower.
Praveen Kumar
What about building child themes on Genesis Framework?