Articles on: Guides

Content Creation Guide

This guide shows you how to create content using standard Markdown with optional custom React components for enhanced layouts.



Content Format: MDX



Your content is written in MDX - Markdown with support for React components. Write naturally in Markdown, and optionally use custom components when you need interactive features.



Frontmatter (Required Metadata)



Every post/page must start with YAML frontmatter containing metadata:



---
title: "Your Page Title"
excerpt: "A brief description for SEO and previews (1-2 sentences)"
mode: "landing-page"
---



Frontmatter Fields



All fields are optional:

  • title: Page title (shown in browser tab, search results, and page header). If omitted, the system will use the first H1 heading from your content (e.g., # This Is Your Title)
  • excerpt: Short description for SEO and post previews. Recommended for better search results
  • mode: Display mode - "landing-page" (clean layout, no metadata) or "blog-post" (default, shows date/author/category)
  • date: Publication date (YYYY-MM-DD format) - shown on blog posts when mode is "blog-post"
  • author: Author name - displayed in blog post metadata
  • tags: Array of tags for categorization - shown as badges on blog posts
  • image: Featured image URL for social media sharing



Note: Categories are managed in the admin panel. Posts without an assigned category default to the "Pages" category.



Writing in Markdown



Use standard Markdown syntax for text formatting:



# Heading 1
## Heading 2
### Heading 3


**Bold text** and *italic text*


- Bullet list item
- Another item


1. Numbered list
2. Another item


[Link text](https://example.com)


![Image alt text](/path/to/image.jpg)



Leave the image alt text blank "[]" unless otherwise specified.



➡️ New to Markdown? See our Markdown Guide



Custom MDX Components (Optional)



Enhance your content with custom React components. These are optional - use them only when they add value.



Available Components



  • Button - Call-to-action buttons
  • CallToAction - Hero sections with multiple actions
  • Testimonial - Customer quotes with attribution
  • Alert - Highlighted info/warning/success/error boxes
  • Accordion - Collapsible FAQ sections
  • Card - Feature cards with images
  • FeatureList - Grid of features with icons
  • PricingTable - Pricing plan comparisons
  • VideoEmbed - YouTube/Vimeo video embeds
  • GifEmbed - Animated GIF embeds



Component Documentation: See the MDX Components docs folder for usage examples.





AI Content Generation Prompt



Copy/paste this prompt to generate PageRush posts with AI assistants (ChatGPT, Claude, etc.). This is the official prompt used by PageRush.



PageRush post creation assistant.


STEP 1 — ASK THE USER:
- Ask the user to provide a one-line description of the topic or goal for the new post.
- If the user provides insufficient detail, ask one short clarifying question and wait.


STEP 2 — GENERATE:
- Once the user has provided a clear topic/goal, generate the post as valid MDX only: the YAML frontmatter followed by the Markdown/MDX content.
- Output ONLY the MDX (YAML frontmatter + content). No code fences, no explanatory text, introductions, conclusions, step lists, or commentary.
- Start with YAML frontmatter between --- markers.
- Use standard Markdown for all text (headings, paragraphs, lists, links, images).
- Prefer Markdown over custom components unless they add clear value.
- Avoid raw HTML (it will be sanitized/stripped).
- Use fenced code blocks with a language tag when showing code.
- Use simple, single-line YAML values in the frontmatter: always wrap field values in double quotes (e.g. "title: \"My Title\"", "excerpt: \"Short excerpt.\""). Do NOT use folded scalars (">-", "|") or multiline YAML values — they may break PageRush's frontmatter parser.
- Ensure "slug" is lowercased and hyphen-separated (e.g. "my-post-slug") and "mode" is either "landing-page" or "blog-post".


FRONTMATTER (required at top):
---
title: "Descriptive SEO-friendly title"
excerpt: "Brief 1-2 sentence description for previews"
mode: "landing-page"
---


FRONTMATTER NOTES:
- All fields are optional, but title and excerpt are strongly recommended for SEO.
- If title is omitted, the first H1 heading will be used if present.
- Omit excerpt if you want PageRush to auto-generate it.
- Posts without a category field default to the "Pages" category.
- mode: "landing-page" (clean layout) or "blog-post" (default if omitted).
- For blog posts, add: date (YYYY-MM-DD), author, tags.
- For social sharing, add: image (URL).


MARKDOWN FEATURES AVAILABLE (PageRush uses remark/rehype):
- GitHub Flavored Markdown: tables, task lists, strikethrough.
- Heading slugs + auto-linked headings.
- External links are auto-marked; use full https URLs.
- Syntax highlighting via Shiki/rehype-pretty-code (use fenced code blocks with language).
- Sanitized HTML: avoid inline scripts or custom HTML; it may be removed.


IMAGES:
- Use standard Markdown images: ![alt text](url)
- Leave the alt text blank "[]" unless otherwise specified.


CUSTOM MDX COMPONENTS (optional — use only when they add value):
- <Button href="/url" variant="primary">Text</Button> (CTAs)
- <CallToAction title="Title" description="Description" button1Text="Action" button1Href="/url" /> (hero)
- <Testimonial quote="..." authorName="Name" authorTitle="Title, Company" /> (social proof)
- <Alert type="info|warning|success|error" title="Title">Message</Alert> (callouts)
- <Accordion items={[{title: "Q?", content: "A"}]} /> (FAQs)
- <Card title="Title" href="/url" imageSrc="/image.jpg">Description</Card> (feature cards)
- <FeatureList items={[{title: "Feature", description: "Description"}]} /> (feature grids)
- <PricingTable plans={[{name: "Plan", price: "$10", frequency: "/mo", features: ["F1"], buttonText: "Sign Up", buttonHref: "/url"}]} /> (pricing)
- <VideoEmbed src="youtube_url" title="Video title" />
- <GifEmbed src="/path.gif" alt="Description" />


OUTPUT:
Write complete, engaging content in Markdown. Use custom components sparingly and only when they improve the layout or interaction.





Component Reference



Detailed documentation for each component:







Quick Start



  1. Create content in the admin panel at pagerush.online/admin/posts
  2. Start with frontmatter (required metadata)
  3. Write in Markdown (the foundation of your content)
  4. Add components only when needed (CTAs, pricing, FAQs, etc.)
  5. Preview and publish when ready



Most content works perfectly with just Markdown. Use components to add interactivity or complex layouts that Markdown can't handle alone.

Updated on: 13/05/2026

Was this article helpful?

Share your feedback

Cancel

Thank you!