13 példa a Diival közösen épített étrend- és táplálkozási webhelyekre

A diéta és a táplálkozás fontos az egészséges élethez, és az internet rengeteg információval rendelkezik a témáról. Ez azt jelenti, hogy rengeteg webhely inspirációt szerezhet a következő diéta és táplálkozási Divi projekthez. Ebben a cikkben 13 példát mutatunk be a Divi-vel közösen létrehozott étrend- és táplálkozási weboldalakról, amelyek elősegítik a Divi-tervezők fantáziájának felkeltését.

Függetlenül attól, hogy az ügyfelének meg kell-e vitatnia a diétákat és recepteket, ki kell mutatnia olyan termékeket, mint az egészségkiegészítők és a vitaminok, vagy akár coachingot, tanfolyamokat és workshopokat kell szerveznie, ezek a webhelyek inspirálhatják a következő tervét. A weboldalak nincsenek különösebb sorrendben.

1. Lynn K Wagner

Lynn K Wagner teljes képernyős hátteret jelenít meg cselekvésre ösztönzéssel (CTA) és átlátszó függőleges menüvel. A görgetés átlátszó hírlevélre való feliratkozást mutat a parallaxisban, egy CTA-t parallaxisban, három oszlopot a két színű szakaszról, egy ajánlásokról szóló részt és blogbejegyzéseket. A kb szakasz úgy néz ki, mintha egy jól megtervezett magazinoldalról származna. Az ajánlások szakasz képeket használ, és az ajánlást fedőfedésként jeleníti meg. A blog szakasz tartalmazza a blog képét egy kivonattal, külön fedvényben. A különféle oldalak között galéria, parallaxis és CTA található.

2. Eredmények Food Coaching

Eredmények Az Food Coaching teljes képernyős átfedést tartalmaz a parallaxisban a CTA-val. A görgetés három oszlopban egy körülbelül részt tartalmaz, és elegáns információs részt tartalmaz a CTA-val, az ajánlásokkal, a Hogyan működik részleggel, márkás színekkel ellátott elmosásokkal, egy kapcsolatfelvételi űrlappal, valamint egy láblappal az eredmények és az erőforrások linkjeivel. Néhány teljes képernyős kép ide-oda dobódik. Az e-mail CTA a képernyő alján marad, és elvethető, ha az olvasó úgy dönt. A webhely nagyszerűen használja az ikonokat, a színeket és a képeket.

3. Glamour Hippie

A Glamour Hippie teljes szélességű képet használ, egyszerű márkás színekkel ellátott menüvel. A görgetés feltárja a legújabb blogbejegyzéseket egy rácsban, amely több funkcióval rendelkezik. Ez alatt teljes szélességű e-mail feliratkozás, márkás színekkel. Az utolsó szakasz a beágyazott Instagram-hírcsatornákat jeleníti meg egy további funkcióval és egy követés gombbal. Ez a webhely nagyszerű munkát végez márkás színekkel, fotózással, valamint blogbejegyzések és közösségi hírcsatornák bemutatásával.

4. Neo Suplemen

A Neo Suplemen tartalmaz egy teljes képernyős csúszkát, amelyet a WooCommerce által üzemeltetett terméklisták követnek. Az értékesítési statisztikák parallaxissal jelennek meg, egy másik részben a csapattagok láthatók, majd egy szakasz a telefonszámmal és a címkével. A lábléc megjeleníti az elérhetőségi információkat, a kb és a menü widgetekkel együtt. Az oldal kiválóan felhasználja a színt és a termékelhelyezést.

5. Trivert táplálkozás

A Trivert Nutrition egy teljes képernyős csúszkát tartalmaz, amelyet a terméklisták követnek. Ahelyett, hogy bolti modult használnának a WooCommerce termékekkel, a termékek képekkel és harmonikákkal jelennek meg a részletes információkért, a WooCommerce pedig a vásárlási gomb hozzáadásához szolgál a listán. A Termékek oldal egyszerűen felsorolja a termék előnyeit. Az oldal egyszerű és hatékony, a termékre összpontosítva.

6. Az élet gyökere

A Life of Life teljes képernyős háttérrel rendelkezik a parallaxisban a CTA-val. A következő egy termékcsúszka, amely a következő terméket mutatja az egérrel a nyílgombon belül, és a termékeket indexképként jeleníti meg közvetlenül a csúszka alatt. Egy üzlet modul a WooCommerce termékeket jeleníti meg az üzlet linkjével. A blogbejegyzések egy blog csúszkával jelennek meg. A lábléc megjeleníti a regisztrációs űrlapot és a menü linkeket. A Cikkek oldal a tetején megjeleníti a kategóriákat, és hivatkozásokat mutat a különféle cikkekre. Az oldal tiszta és egyszerű kialakítású.

7. Természetes vitalitás

A Natural Vitality tartalmaz egy teljes képernyős bejegyzés csúszkát és egy érdekes füles menü linket a felső menü számára, amely az olvasót egy testvéroldalra viszi. A görgetés több oldalra mutató linkeket tartalmazó képeket jelenít meg, majd egy öt oszlopos lábléc linkekkel és hírlevél feliratkozási űrlappal. A különféle termékoldalak görgetve tartják a terméket a képernyő egyik oldalán. A Természetes völgyi termékek keresése oldal az EasyLocator segítségével ágyazza be a boltkereső funkciót. Az üzlet üzemeltetője a WooCommerce. A CTA továbbra is a képernyőn marad, és elutasítható, ha az olvasó kívánja. Az oldal nagyszerűen használja a termék parallaxist és a CTA-t.

8. Veszítse el a testzsírt

A Lose the Body Fat az egyetlen webhely ezen a listán, amelyet blogként állítottak be a kezdőlap számára. Tartalmaz egy teljes képernyős képet, rajzfilmfigurával és tagline fedéssel. A görgetés a blogbejegyzéseket két oszlopban, oldalsávval jeleníti meg. A különféle oldalak a fogyókúrával kapcsolatos alapvető információkra hívják fel a figyelmet. A Fogyás oldalon a kategória egyetlen oszlopban szerepel. A webhely tiszta, anélkül, hogy elvonná a figyelmet a tartalomról.

9. Fogyjon fogyókúra nélkül

Fogyás diéta nélkül teljes képernyős képet használ CTA-val, átlátszó menüvel és lebegő tanúvallomások gombbal. A görgetés során megjelenik egy körülbelül szakasz, egy két oszlopos szakasz, amely információkat és ajánlásokat tartalmaz, egy elegáns blog rész, egy kapcsolatfelvételi űrlap és egy lábléc, amely elérhetőségi és közösségi követési linkeket tartalmaz. A blog rész tartalmaz egy hátteret és két bejegyzést márkás színekkel és betűtípusokkal. Több szakasz között vannak kisebb részek, motivációs állításokkal. A Fogyókúra nélkül fogyás oldal elválasztókat hoz létre elegáns, pultos szakaszokkal.

10. Teljesen új élet

A Whole New Life-nak van egy nagy szakasza, amelynek fejléceként tagline található, teljes szélességű rész kép- és kapcsolattartási adatokkal, CTA, ajánlás, kör alakú képek oldalakra mutató linkekkel, hírlevél űrlap és a legutóbbi, teljes szélességű bejegyzések listája . A Receptek oldalon megjelennek a kategóriák, képekkel és szöveges linkekkel az egyes bejegyzésekhez. A fizetés a WooCommerce segítségével történik. Az oldal nagyszerűen használja a márkás színeket.

11. Nyerje meg a diétaháborút

A Win the Diet War tartalmaz egy teljes képernyős képet CTA-val, egy körülbelül részt ajánlásokkal, egy körülbelül részt CTA-val, egy részt három különböző színű szöveges modullal CTA-val, egy részt kiemelt média logókkal és láblécet widgetekkel a bejegyzések megjelenítéséhez és elérhetőségei. A WooCommerce tanfolyamok és könyvek megjelenítésére szolgál elegánsan kialakított üzletoldalakon. A podcastok be vannak ágyazva a blogbejegyzésekbe. Az oldal nagyszerűen használja a színeket és az elrendezést.

12. Ayesha Curry

Az Ayesha Curry tartalmaz egy nagy fejlécet és logót, amelyet egy dupla oszlopos rész követ, amely egy képet, CTA-t és egy háromoldalas fotógalériát tartalmaz, amely egyszerre két képet jelenít meg. A CTA szakasz három mezőt tartalmaz szöveges linkekkel. A következő szakasz tartalmaz egy képet, amely linket mutat az Food Network műsorára. Ezt követi egy blogrács lebegő effektusokkal és egy szakasz a Szentírással a Bible Gateway elegáns szkriptjében. A Megtekintés oldalon egy videogaléria jelenik meg. A különféle oldalak három oszlopban jelenítik meg a tartalmat. A WooCommerce működteti a weboldalt. Az oldal nagyszerűen használja a színeket és az elrendezést.

13. Táplálkozási Kutató Intézet

Észak-Karolinai Egyetem Táplálkozástudományi Kutató Intézete, és magazintervezéssel rendelkezik. A kezdőlap tartalmaz egy bejegyzés csúszkát, CTA-t, egy ismertető részt blurbokkal és harmonikákkal, egy oldalsávot a legfrissebb bejegyzéssel és CTA-val, valamint egy láblécet elérhetőségi adatokkal. Az Idővonal oldalon beágyazott idővonal jelenik meg. A menetrendek, a foglalkoztatás és egyéb információk harmonikával jelennek meg. A WooCommerce adományok fogadására szolgál. A blogbejegyzések a Hírek kategóriába kerülnek, és dupla oszlopos eltolásos formátumban jelennek meg, további funkciókkal. Ez egy nagy webhely, de rendszerezett és könnyen kezelhető, és nagyszerűen használja a színeket.

Végső gondolatok

Ez a 13 példa a Divivel épített étrend- és táplálkozási webhelyekre megmutatja, hogy a Divi felhasználásával érdekes dizájnok készíthetők bármilyen étrend- és táplálkozási webhelyhez, legyen szó receptekről és cikkekről, online üzletről vagy tanfolyamokkal és műhelyekkel rendelkező webhelyről.

Ezek a webhelyek kiválóan szolgálnak ötletekkel elrendezésekhez, színekhez, fényképezéshez, videókhoz, podcastokhoz, navigációhoz és egyebekhez. Ezek a weboldalak biztosan inspirálják Önt a következő diétára és táplálkozási tervezésre a Divivel.

Melyek a kedvenc elemei ennek a Divi étrendnek és táplálkozásnak oldalak? Tudassa velünk az alábbi megjegyzésekben!

Kiemelt kép a Visual Generation/shutterstock.com webhelyen keresztül

Írta: Randy A. Brown

Randy A. Brown a TN keleti részén dolgozó szabadúszó író, szakterülete a WordPress és az e-kereskedelem. Régi WordPress-rajongó, imád új dolgokat tanulni és információkat megosztani másokkal. Ha nem ír vagy olvas, valószínűleg gitározik.

Fedezze fel Divi-t, a világ legnépszerűbb WordPress-témáját és az Ultimate Page Builder-t

Nézze meg ezeket a kapcsolódó bejegyzéseket

Színes és színátmenetes fedvények hozzáadása a Divi parallaxis és videó háttérhez

Feladta 2020. december 7-én, Randy A. Brown a Divi Resources-ban

Kiemelt bővítmény eladó most a Divi piactéren A Divi Background Plus elérhető a Divi piactéren! Ez azt jelenti, hogy átesett felülvizsgálatunkon, és megállapították, hogy megfelel minőségi előírásainknak. Meglátogathatja a Superfly-t a piacon, és megtekintheti az összes elérhető terméket. Vásárolt termékek.

Töltsön le egy ingyenes fejlécet és láblécet a Divi's Realtor Layout Packhez

Feladta Donjete Vuniqi 2020. december 6-án a Divi Resources-ban

Hé Divi Nemzet! Köszönjük, hogy csatlakozott hozzánk a heti Divi Design Initiative következő részéhez, ahol minden héten vadonatúj ingyenes ajándékokat adunk. Nemrégiben egy vadonatúj ingatlanügynök-elrendezési csomagot osztottunk meg. Annak érdekében, hogy webhelye a lehető leghamarabb működésbe léphessen, megosztjuk a globális tartalmat.

Szerezze be az exkluzív, ingyenes Cyber Monday WooCommerce termékoldal elrendezési csomagot

Feladta 2020. december 5-én Donjete Vuniqi a Divi Resources-ban

Csak rövid ideig érhető el a kiberhétfő. Kihagyta a fekete pénteki akciónkat? Ne aggódj! Fekete pénteki nyereményeink és exkluzív csomagjaink eltűnhetnek, de a Cyber Monday akciónkkal egy teljesen új nyereménykészlet és exkluzív piactéri csomagok érkeznek, tehát ez azt jelenti.