WordPress sablon felépítéseAz alábbi hozzászólásra – amiből végül a szerző engedélyével ez a bejegyzés született – a WordPress Magyarország Fórumán bukkantam rá a mai napon.

– Ez az – sikoltottam fel magamban – Ilyen írásokra van szüksége a kezdő WordPress-eseknek. Írtam Andrásnak egy privát üzenetet, hogy engedélyt kérjek a szerkesztett bejegyzés írására a nevében. Mire megittam a kisfröccsömet, már itt is volt a kedvező válasza… [FYGureout]

Olyan oldalt, mint pl. a wordpress2you.com :), egyszerű készíteni a WordPress alatt, abban az esetben, ha tudsz egy kicsit a HTML + CSS-ben tevékenykedni (alapok).
Ugyanis, abban lehet kialakítani a layout-ot, azaz az elrendezést, vagyis azt, hogy milyenek legyen a főoldal, az oldal, a bejegyzés, stb.

Elmondom, én hogyan szoktam:

1. Elkészítem statikusan, oldaltartalommal, a főoldalt, a bejegyzések listázását stb. Feltöltök próbaképeket és bla-bla szövegeket.

Ha ez megvan, onnantól kezdve már csak fel kell darabolni a statikus HTML sablonokat, és át kell alakítani a WordPress számára, és be kell illeszteni a WordPress kész függvényeit a LOOP segítségével (the_loop).

Kell tehát:

style.css -> stílusfájl
image könyvtár -> a design kép elemeknek

Funkciók:

Functions.php -> Itt lehet egyedi funkciókat és beállításokat készíteni, megadni.

Egy WordPress sablon fájljai:

 header.php minden oldalnak ez lesz a fejrésze
 index.php ez nagyon fontos fájl, mert ha véletlenül valamelyik sablon fájl nem lenne meg, vagy sérült, akkor ez hívódik be
 page.php oldalak mintasablonja, oldal típusú oldal megjelenítéséért felelős
 single.php az adott bejegyzést jeleníti meg
 category.php adott kategóriák listázása, adott kategória bejegyzéseit listázza, rövid kivonattal, képpel, stb.
 tag.php hasonló a category.php-hoz, csak ez egy címkéhez tartozó bejegyzéseket listázza
 sidebar.php oldalsáv tartalmat jeleníti meg, általában itt helyezzük el a widgeteket
 footer.php a lábrész tartalmat jelenítjük meg vele, hasonló, mint a header.php

 Például egy bejegyzés megjelenítéséért felelős sablon így fest – single.php:

—————–single.php—————————-
– get_header() -> behívja a header.php-t
– THE LOOP -> tartalom kinyomása (pl.: rövid kivonat, dátum, kategóriák listája, címkék, kiemelt kép stb)
– get_sidebar() -> sidebar.php-t hívja be ide
– get_footer() -> footer.php-t hívja be
———————————————————-

Tehát a single.php összefogja a sabolnt! Ilyen a page.php, és az index.php, és a tag.php is! Általában a THE LOOP része az, ami különbözni szokott.

Azt, hogy hová kerüljenek a kis képek, rövid kivonatok stb, az a LOOP on belül lehet szabályozni a <the_time(), the_content(), the_category() stb. függvényekkel )

Mert lehet, hogy egy oldal típusú oldalnál nem kell a dátum, meg ugye egy oldal nem tartozik kategóriába, így a loop-on belül azokat nem kell meghívni.

Nagyjából ez az alapja a WordPress sablon gyártásának. Szerintem ezt csak úgy lehet megérteni/megtanulni, ha kipróbáljuk a gyakorlatban.

A  menüpontok lehetnek akár sima kategóriák is, azt a menü kezelőjében fel lehet venni, bármilyen kategóriát….

Az én véleményem az, ha megy a HTML és a CSS, és megértjük a WordPress sablon szerkezetét, működését, akkor a nulláról egyszerűbb feladat készíteni egy sablont, mint akár egy meglévőt átalakítani.

Azt nem tudom, minek írtam ennyit, mert úgysem érdekel ez senkit sem, úgyhogy be is fejeztem. 🙂

A szerzőről

Lorincz-Andras

Lorincz-Andras

  • calvez

    jogos, tényleg jobban jársz, ha nulláról kezded, bár én pl. pártolom, hogy egy jó framework-öt érdemes megtanulni. Amit én most nagyra tartok és ajánlok, az
    1. _s a wordpress készítőitől,
    2. reveire, ami a zurb elképesztő responsive layoutját használja, és persze a nagyszerű
    3. skeleton css. pl skeleton gridhez _s framework.

  • Azt nem tudom miért írtál ennyit, de az, hogy senkit se érdekeljen, abban nem hiszek! 🙂 Nagyon is sok ember szeretné használni a WordPress-t, de kitartás és az első sikerélmények nélkül nehéz. Én 6 éve WP-zek, nekem is sokat segítettek a fiúk (András és György) az elején. Abban viszont egyetértek Calvezzel, hogy egy jó framework és egy css grid system mindenképp kell, főleg manapság.

    Én most fejeztem be egy közel fél éves melót, pár napja indítottuk el az új oldalt (iPhoneHungary.hu) és be kell valljam sokat segített a keretrendszer. Nyilván ami nem kellett azt kidobtam a kukába és alapjaiban írtam újra, de jó végre látni a Retinás reszponzív képet az iPad 3-as kijelzőn! De még most is van vele bőven dolog. Szóval aki WP-zne, annak kitartást és sok türelmet kívánok!

    • Kedves KeleMan!
      Megkuksiztam az említett oldalt, igényes, hozzáértő munkáról árulkodik, kivétel az oldalnavigáció – javaslatom: Presenting the WCS Page Navigator
      Tudom, hogy “hívatlan prókátornak ajtó mögött a helye”, de ezt meg kellett említenem.
      Üdvözlettel: webress

  • calvez

    http://iphonehungary.hu/

    http://themeforest.net/item/backstreet-blog-magazine-theme/full_screen_preview/1680564

    ha 0ról kell felhúzni egy ilyen oldalt, az elég sok idő és drága is. ráadásul nem éri meg, ha themeforestről veszel egyet 35-40 dollárért ami tökéletes kis alakítással.
    Amire viszont nagyon nyomatékosan akarok célozni, hogy ha meg akarod tanulni a wordpresst, és komolyan dolgozni vele, muszáj php-t is tanulnod legalább alapszinten, különben mindig azt kell hazudnod a megrendelőnek, hogy “aztat nem lehet”.

    ha meg akarod tanulni, nézz meg egy _s témát boncold szét, hogyan működik, mi mit hív meg, hogy épül fel a functions.php, a loop. A twentyeleven komoly téma, ne azzal kezd.
    elkezded átalakítani, és észreveszed, hogy gyorsabb, ha használsz egy css frameworkot, mondjuk a foundationt a zurbtól, a skeleton talán túl nehéz. A zengrid pedig már beteges… de komolyan.

    css frameworkkel gyorsan tudod módosítani a layoutot, style.css-ben megjelenést.

    ezután kellene valami élet bele, jqueryvel:
    http://scribu.net/wordpress/optimal-script-loading.html

    funciók is persze, amire van sok plugin. nagyon érdemes megnézni, mire érdemes plugint használni és mit érdemes beletenni magába a témába. Én arra szavazok, hogy az alap dolgokat, lightbox, shortcode-ok, stb a témába kell építeni, nem érdemes külön plugin.

    ha pl jquery isotope-ot akarsz használni, ami most nagyon vagány, azt tényleg érdemes a témába tenni, ha kell írok egy rövid tutorialt róla hogyan.

    ezután megtanulni hogyan lehet custom post type-ot létrehozni, taxonómiával és metaboxokat használni hozzá.

    nagyon-nagyon fontos, talán a legelején kellene megtanulni, hogy hogyan rendszerezd a kódot, erre pl a fenti backstreet téma jó példa, hogyan könyvtárazza, kommenteli, szerkeszti.

    ha ezeket begyakorlod, nincs lehetetlen.

  • WordPress Mania

    Szerintem teljesen fölösleges ilyenekért megtanulni php -t programozni, mert vannak olyan programok, amikkel php ismeretek nélkül lehet készíteni sablont, pl: http://artisteer.com/ .

    • Kedves WordPress Mania!
      Valamit félre érthettél, “fölösleges ilyenekért megtanulni php -t programozni” – a PHP-t nem valamiért, hanem önmagáért tanuljuk.
      Bocsi, hogy “szóltam”…
      Üdv.: webress

  • A téma úgy jó, ahogy van, csak gratulálni tudok!
    Viszont egy picinyke elírás kiverte a szemem:
    “image könyvátrár -> a design kép elemeknek”
    könyvátrár=könyvtár
    Köszönettel: webress

    • Kedves webress!

      Valóban, görög volt a falóban. 🙂

      Köszönöm szépen, javítottam.

Yes No