How To Structure Your Landing Page Data in Strapi | Step-by-Step Tutorial

Опубликовано: 26 Октябрь 2024
на канале: Strapi
7,981
129

How To Structure Your Landing Page Data in Strapi | Step-by-Step Tutorial

In this video, Brayden Gerard demonstrates how to create a landing page using Strapi, a headless CMS.

He discusses how to use Single Types in Strapi using a mix of Components and Dynamic Zones. We go through replicating a page on the Strapi website inside of the Strapi admin. You will learn how to build components and dynamic pages in the Strapi admin.

Key topics summary:
Creating a landing page using Strapi
Using the content type builder to create a single type
Building components for the page, such as headers, titles, call to actions, articles, and info cards
Creating a dynamic zone for flexible customization by content editors

-----------------------------------------------------------------------------------------------------------------------
Chapters
------------------------------------------------------------------------------------------------------------------------
0:00 - Intro
0:34 - Creating the header component
1:15 - Creating the title component
1:43 - Creating CTA button components
3:55 - Creating a list of article card components
5:18 - Creating an info card component
7:44 - Creating the single type page using a dynamic zone
9:07 - Building a page in the content editor
12:39 - Wrap up

-----------------------------------------------------------------------------------------------------------------------
Resources
------------------------------------------------------------------------------------------------------------------------
Docs: https://docs.strapi.io/dev-docs
Strapi Events: https://strp.cc/events
Find help on Discord: https://strp.cc/discord-events
Find help in our Forum: https://strp.cc/40EvYp0

------------------------------------------------------------------------------------------------------------------------
Strapi
------------------------------------------------------------------------------------------------------------------------
Get started with Strapi: https://strapi.io
Strapi Cloud: https://strapi.io/cloud
Try the live demo: https://strapi.io/demo
Strapi Blog: https://strapi.io/blog
Strapi Starter Project: https://github.com/strapi/nextjs-corp...
Learn more with Brayden Girard -    / braydengirard