Skip to content
NuxtBase logo NuxtBase Docs

Landing Page

The homepage is assembled from separate landing components, not one monolithic file.

The current app/pages/index.vue renders these sections in order:

  1. LandingHero
  2. LandingFeatures
  3. LandingTestimonials
  4. LandingPricing
  5. LandingFaq
  6. LandingCta
  7. LandingWaitlist

Where To Edit

Section titled “Where To Edit”

The most common entry points are:

  • app/pages/index.vue for section order
  • app/components/landing/LandingHero.vue
  • app/components/landing/LandingFeatures.vue
  • app/components/landing/LandingPricing.vue
  • the other app/components/landing/* files for section-specific content

Shared Copy Versus Hardcoded Structure

Section titled “Shared Copy Versus Hardcoded Structure”

Some content comes from translations, while some behavior is encoded directly in component logic.

Examples of direct behavior worth reviewing:

  • hero CTA destinations
  • pricing card plan list
  • pricing CTA behavior for enterprise or custom plans
  • whether the waitlist section still exists in your version

Pricing Section Warning

Section titled “Pricing Section Warning”

The landing pricing component currently renders these plan IDs:

  • free
  • plus
  • pro
  • enterprise

That is marketing-layer UI, not the same thing as the billing system’s internal supported checkout plans.

The billing system you documented earlier is centered around free, pro, and plus. If you keep or remove enterprise in the landing page, make sure the CTA behavior still makes sense.

Safe Customization Order

Section titled “Safe Customization Order”
  1. decide which landing sections you are keeping
  2. update shared brand config first
  3. update hero and pricing CTA targets
  4. update copy and screenshots
  5. re-check SEO output on the homepage