✅ Joomla için bir şablon oluşturun

İçindekiler

Şablonumuzu geliştirmeden önce Joomla dosya ve dizin yapısının bazı kavramlarını bilmemiz gerekiyor. Bazı ana dizinler, öğeler ve dosyalar şunlardır:
ŞablonWeb sitesinin benimseyeceği yapı ve tasarımı belirleyen bir dizi dizin ve dosyadır. Yaptığımız geliştirmelere göre tasarımı seçmek ve değiştirmek için birkaç şablon yükletebiliriz.
Bir şablon dosyası genellikle, web içeriğinin sayfaya veya bölüme göre görüntüleneceği web'in bloklarının veya div katmanlarının tanımlandığı HTML ve php kodunu birleştirir.
Ek olarak, yürütmemiz gereken eklentileri veya işlevsellik kodunu eklemek için HTML şablonunda başka bloklar tanımlanabilir. Genel olarak blok tanımladığımız bloklar, web'in başlığı, gezinme çubuğu veya menüsü, varsa yan sütunlar, içerik alanıdır, gerekirse istediğimiz tüm blokları oluşturabiliriz, hepsi buna bağlı. geliştirmek için gereksinimler. Bu bloklara veya alanlara pozisyonlar denir.
ModülJoomla modülü, web şablonunda belirli konumlarda veya belirlenmiş bloklarda görüntülenebilen HTML, PHP, CSS veya JavaScript koduna sahip bir nesnedir. Örneğin, başlığa, bir dil seçiciye, bir iletişim formuna vb. bir kullanıcı erişimi koyabiliriz.
EklentiBir Joomla eklentisi, web içeriğine gömülebilen HTML, PHP, CSS veya JavaScript koduna sahip bir nesnedir. Modülden farkı, eklentinin sayfada göründüğü yerdir. Eklenti, örneğin bir e-postayı doğrulamak için bir olay oluşturmak için yürütüldüğünden, genellikle hangi konumda olduğunu gösteremez.
BileşenBileşen, modüller ve eklentilerden oluşan bir koleksiyondur. Örneğin, bir bileşen Virtuemart gibi sanal bir mağaza olabilir, tüm bileşen nesnelerinin kendi ayarları vardır ve ayrı bir sayfada görüntülenebilir.
Joomla şablonunun yapısı
Şablon, web'in yapısını ve farklı öğeleri atayabileceğimiz blokları veya konumları tanımlayan bir dizi dosyadır. Joomla için bir Şablon aşağıdaki dosyalardan oluşur:
index.php: web sayfasının yapısını ve tasarımını açıklayan ana dosyadır
hata.php: sayfa bulunamadı hatası, 404 hatası durumunda direktifleri içerecek dosyadır.
Resimleri önizle: template_preview.png.webp ve template_thumbnail.png.webp adlı şablonlardır ve yöneticiden küçük resim olarak şablonun bir önizlemesini görmenizi sağlar.
Components.php: Bu dosya, web'in yazdırılabilir bir sürümüne ihtiyacımız varsa, stil sayfalarını yazdırılacak makaleyi sunacak şekilde yapılandırırız.
Görüntüler: görseller için tasarımın tüm görsellerini kaydedeceğimiz dizindir.
js: bu dizine javascript veya Jquery betiklerini veya ne kullanırsak kullanacağız.
dilim: bu dizinde farklı dillere çeviriler için gerekli dosyaları bulabiliriz.
Önemli bir husus, güvenlik nedenleriyle, her dizinin dışarıdan okunmasını önlemek için boş bir index.html dosyasına sahip olması gerektiğidir, böylece dizine erişmek isteyen herkes yalnızca boş bir belge görür.
Örneğimiz için Joomla'yı kurduktan sonra, şimdi nasıl kurulacağını belirtmeyeceğiz, basitçe http://www.joomlaspanish.org/ adresinden indirilebilir.

Joomla'yı kurduktan sonra başka bir yerde Joomla dizini dışında bir dizin oluşturacağız ve adını veriyoruz. Demo şablonumuzu oluşturmak için. Bu dizinde önce dosyayı oluşturacağız. şablonAyrıntıları.xmlŞablonun konfigürasyonunu içeren , içine aşağıdaki xml kodunu yazıyoruz.

 Demo Şablonu 1.0 26/02/2015 Sergio [email protected] Telif hakkı (C) 2015 Joomla 3.0 için Demo Şablon demosu index.php css görüntüleri hata ayıklama konum-0 konum-1 konum-2 konum-3 konum-4 konum-5 konum -6 pozisyon-7 pozisyon-8 pozisyon-9 pozisyon-10

Dediğimiz şablonun adını tanımlarız Şablon demosuŞablonu Joomla'ya kurduğumuzda, yönetici bu adı bir dizin oluşturmak ve şablon dosyalarını kaydetmek için kullanacaktır, ayrıca yönetici panelinde, yazarda, şablonun içerdiği dizinlerde ve şablonda görülecek olan ad olacaktır. sahip olacak pozisyonlar, hepsini kullanmasak bile birkaç tane tanımlayabiliriz.
Sonra dosyayı oluşturacağız index.php web'in yapısını ve ilgili pozisyonları tanımlayacağımız yer.

 
 .container {genişlik: 980 piksel; sol kenar boşluğu: otomatik; / * web'i ortalıyoruz * / margin-right: auto; kenarlık: düz 1 piksel siyah; } .container {kenar boşluğu: 20px 0px; / * içeriğe 20 piksellik bir kenar boşluğu uyguluyoruz * / border: katı 1 piksel yeşil; } .content {float: sol; genişlik: 750 piksel; kenarlık: düz 1 piksel kırmızı; } .colder {float: sağ; genişlik: 270 piksel; } .colder, .pie, .head {border: 1px düz mavi; }

CSS sınıfları, hangi bloklara ve hangi konumlara sahip olduğumuzu belirlemek kolaydır. Son olarak, şablonu içeren dizine sahip bir zip dosyası oluşturuyoruz ve onu joomla yöneticisinden yüklüyoruz. Joomla yönetim paneline erişiyoruz.

Oradan menüye geçiyoruz. Uzantılar> Uzantılar Yöneticisi ve elimizdeki şablonu zip formatında yüklemeye devam ediyoruz.
UnutmaHer şablonun Joomla sürümüne göre farklılık gösterdiğini unutmayın, bu durumda 2.5 ila 3.x ile uyumludur. Ayrıca tüm dizinleri yüklemek için dosya yükleme izinlerinin olması gerekir.

BÜYÜT

Büyütmek için resmin üzerine tıklayın

Şablon yüklendi ve bu durumda İspanyolca sürüm 2.5'ten Joomla'dan varsayılan bilgileri alarak, varsayılan olarak bu şekilde atandığı için kullanıcı erişim modülünün otomatik olarak 3. konuma nasıl yerleştirildiğini görüyoruz, web içeriği ise 1. konuma yerleştiriliyor. web içeriğinde atadığımızdır. Yöneticiden, yönettiğimiz farklı öğelerin konumunu değiştirebiliriz.
Şablonu yükledikten sonra, güncellemek veya değiştirmek istersek, Joomla'da kurulan şablonun koduna göre hareket edebilir veya Joomla'nın dışında başka bir dizinde çalışabilir, zip dosyasını yeniden oluşturabilir, ardından şablonu silebiliriz. joomla'dan ve yeniden yükleyin.