When is a Child Layout useful?

Use one when a group of pages should share the same extra structure—for example, article pages with the same breadcrumb, title area, content column, and sidebar.

Can a content page use the Main Layout directly?

Yes. If the Main Layout already gives you the right shared structure, the content page can use it directly.

Can a content page use a Child Layout?

Yes. If the page belongs to a group that shares a Child Layout, choose that Child Layout instead.

How do I choose between Main Layout and Child Layout?

Use the Main Layout when the site-wide structure is enough. Use a Child Layout when the page also needs an extra shared pattern used by similar pages.

Can a content page add new placeholders?

No. A content page should fill the placeholders that already exist in the layout you selected. It should not create new ones.

Can I make new data-nodeid values for a content page?

No. Reuse the existing data-layout and data-nodeid values from the selected layout. New node IDs are only for genuinely new placeholders inside a layout that owns them.

What happens to the Main Layout slots when I create a Child Layout?

Keep them exactly as they are. The Child Layout inherits those slots, then adds its own reusable areas only where needed.

What does data-layout mean?

It tells VIXNODE which layout owns that placeholder. In practice, you should copy the value from the latest layout instead of typing or guessing it yourself.

Should layout pages include html, head, or body tags?

No. Layout-related pages use HTML fragments. Their direct top-level elements should be the valid app-place-holder elements from the layout structure.

Where should page-specific CSS or scripts go?

Put them inside a valid placeholder. Do not place a standalone , , text, or other element beside the top-level placeholders.

Why should I load the latest layout before creating or editing a page?

Because the layout may have changed. Loading the latest version makes sure you use the current placeholders and IDs, so content goes into the right place.

Where should I change a shared header or footer?

Change the Main Layout when you want the update to apply across the site.

What if only a group of pages needs the same new structure?

Use or update a Child Layout for that page group. This keeps the extra structure shared without affecting pages that use only the Main Layout.

Why do I need to preview before applying changes?

The preview lets you check the layout, content, and page structure before anything is applied.

What if the preview does not load correctly or I cannot click Confirm Execution?

Ask ChatGPT to run the preview again. If the confirmation UI still does not work, you can also ask ChatGPT to execute the update and publish it directly. If direct execution still requires confirmation, refresh the ChatGPT page and try again with a newly generated preview.

Will VIXNODE change the page after I confirm the preview?

It should apply the same version you reviewed. The confirmed HTML, IDs, and layout choice should stay the same during execution.

What if ChatGPT gets confused about the page or layout?

Tell ChatGPT which project, page, and layout you are working on, then load the latest page or layout again. You can also download Download instructions (.md) from this guide and upload the file to ChatGPT so it can follow the VIXNODE page and layout rules again. If the conversation becomes messy, starting a new chat and providing the instructions file can help you get back on track.

Build Multi-Page Websites with ChatGPT

Q: Do I always need a Child Layout?

No. If the Main Layout already has everything the page needs, use the Main Layout directly. Add a Child Layout only when several pages need another shared structure.

With ChatGPT and VIXNODE, you can plan, create, and manage a consistent multi-page website in everyday language—without handling the technical structure yourself.

Multi-page website structure built with ChatGPT — A simple workflow for turning one shared website design into a complete set of pages.

Download the VIXNODE page creation instructions

Keep this reference available when asking ChatGPT to create or update layouts and pages in VIXNODE.

Download instructions (.md)

Build a website system, not separate pages

A multi-page website should feel like one connected experience. Its pages need consistent navigation, typography, colors, spacing, buttons, and responsive behavior.

The best starting point is a Main Layout. It defines the elements shared across the website, including the header, navigation, footer, content width, and overall visual language.

Main LayoutThe shared foundation used across the website.

→

Content PagesHome, About, Services, Contact, and other pages use the approved design.

Keep it simple: Many websites only need one Main Layout and a set of content pages. Add a Child Layout only when several related pages need the same additional structure.

Step 1: Describe the whole website

Before creating a page, tell ChatGPT which pages the website needs and which elements should remain consistent. Focus on the content, design, and visitor experience rather than how the website is implemented.

YouI need Home, Services, Work, About, and Contact pages. Every page should share the same navigation, footer, typography, and button styles. Only case studies need a project introduction and related-work section.

ChatGPTI’ll begin with one Main Layout for the website-wide design. The general pages can use it directly. When you are ready to create several case studies, we can add a shared case-study layout.

Step 2: Create the Main Layout

Ask ChatGPT to establish the shared website experience before building individual pages.

Create a responsive Main Layout for my website. Include: - a clear header and navigation - mobile-friendly navigation - consistent content width, typography, and spacing - a shared footer with important links - a flexible visual style for all planned pages Show me a preview before applying it.

When reviewing the preview, check whether the navigation supports every planned page, the design works on desktop and mobile, and the visual system is flexible enough for different kinds of content.

Step 3: Create content pages one at a time

After approving the Main Layout, create each page by explaining its purpose and required content. ChatGPT can keep it aligned with the existing website design.

Create an About page using the approved Main Layout. Include: - a clear company introduction - our mission and values - a short company story - a team section - a call to action leading to Contact Keep the existing navigation, footer, typography, colors, and spacing. Show me a preview before applying it.

A page-by-page workflow makes it easier to review content quality, heading structure, internal links, calls to action, and mobile readability.

Step 4: Add a Child Layout only when it helps

A Child Layout is useful when several related pages need the same additional format. Common examples include articles, documentation, product details, case studies, course lessons, and help-center pages.

GENERAL PAGE

Main Layout → Content Page

Use this for pages that only need the shared website header, footer, navigation, and visual system.

PAGE GROUP

Main Layout → Child Layout → Content Page

Use this when a group of pages also shares an article format, sidebar, product structure, or another repeated experience.

YouI’m going to create ten guide pages. They should all share breadcrumb navigation, a title area, reading information, an article column, and a table of contents.

ChatGPTThese pages have enough shared structure to justify a Child Layout. I’ll create the guide format once so every guide follows the same reading experience.

Step 5: Make changes at the right level

When requesting an update, tell ChatGPT how widely the change should apply.

Change the whole websiteUpdate the Main Layout when navigation, the footer, typography, colors, or another website-wide element should change everywhere.

Change one page groupUpdate the relevant Child Layout when all articles, products, guides, or case studies need the same improvement.

Change one pageName the individual page when its wording, image, link, or call to action should change without affecting anything else.

Update the footer across the entire website, but do not change the content of any individual page. Add a related-guides section to all guide pages, but leave general website pages unchanged. Rewrite only the introduction on the About page. Keep the shared design and all other pages unchanged.

Step 6: Preview before applying changes

Use the preview to check both the content and the user experience. If something is wrong, describe the visible problem in plain language.

Does the page have one clear purpose?
Is the main message immediately understandable?
Are the headings and sections easy to scan?
Do the buttons and links lead visitors to the right next step?
Does the page match the rest of the website?
Is the mobile version clear and comfortable to use?
Do internal links lead to the correct pages?

Useful feedback: “Shorten the opening section,” “Improve the spacing between sections,” “Use the same button style as the Home page,” or “Keep the shared header unchanged and revise only this page.”

A practical multi-page workflow

1. List the pages the website needs. 2. Create and approve the Main Layout. 3. Build general content pages one at a time. 4. Add a Child Layout only when a page group needs a shared format. 5. Review navigation and internal links. 6. Preview the website on desktop and mobile. 7. Apply only the approved result.

Reusable prompt for a new page

Create a new page for my existing website. Page name: [Page name] Purpose: [What visitors should understand or do] Use: [Main Layout or the relevant Child Layout] Required content: - [Section or information] - [Section or information] - [Section or information] Keep the page consistent with the approved website design. Make it responsive, easy to scan, and comfortable to read. Add relevant internal links and a clear call to action. Show me a preview before applying it.

FREQUENTLY ASKED QUESTIONS

FAQ: Building multi-page websites with ChatGPT

Quick answers for planning layouts, creating pages, and managing changes.

Do I always need a Child Layout?

No. If the Main Layout already provides everything a page needs, use it directly. Add a Child Layout only when several related pages need the same additional structure.

When should I create a Child Layout?

Create one when a group of pages repeatedly uses the same format, such as articles, products, case studies, or documentation.

Should I create every page in one request?

You can, but creating and reviewing pages in stages usually produces more reliable results. Approve the shared design first, then build pages one at a time.

Where should I change the header or footer?

Ask ChatGPT to update the Main Layout so the change can appear consistently across the website.

What if only guide pages need a new feature?

Update the guide Child Layout so the improvement applies to that page group without affecting general pages.

What if I only want to change one page?

Name the page and clearly state that the update should apply only there. Leave the shared layouts and other pages unchanged.

Why should I preview each change?

The preview lets you verify the content, design, navigation, links, and mobile experience before anything is applied.

What if ChatGPT becomes confused about the website?

Restate the project, page, and layout you want to work on. Explain whether the change applies to the whole website, one page group, or one page. If needed, start a new chat and provide a short summary or the downloadable VIXNODE instructions.

Ready to build your first page?

Start with a page list and one Main Layout. Add content pages as you need them, and introduce a Child Layout only when several pages genuinely benefit from the same additional structure.

Open ChatGPT

Friendly reminderChatGPT may make mistakes. Review each preview, confirm the correct page and scope, and check important content and navigation before publishing.