Szakítsd át a sablon korlátait! (I.)

Dátum: 2009.07.08. 11:59, szerző: Balogh Attila (11) Hozzászólás

avagy hogyan készíts néhány perc alatt egyedi statikus oldalakat.

OK - túl vagy a WordPress telepítésén, néhány plugint bekapcsoltál (majd a következő utáni bejegyzésben a pluginokról is lesz szó), kiválasztottad a megfelelő arculatot (még majd erről is írok) és elkezdtél blogolni. Igen ám - de marketingesként jönnek sorra az igények. Például a blogod ne a blogbejegyzésekkel nyisson, hanem mondjuk egy sales szöveggel.

Márketingesként pedig jogosan várnád el: ha sales szöveget löksz a piacnak, ott nem kellene az oldalsáv linkjeit mutogatni, hiszen elbámészkodnak az olvasóid, elnavigálnak mielőtt végig vezetnéd őket az “értékesítési folyamton”. Sőt akár a felső menüsor is mehet a kukába.

Ez megoldható egyrészt úgy, hogy a blog arculatára elkészítesz egy szimpla html vagy php oldalt, és a blogod a tárhelyed egy /blog mappájába telepíted. Ez rögtönzött megoldás, és ha később meggondolnád magad, elég nehéz lenne visszaállítani úgy a rendszert, hogy újra a blogbejegyzésekkel nyisson.

Sokkal elfogadhatóbbb (a három ‘b’ direkt van, csak nyomatékosítok) módszer is akad a probléma megoldására. Ez pedig az egyedi oldalsablon készítése.

A lényege: létrehozol egy egyedi sablont, amit aztán az oldalak elkészítésekor hozzárendelhetsz az oldalaidhoz - onnantól kezdve az oldalon csak azok az elemek lesznek, amiket engedélyezel rá. Végül is te vagy a blog ura, nem pedig a blog szabja meg, hogy mit tehetsz és mit nem.

A következőket kell tenned:

Duplikálás

A telepített template mappádban keress egy page.php nevû fájlt. Ezt kell egy szerkesztővel (Notepad++) megnyitnod, majd elmentened más néven. Most a példában csak az oldalsávot tüntetem el a sablonból, ezért én page-nosidebar.php néven mentem el.

Figyelj oda - ne csak egyszerûen a mentést válaszd, hanem a Mentés másként… menüpontot használd!

mentés másképp

A mentéssel ugyanis az eredeti page.php-t írnád felül, azt módosítanád. Ezt elkerülhetjük, ha rögtön az elején, még mielőtt bármit módosítanánk a forráskódon, elmentjük úgy, hogy másik nevet adunk neki.

Az új sablon módosítása

Az elmentett page-nosidebar.php hasonlóan kell kinézzen:

page-nosidebar.php
  1. <?php get_header(); ?>
  2. <div id=“main”>
  3. <div id=“content”>
  4. <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
  5. <div class=“post” id=“post-<?php the_ID(); ?>”>
  6. <div class=“entry”>
  7. <?php the_content(’<p class=“serif”>Read the rest of this page &raquo;</p>’); ?>
  8. <?php link_pages(’<p><strong>Pages:</strong> ‘, ‘</p>’, ‘number’); ?>
  9. </div>
  10. </div>
  11.      
  12. <?php endwhile; endif; ?>
  13. <?php edit_post_link(‘Edit this entry.’, ‘<p>’, ‘</p>’); ?>
  14.      
  15. </div>
  16. <?php include (TEMPLATEPATH . ‘/page-sidebar.php’); ?>
  17.      
  18. </div>
  19. <?php get_footer(); ?>

A lényeg a 14. sorban van (ennél a mintánál legalábbis, te is keresd meg ezt a sorodat)! Ez a sor behívja (include) az oldalsávot az oldaladra.

Na ezt a sort kell töröld, és nem lesz az ilyen sablont alkalmazó oldalaknak oldalsávja.

Még egy fontos dolog - a teljes kód elé be kell szúrj még néhány sort:

page-nosidebar.php
  1. &lt?php
  2. /*
  3. Template Name: page-nosidebar
  4. */
  5. ?>
  6. ... itt már folytatódik az eredeti kód ...

Ezzel azonban még nem vagy kész - ugyanis a tartalom ettől függetlenül az eredeti keskeny oszlopban fog megjelenni. Ezt ki is próbáljuk, mielőtt bármit módosítanánk még.

Előteszt

Igaz, hogy még nem tökéletes, de már készíthetünk az új sablonunkkal oldalakat. Nézzük, hogyan!

Hozhatsz létre új oldalt, vagy szerkeszthetsz egy már meglévőt - mindegy. Az oldal szerkesztésénél a Tulajdonságok dobozban (jobb oldalt) kiválaszthatod a most létrehozott sablonodat:

oldal tulajdonságai - sablon kiválasztása

A mentés után azonban nem igazán az a kép fogad, amire vágytunk:

minta   

Pirossal jelöltem azt az üres területet, ami az oldalsáv helyén még ott maradt. Ez nem igazán elegáns - az igazi az lenne, ha a tartalom kitöltené a rendelkezésre álló teljes szélességet.

Na ezért kellene egy kis CSS kódolást is tanulnod!

A következő részben bemutatom a CSS bügykölésnek azt a részét, amivel ez a probléma megoldható - ez azonban sablonfüggő, hiszen minden sablon más-más elemeket használhat az arculat kialakításához, de ennél a résznél jó esetben csak az elnevezések lesznek különbözők.


Balogh Attila

Attila blogger, trainer és WordPress fanatikus.

Tetszett a bejegyzés? Ne maradj le a frissítésekről sem!
Iratkozz fel a blog hírlevélre vagy az RSS értesítőre!

Oszd meg, mentsd el! - TurboBookmark.com

Címkék: balogh attila, wordpress, wordpress sablon, csináld magad

A bejegyzés trackback címe:

Trackback:

Még nincs...

11 Hozzászólás

Anikó
2009.07.08. 14:47

Köszönöm Attila!
Az ilyen okosságok nagyon hasznosak.
Újabb kipróbálni valóval gazdagodott a gyűjtemény:)


Attila
2009.07.08. 19:04

Hát - nincs mit - de azért még várd ki a II. részt is!


Jaj!
2009.07.08. 23:54

Kedves blogger, trainer és WordPress fanatikus!
Sztem nem a legjobb ötlet rögtön sablon módosításnak nekiesni.
Amit akarsz a WordPress-ben egyszerűen be lehet magában is állítani:
Settings, Reading, Front Page displays-nél egy egyszerű statikus oldalt ki lehet választani.
Minek ezt bonyolítani?


Vida Ági
2009.07.09. 06:01

@Jaj!, a statikus oldalban bennevan az oldalsáv, ha a sablonban bennevan (és a legtöbb sablonban a bejegyzés és a page és tartalmazza az oldalsávot, Attila viszont arról írt, mi a teendő, ha egyáltalán nem akarsz oldalsávot egy oldalra.


Attila
2009.07.09. 09:10

Jaj! Először is köszönöm a hozzászólásodat!
Távol álljon tőlem, hogy bonyolítsam bárki életét. Nem bonyolítás ez, hanem egy-egy speciális lehetőség bemutatása. Akinek erre van szüksége, az ezt használja - akinek elég a statikus oldal beállítás kezdőoldalként, az pedig azt a lehetőséget.
Itt azonban nem csupán a kezdőlapokról van szó.
Bármilyen statikus oldaladhoz rendelhetsz bármilyen oldalsablont - itt a feladatban csak egyet készítünk, amelyiknek nincs oldalsávja. De ezek alapján készíthetsz akár egyedi oldalsávot tartalmazó sablont pl. az archive vagy a contact oldalaidhoz, vagy bármihez. A célom az, hogy lehetőségeidnek csak a képzeleted szabjon határokat, ne maga a rendszer….


Nagy Eszter
2009.07.09. 10:10

Ez remek, Attila! Köszönöm és türelemtlenül várom a folytatást.


Viski Róbert
2009.07.09. 11:05

Nem ismerem a WordPress-t, én más CMS rendszert használok, ahol lehetőség van arra, hogy bizonyos modulokat, menüket, illetve bármit, ami nem az oldal tartalmi részét képezi (egyébként ha arra van szükség, akkor azt is) ki és bekapcsolhatom egy - egy oldalnál, menünél.
Ha erre a menüre klikkelek akkor ez és ez jelenik meg a tartalmi részen kívül ésígytovább…
A WordPress-nél nincs ilyen lehetőség?
Tervezem, hogy komolyabban foglalkozom a WordPress-el, és ez mondjuk egy olyan beállítási lehetőség, ami eldönti a tervezés komolyságát.

Előre köszönöm a választ.


Attila
2009.07.10. 08:56

@Róbert - a WordPress nem igazán CMS, illetve nem tartozik a nagy CMS-ek kategóriájába. Egy szerű blogmotorról van szó, a blogírásra termett, semmi mást nem készítettek hozzá csak annyit, amennyivel a lehető legegyszerűbben lehet blogot készíteni.
Ha CMS funkciókkal szeretnénk ellátni, akkor azt így, ügyeskedve tehetjük csak meg - !illetve! fizetünk olyan theme-ért, amibe bele vannak szerkesztve ezek a funkciók.
Épp most telepítek egy barátomnak ilyet - nagyon dirva, majd ha mindent megtudtam róla, beszámolok.


Viski Róbert
2009.07.10. 09:39

Köszönöm Attila, egy kalappal mindenhez! :)


Attila
2009.07.12. 18:15

@Róbert - ezt miért írtad? Mihez kellene egy kalappal?


Tihamer Szilard
2010.02.24. 16:39

Kössz ez nagyon szuper , ha gondolod latogas el a weboldalamra nálam is találhatsz egy pár cucot kosszi.


Jegyezd meg az adataim
Kérek e-mail értesítést a válaszokról