Az új kedvenc: a drag&drop sablonok, avagy tapasztalataink a Page Builderrel

Egyre népszerűbbek a weboldalak felépítésében az úgynevezett drag&drop sablonok. Ezek azok a sablonok, amelyek használatakor az alapértelmezett WordPress szerkesztőfelületen kívül egy kiegészítő eszköz is a rendelkezésedre áll a tartalmaid elrendezéséhez: a Page Builder.

A mi kedvencünk ezek közül az ElegantThemes gyártotta univerzális sablon, a Divi.

Drag&Drop Page Builder funkciót a bejegyzésszerkesztőben a Use Page Builder gombbal tudod aktiválni. Akár oldalanként is más és más lehet a megjelenés. Néhány oldaladat, például a bejegyzések (cikkek) oldalait érdemes meghagyni a hagyományos felépítésben, fejléccel, menüsorral, oldalsávval, widgetekkel, de a főoldalt, a termékedet bemutató oldaladat vagy egy értékesítési / érkezési oldalt (azaz sales oldalt vagy landing page-et) elkészíthetsz ezzel az egyedi oldalépítővel, egészen különlegesre és látványosra.

A Page Builderben sávonként állíthatsz be mindent. Ezeket a sávokat a rendszer section-nek hívja. Mindegyiknek a hátterét egyenként tudod beállítani, így akár minden egyes section más színű vagy más háttérképű lehet.

Minden section-ben be kell állítanod a rendelkezésedre álló terület függőleges felosztását, azaz meg kell határoznod az oszlopokat (Insert Columns). 1/2 – 1/2 vagy 1/3 – 2/3 vagy 1/3 – 1/3 – 1/3 és így tovább – rengeteg lehetőség közül választhatsz.

A következő lépés, hogy az oszlopon belül elhelyezed a kívánt modult (Insert Module). Ez lehet kép, szöveg, diavetítés, térkép, audio fájl, bejelentkeztető felület és még sok minden más.

Miután kiválasztottad a modul típusát, akkor már egy megszokott WordPress-es szerkesztőfelülethez jutsz, illetve nagyon egyértelműen mondja az utasításokat, hogy mit tegyél.

FONTOS: minden egyes modult nevezz el! Így nem kell majd később azzal sok időt eltölts, hogy rájöjj, hogy a weboldal egy adott helye melyik modulban is lehet. Ezt megteheted minden egyes modulnál az Admin Label mező kitöltésével. Itt eredetileg a modul típusának a neve áll, pl Text, de ehelyett érdemes beleírni például egy hosszabb szöveg első mondatát, akár rövidítve, vagy a kép, audio fájl nevét. A lényeg, hogy később ránézésre tudd, hogy melyik modul melyik részhez tartozik. Így könnyedén tudsz később is változtatni rajta.

Az ilyen felépítésű sablonok, így a Divi is, előszeretettel használják a Parallax effektet, azaz azt, hogy a section háttérképek előtt lehet görgetni a tartalmat, az illusztációként használt képek pedig látványos animációval úszhatnak be a lapra. Elérhető ezen kívül néhány szintén nagyon látványos számláló is és egyéb kisebb okosságok. Ezeket az effekteket a Modul settings-ben tudod beállítani. Az Animation mezőben tudod kiválasztani a beúszás irányát, módját, illetve ki is kapcsolhatod, ha nem szeretnéd, hogy ennyire dinamikus legyen az oldalad.

Ne maradj le semmiről, iratkozz fel hírlevelünkre!

Katt a képre részletekért

Javasolt eszközök:

Banner250x250.png
Elementor Pro
Wpsuli Sybell
Sybell tárhely szolgáltatás
Adatvedelem.png
ADATVÉDELEM minta
Divihello
Prémium támogatás és ajándék Divi licence

Oszd meg te is!

A wpSuli alapja egymás támogatása. Lehet egyik ismerősöd pont most szeretne saját honlapot építeni, de kell neki egy segítő kéz…legyél Te ez a támogatás egy megosztással!

Megosztás itt: facebook
Facebook
Megosztás itt: twitter
Twitter
Megosztás itt: email
Email