ev borcu WordPress sitesi
WordPress Sitenize Özel Kod Nasıl Eklenir (Düşündüğünüzden Daha Kolay!)
Bir WordPress sitesini değiştirmek için PHP, CSS ve HTML5 yazmak oldukça sinir bozucu olabilir, ancak iyi bir rehber bunu kolaylaştırabilir. Bu o rehber değil. Bu, zaten yapıldıktan sonra kodu sitenize nasıl ekleyeceğiniz ile ilgilidir. Endişelenme, yine de – bu da aynı derecede önemli. Bunu yapmanın birkaç yolu olduğundan, çeşitli seçenekler arasındaki farkları bilmek yardımcı olur. Ama önce iki uyarı:
- Herhangi bir şeyi değiştirmeden önce, yedekleyin. Aslında, süreç boyunca çalışmanızı yedeklemeye devam edin. Ayrıca, atılan veya yakında kullanılacak kod parçacıklarını yapıştırmak için ayrı bir dosyaya sahip olmanıza da yardımcı olur.
- Başka birinin temasını yüklediyseniz, temanızın function.php veya style.css dosyalarına asla kod eklemeyin. Bunu yaparsanız, tema güncellendiğinde tüm sıkı çalışmalarınız silinecektir.
Bu makalenin geri kalanında, en basitten en karmaşığa doğru düzenlenmiş bazı alternatifleri keşfedeceğim.
WordPress Eklentileri
Birden çok kod değişikliği türü olduğu gibi, birden çok türde özel kod eklentisi vardır. En yaygın 2 tür PHP ve CSS'dir. Bildiğiniz gibi PHP, WordPress'in mimarisini ve işlevini yönetir. Bu nedenle, web sitenizin temel işlevlerini değiştirmeye, bir özellik eklemeye veya değiştirmeye çalışıyorsanız, bu konuda size yardımcı olacak birçok PHP eklentisi indirilebilir.
Aynı şekilde, muhtemelen CSS'nin de ne yaptığını biliyorsunuzdur – işleri güzelleştirir. Ve değiştirmek istediğiniz tek şey buysa, Özel CSS Eklentisi bunu minimum güçlükle yapmanıza izin verecektir. Arka planda gizlenen, eklentilerle karmaşık bir ilişkisi olan JavaScript'tir. Açıklığa kavuşturmak gerekirse, üstbilgiye, altbilgiye veya alt temaya eklerseniz mükemmel şekilde çalıştığından biraz farklıdır – ancak bir gönderide kullanmak için özel bir eklenti kullanmanız gerekir. CSS ve Javascript Toolbox gibi bir şey hile yapmalı. Bir yan not olarak, sayfanızın hızı adına, onu altbilgiye koymak daha iyidir.
Kendi Eklentilerinizi Yazma
İnternette belirli bir özelliği değiştirmek, devre dışı bırakmak veya değiştirmek için bir ton WordPress kod parçacığı vardır. Ancak, bunları nereye koyacağınızı bilmek işlevsellik için çok önemlidir. Örneğin, bir eklentinin işlevini değiştiren bir snippet'iniz varsa, hangi temayı etkinleştirmiş olursanız olun, onun çalışmasını istersiniz. Aynısı, site genelindeki değişikliklerle ilgilenen snippet'ler için de geçerlidir. Bu nedenle, her iki durumda da onlar için yeni bir eklenti oluşturmak iyi bir fikir olabilir. Endişelenme, göründüğü kadar korkutucu değil.
Eklenti oluşturmanın başlıca faydalarından biri, eklentiyi istek üzerine etkinleştirmenize veya devre dışı bırakmanıza izin vermesidir. Ayrıca eklenti sayfalarında eklentiyle ilgili bağlamsal bilgilerin görüntülenmesine izin verir. Tek büyük dezavantajı, siteyi değiştirmesine izin verilen herhangi biri tarafından yanlışlıkla devre dışı bırakılabilmesidir, ancak onlara sert bir uyarı bunu önleyebilmelidir.
Ek bir not olarak, wp-content klasörünüzde mu-plugins adlı bir klasör de oluşturabilirsiniz. Buraya eklenen PHP dosyaları her zaman yürütülür ve etkinleştirilemez veya devre dışı bırakılamaz. Bu, özel kodu tema ve eklenti klasörlerinden uzak tutar. Ancak bunu yalnızca arka planda çalışırken her zaman rahat edeceğiniz eklentilerle yapın.
Özel CSS Dosyaları
Planladığınız değişiklikler küçükse, bir custom-style.css dosyası oluşturabilirsiniz. Değişikliklerinizi yapmadan önce önizlemek istiyorsanız, Chrome veya benzer bir uygulama çalıştırıyorsanız her zaman DevTools'u kullanabilirsiniz. Başka bir olasılık da WordPress temanız aracılığıyla özel CSS eklemektir. Total çerçevemiz gibi bazı premium temalar, kolayca bulabileceğiniz ve ince ayar yapabileceğiniz özel CSS eklemek için bir tema paneli seçeneği içerir. Ayrıca temanızı güncellediğinizde tema paneli ayarlarınız değişmeden kalmalıdır – böylece özel CSS'niz olduğu gibi kalır.
CSS'nin tersten basamaklandığını unutmayın, yani daha sonra görünen kurallar her zaman daha önce görünen kurallara göre önceliklidir. Bu nedenle, ayrı bir sayfaya uygulanan herhangi bir CSS, sayfanın varsayılan kodunu geçersiz kılar. Bu, içine eklenen CSS için de geçerlidir…
WordPress Alt Temaları
Yeni başlayanlar için, bir alt tema, başka bir temanın işlevselliğini devralır ve tasarımınızı istediğiniz zaman değiştirmenize olanak tanır (bilmek istediğiniz her şeyi WordPress alt temaları kılavuzumuzda öğrenebilirsiniz). Güncelleme sırasında değişikliklerinizi kaybetmeden bir temayı değiştirmenize izin vermek için özel olarak icat edildiler. Alt temalar, dış veya 'ana' temada yaptığınız tüm değişiklikleri yansıtır. Yani, bir Photoshop katman efekti uygulamak gibi, aslında içeriği düzenlemiyorsunuz; her şeyi eski haline döndürmek için istediğiniz zaman kaldırabilirsiniz.
Kodunuzu değiştirmek istediğinizde bir alt tema oluşturmak size birçok baş ağrısından kurtaracaktır ve bu oldukça kolaydır (WordPress değişiklikleri devam ederken). FTP yoluyla sitenize erişin ve bir klasör oluşturun, ardından bu klasöre karşılık gelen bir style.css dosyası oluşturun. Bunu theme-name-child olarak adlandırmak standart bir uygulamadır. Bundan sonra, şablonu tanımlamak için yeni style.css'inizin başlığındaki tek bir satıra ihtiyacınız var. Ancak, WordPress Codex sayfasında bulunabilecek bazı şeyler de var.
Ardından, @import satırının altındaki mevcut temada gerekli değişiklikleri yapın. Alt temaların tek dezavantajı, ana tema üzerinde değişiklik yapmadan önce, herhangi bir çakışmaya veya garip yan etkilere neden olmadan yapmanız gereken araştırma miktarıdır. Ve unutmayın ki, alt temalarda, yalnızca orijinal temadan neyin farklı olacağını belirtmeniz gerekir. Değişiklikleri uygulamak için sıkıştırın, WordPress kontrol panelinizdeki Görünümler > Temalar sayfası aracılığıyla yükleyin ve WordPress aracılığıyla etkinleştirin. Bu, elbette ana temanızın da yüklendiğini varsayıyor.
Kodu Gösterme
Ele almadığımız bir kod ekleme türü daha var: gösterme. Bir web tasarımcısıysanız ve bir şeyin nasıl yapıldığını göstermek istiyorsanız, bunu görüntüleyenlerin kopyalayıp yapıştırabileceği bir şekilde sunduysanız, doğru şekilde not etmek önemlidir. Kodunuzun WordPress tarafından yorumlanma şekli, Visual Post Editor'ün HTML bölümünü kullanıp kullanmadığınıza bağlıdır. Doğrudan görsel düzenleyiciye girmek, onu etkisiz hale getirmek için işe yarayacaktır, ancak onu doğru biçimlendirmeye veya bir kod kutusuna koymanın hiçbir yolu yoktur. Görsel düzenleyici, onu sıradan metinle aynı şekilde biçimlendirir. Öte yandan, HTML düzenleyici onu koda dönüştürecek ve web sitenizi mahvedecektir. Endişelenme, bunu geri alabilirsin.
Ancak, bir uzlaşma var. <code> ve </code> etiketlerini kullanarak kodunuzu vurgulayabilir ve bir bloğa koyabilirsiniz, ancak bu, kodun etkinleştirilmesini durdurmaz. Resmi olarak kod olduğunu göstermek için tek yapacağı montoype yazı tipine, bir kutuya koymak. Etkinleşmesini durdurmak için aktif sembolleri eğlenceli karakter varlıkları olarak adlandırılanlarla değiştirmeniz gerekir. Bunların en yaygın sürümleri ve çoğu kodu etkisiz hale getirmek için yeterli olanlar, < ve >'i < ve > , sırasıyla (WordPress gönderilerinize özel kod yazma konusundaki yazımızda kod gösterme hakkında daha fazla bilgi edinebilirsiniz).
Gördüğünüz gibi, WordPress'e özel kod eklemenin birçok yolu var ve sizi denemenizi, onlarla oynamanızı ve hangilerinin sizin için doğru olduğunu görmenizi tavsiye ederim. Kaçırdığım özel kodu eklemenin başka yolları var mı? Yorumlarda bana bildirin.