Pradžiai ko reikės
• Joomla! 1.5 Template Toolbar - įrankis, padėsiantis gan greitai ir paprastai sukurti Joomla šabloną. Atsisiųskite, išarchyvuokite ir pasilikite tik .exe failą (na nebent jums pasiskaitymui įdomūs kiti). Jo instaliuoti nereikės, paspaudus ENTER iškart galima naudotis.
• Koks nors redaktorius, kad ir notepad++ ar bet kokia kita programa, skirta web kūrimui ir redagavimui.
• Jūsų jau sukurto statinio šablono (HTML, CSS). Iš jo trinat visus tekstus ir paliekat švarų šabloną.
• Joomla 1.5x
• Serverio, kuriame bus talpinama
Kas sudaro Joomla šabloną?
1. index.php – tai yra jūsų šablono failas, kuris anksčiau galbūt vadinosi index.html.
2. templateDetails.xml – joje bus informacija apie jūsų šabloną.
3. index.htm – visiškai tuščias failas, jis šiek tiek apsaugos nuo smalsių akių.
4. params.ini – tuščias failas šablono nustatymams saugoti. Šablono nustatymai skirti pažengusiems kūrėjams, tad apie tai vėliau.
5. favicon.ico – tinklalapio ikona adreso lauke.
6. template_thumbnail.png – šablono paveiksliukas „printscreen“.
7. offline.php – failas, kurio turinys rodomas, kai tinklalapis laikinai išjungiamas. Šio failo nebūtina įtraukti į šabloną.
8. error.php – failas, rodomas įvykus klaidai, pvz. Neteisingai įvydus adresą. Šio failo nebūtina įtraukti į šabloną.
9. component.php – individualizuoja komponentų dizainą. Šio failo nebūtina įtraukti į šabloną.
Į šabloną taip pat įeina ir direktorijos css, images ir specifinė direktorija – html. Pastarojoje talpinami komponentų ir modulių šablonai, jei norima juos individualizuoti. Bet pradedančiajam jų nereikia.
Ir iškart [prie praktikos. Teoriją pasistengsiu paaiškinti jos metu.
Šablono kūrimas
1. Pirmiausia reikia susikurti vietą, kur viskas bus laikoma, t.y. forderį/direktoriją. Pas mane ji vadinasi „demo“, jūs galite pavadinti kaip norite.
2. reikia susikurti statinį šabloną. Kaip jis atrodys yra tik jūsų reikalas, bet aš kaip demo padarysiu visai paprastą:
3. Atsidarome atsisiųtą Joomla Toolbar ir: jame matome 4 mygtukus:
• pirmas yra „Insert Module“. Paspaudę ant jo pamatysite, kad šis suskirstytas dar į 3 dalis. Pirma dalis talpinama į index‘o headerį.
Antra dalis skirta atvaizduoti paveikslams, laikui ir t..t šablone.
Trečia dalis yra modulių pozicijos. Šiame įrankyje pateiktos standartinės pozicijos, bet jų gali būti kokių tik norite.
Apie viską plačiau ir kiek aiškiau bus paaiškinta vėliau.
• Antras mygtukas „Insert CSS“ iškart nukopijuoja į atmintį standartinį Joomla CSS, telieka tai įklijuoti/past į naują failą ir jį išsaugoti kaip css. Pas mane jis išsaugomas demo/css/template.css.
• XML Editor atidaro naują langą, kuriame užpildote pateiktą formą. Lango dešonėje spauskite ant „Add files“ ir susiraskite direktoriją, kurioje talpinami jūsų failai. Suradę jį pažymėkite ir spauskite OK. Tai atlikė spauskite CREATE ir išsaugokite failą pagrindiniame folderyje, pas mene: demo/templateDetails.xml. Vėliau šį failą bus galima dar pakoreguoti.
• 4 mygtukas yra nustatymai ir mums tai neįdomu, tad tai praleisime.
4. Pradeda redaguoti index.php:
• Atsidarome „Joomla Toolbar“ ir spaudžiame INSERT MODULE. Išsiskleidžia sąrašas ir spaudžiame HEADER. Iškart nusikopijuoja info į atmintį.
• Atsidarome index.php taip, kad matytume patį skriptą ir ištriname viską kas yra headeryje su juo pačiu ir jo vietoje įklijuojame/paste tai kas buvo išsaugota atminty.
• Kad nebūtų viskas labai išsiplėte index‘e, kur įdėjome nukopintą kodą, galime pratrinti komentarus esančius tarp /* ir */. Tai nėra būtina, bet vaizdas bus geresnis, ne taip ištempta.
5. Jau kaip ir įpusėjome tvarkyti index‘ą, teliko sudėti modulių pozicijas:
• Toolbar‘e spaudžiame INSERT MODULE ir pasirenkame LEFT (SIMPLE).
• Kaip galima spėti iš pavadinimo, tai turėtų būti susiję su kaire, tad dedam/įklijuojam/paste tai kur nors kairėje. Pas mane tai bus antra eilutė, pirmas stulpelis – geltonas laukas.
• Kartojame tą patį veiksmą, tik šį kartą pasirenkame RIGHT (SIMPLE) ir tai įklijuojame/paste dešinėje.. Pas mane tai atsidurs raudoname lauke.
• Kartojame tą patį veiksmą, tik pasirenkame TOP (SIMPLE). Jis pas mane atsidurs žydrojoje zonoje.
• Ir dar kartą kartojame veiksmą, tik šįkart renkamės BOTTOM (SIMPLE). Jis pas mane bus orandžiniame lauke.
• O dabar įdėsime svarbiausią dalyką MAIN BODY. Priešingai nei LEFT ar RIGHT, kurie tūno kažkur šonuose, mažai vietos užimančiuose laukuose, MAIN BODY turi būti talpinamas ten, kur turėtų atsirast pagrindinis turinys, tekstai, forumai ir visa kita. Pas mane tai žalias laukas
• Joomla Toolbar‘e nėra vieno labai svarbaus dalyko, klaidų lauko kodo. Pvz. Kai norite prisijungti ir įvedate neteigingą slaptažodį logiška būtų, kad pasirodytų kažkoks pranešimas, va būtent jan ir reikia šio kodo:
<jdoc:include type="message" />
Jį įdėkite virš MAIN BODY kodo.
6. Tvarkome CSS šablone
• Jau įkeliant HEADER su juo buvo įjkelta nuoroda į CSS. Ją gali tekti pakoreguoti.
• Jei pas jus CSS talpionami ne css direktorijoje, kaip parašyta kode:
templates/<?php echo $this->template ?>/css/template.css
arba failas vadinasi kitaip, pakeiskiite šią info, kad atitiktų jūsų failų ir forlderių pavadinimus.
• Jei jums reikia daugiau CSS failų, tiesiog nukopijuokite css eilutę ir pakeiskite failo pavadinimą.
7. Atrodo viskas kaip ir baigta su index.php, tad išsaugokite jį ir galite jau uždaryti. Tik kelios pastabos:
• Šablone nereikia rašyti tinklalapio pavadinimo < title > ar dėti ikonos skriptus, viską už jus padarys Joomla ir vėliau tai galėsite keisti per adminke.
8. CSS failo kūrimas:
• Toolbar‘e spauskite INSERT CSS ir įklijuokite/paste į jau sukurtą CSS failą, arba jį sukurkite ir pavadinkite template.css (arba kaip jūs norite:)
• Atsidarykite demo/css/template.css ir užpildykite jį.
• Naujokai tikrai nežinos ką dauguma CSS atitinka. Yra keli būdai kaip tai išsiaiškinti: padarykite ryškų back‘ą ir dideles raides (tada ta vieta aiškiai turėtų būti matoma naršant po tinklalapį) arba (geresnis variantas) naršant HTML folderyje (žiūrink konkrečius failus ir juose naudojamus CSS)
• Šiaip, tik mokantis galima pamiršt CSS. Tuo užsiimti bus galima pranokus.
9. sukuriame naują tuščią failą ir jį išsaugome demo/params.ini
10. template_thumbnail.png – tai turėtų būti mažas ~200x150 printscreen paveiksliukas. Tačiau nesukūrę pačio šablono jo turėti negalime, tad pasidarom belekokį tokio dydžio paveikslą ir išsaugome. Žinoma, jei kuriate ne nuo pačių pradžio, o pritaikote statinį šabloną prie Joomla, galite naudoti statinio šablono screen‘ą.
11. Įsitinkite, kad pas jus yra visi šie failai:
index.php – šablono failas
params.ini - tuščias failas parametrams saugoti
templateDetails.xml – Toolbar‘o sugeneruotas šablono info failas
template_thumbnail.png – šablono screen‘as
css/template.css – šablono CSS
12. suzipinkite viską ir galite jau instaliuoti savo pirmą šabloną.
Instaliacija
Atsisiųskite Joomla paketą, jį išarchyvuokite, įkelkite jį į serverį, įveskite jo adresą ir sekite instrukcijas. Baigę instaliaciją prisijunkite prie adminkės ir:
1. spauskite EXTENSIONS >> INSTALL/UNINSTALL
2. susiraskite vietą kur yra jūsų šablono zip, jį pažymėkite ir spauskite UPLOAD FILE& INSTALL.
3. eikite į EXTENSIONS >> TEMPLATE MANAGER ir susiraskite savo šablono pavadinimą. Radę pažymėkite jį ir viršuje spauskite DEFAULT
4. spauskite ant jūsų šablono pavadinimo ir pažymėkite YEA. Viską išsaugokite ir eikite pasižiūrėt kas gavos.
Mano zip‘as -> http://failai.in/F5FAFBD321/demo.zip
pė.es.: tai ką sakiau paaiškinsiu vėliau, paaiškinsiu tada/kai/jei būsiu to paklaustas
