Creating a New Page Template

1. Set Up ACF Fields in WordPress

• Location: WP-Admin > Custom Fields > Add New Field Group

• Define fields as per the page design, ensuring types align with content (e.g., text, images).

• Set location rules to specify where these fields will appear.

2. Create the Page and Assign Template

• Go to WP-Admin > Pages > Add New.

• Assign the relevant template in the "Page Attributes" section.

3. Code the Template

• Create a New Branch

• Add a .php file in the WordPress theme folder.

• Create a folder in nextjs/src/components/pages/ matching the page name.

• Add a .tsx file for the page React component and a .graphql file for queries.

4. Configure Layout and Data

• Use the .tsx file to set up the page layout and structure.

• Map GraphQL data to match ACF fields.

5. Register the Template

• Add an entry in template-map.ts to link the WordPress template with the Next.js component.

6. Write the GraphQL Query

• Use the .graphql file to define a query that fetches the ACF data for the page.