Így a honlap a WordPress-webhely hasonló a fedelet a magazin, minden a wordpress
Sok magazin WordPress téma generál honlap, ami általában jelenik meg számos különböző tartalmat.
De mi van, ha azt akarjuk, hogy a honlap a magazin, ami hasonlít, mondjuk, ez a magazin?
Ebben a cikkben bemutatjuk, hogyan lehet létrehozni egy honlapon a lapban stílusban, hogy működni fog az összes eszköz. Mindannyian ismerjük a folyóiratok dekoráció: egy nagy háttérkép, kiegészítve gondosan fejezetei különböző méretekben.
Annak ellenére, hogy ez a megközelítés működik az offline világban, ez a formázás nagyon ritka az online napló, ami nagyon meglepő, különösen mivel a folyamatos növekedés a tabletták használata és kézi eszközök.
Ebben a cikkben megnézzük, hogyan hajtsák végre a fedelet a magazin saját honlapja, ami működni fog az összes platformon.

Megjegyzés: a vizsgálati adatok a cikkben használt biztosította wptest.io.
Ami a saját kezdőlapját címlapháttér
A megoldás alapja a használata plug-in, amely felülírja a sablont használt generálásakor a honlapon, valamint azzal a feltétellel, hogy az összes szálak támogatják a statikus oldal, mint egy mester. A plugin is biztosít shortcode meghatározni fejléceket, és adjunk hozzá tetszőleges CSS-kódot kimenet.
1. lépés: Telepítse a bővítményt.
A beépülő modul elérhető a GitHub. Töltse le a zip-fájlt, és telepíti, mint bármely más plug-in, majd aktiválja azt. Hozzáteszi új érvényesítőkód, header (leírt 2. lépés), és ezzel is template_include szűrő felülírását használt sablon generál a honlapra.
2. lépés: az oldalon.
Meg kell rendelni egy áttekintő az oldal, mert ez a kép lesz, mint a fedelet a háttérben. Ügyeljen arra, hogy kellően nagy kép (a kép, hogy a bemutatott példában a mérete 900 pixel, 1363 pixel) van kiválasztva a fedelet.
Hozzáadni fejléc, akkor a érvényesítőkód [headline], amely azon a következő tulajdonságokkal rendelkezik:
- Típus: adjuk a generált DIV elem, mint egy osztály, megadhatjuk a CSS.
- Id: felvétel azonosító vagy azonosítók listájának, vesszővel elválasztva. H2 elem jön létre minden id, a megfelelő bejegyzést címet és a permalink.
- Kép: meghatározza, hogy a kimenetet a képernyő miniatűr felvételt. Az érték lehet akár igen, akár nem, az alapértelmezett no.
- Szöveg: rekord cím felülírható megadásával az új szöveget. Megadhat egy listát a címek, vesszővel elválasztva, ha szükséges.
Az alábbi HTML-jelölés kerül előállításra:
Adjunk hozzá annyi címet, amennyit csak akar, majd közzéteszi az oldalt.
3. lépés: Válassza ki az új oldal statikus honlap.
Menj a beállítások részben - Reading, és válasszon ki egy statikus oldalt a kimeneti paraméterek a főoldalon. Válassza ki az új oldalt a legördülő listából.
Beállítása után statikus oldal, menj a fő oldalon a webhelyen.

4. lépés: Állítsa be a CSS.
Attól függően, hogy háttér és a hosszú a cím, akkor meg kell változtatni a CSS, hogy kérje az illetékes elhelyezése. Lehet még meg kell változtatni szinte mindent, elejétől a végéig.
Számos módja van, hogy testre a CSS:
- Az egyéni mezők - hozzon létre egy egyéni mező című oldalon custom_css és helyezze a CSS-kódot a értékmezőben (érték). Ha a bővítmény találja az egyéni mező az oldalon, akkor csomagolja az értéket egy stílust tag-et a kódot HTML. Segítségével tetszőleges mező lehetővé teszi, hogy végre a stílusokat az oldalt.
- Szerkesztése style.css - szerkesztheti közvetlenül a CSS-fájlt a plugins tárolóból.
A plug-inek hozzáadását tetszőleges CSS-stílusok nem fog működni, mert a minta minimalista, és nem támogatja a közös akciók és szűrők, mint például wp_head és wp_footer.
A háttérkép hozzáadjuk a cover.php sablont. Ez hozzáadja a szükséges CSS-stílusok a header fájlokat:
Ez az egyszerű technika segít, hogy megbizonyosodjon arról, hogy a kép mindig megjelenik a teljes képernyőn minden platformon:
Mi a változás?
Felülírhatja a CSS nem olyan nehéz. Mint már említettük, mind a fejléceket shortcodes alakítjuk DIV elem az osztály az a típus attribútum, amely tartalmazza h2 minden rekordot.
Hely div egy könnyű feladat - csak használja az abszolút pozicionálás, és állítsa be a megfelelő értékeket a felső, jobb, alsó és bal. A nézet módosításához h2, a CSS-szabály a h2 (mivel a fejléc kapcsolódó link):
Egyedi azonosító CSS - it # webhely címét. Cím webhely automatikusan megkapta és tetején jelenik meg a képernyőn.
Ha megnézzük a style.css fájlt, akkor látni fogja, hogy én megtartottam mindent meglehetősen egyszerű, a%, amennyire csak lehetséges, beleértve a betűméretet. Ez, természetesen, a legegyszerűbb megoldás, de lehetővé teszi, hogy megbizonyosodjon arról, hogy az oldal ugyanúgy néz ki mind az asztali és a tablet, mobil eszközök, stb
Azt is megváltoztathatja a háttérképet minden css. Meg lehet változtatni a képet a kimeneti több eszközt, állítsa azt tájolásának megváltoztatása.
Tedd főoldalon a valós fedezete a magazin!
Tekintettel arra, hogy lehetetlen, hogy dolgozzon ki egy közös stíluslap, amely alkalmas minden helyzetben, és figyelembe véve azt a tényt, hogy a fedél mindig változik ügyről ügyre, nem túl letette a CSS.
Véletlenek vannak, akkor (vagy a tervező) is létrehozhat fejlettebb CSS-kódot, és szabni a sablon magát, cover.php.