CODOPLEX BLOG

junaidte14
12–17 minutes

Ep.06 Professional WordPress Demo Content – Creating Pixel-Perfect XML Files

Views: 10

Welcome to Episode 6 – the backbone of the Versana Companion plugin! In Episode 5, we created the demo library interface. Now it’s time to create the actual demo content that will make your theme shine.

In this episode, you’ll learn WordPress demo content creation – how to craft professional, pixel-perfect XML files that are 100% compatible with Versana’s design system. We’ll create three stunning demos (Business, Blog, Portfolio) with unique color schemes, optimized content, and eye-catching designs.

This is what separates mediocre themes from bestsellers – professionally crafted demo content that showcases your theme’s capabilities!

What We’ll Cover

  1. Understanding WordPress XML export format
  2. Creating demo content strategy (3 unique demos)
  3. Building Business demo (corporate blue palette)
  4. Building Blog demo (warm gradient palette)
  5. Building Portfolio demo (creative purple palette)
  6. Optimizing for SEO and performance
  7. Testing demo imports
  8. Best practices for demo content

Prerequisites

  • Completed Episodes 2-5
  • WordPress site with Versana theme
  • Understanding of WordPress blocks
  • Text editor for XML files

Part 1: Understanding WordPress XML Export Format

What is WordPress Export Format (WXR)?

WordPress eXtended RSS (WXR) is the standard format for exporting/importing WordPress content.

Basic structure:

<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
    xmlns:excerpt="http://wordpress.org/export/1.2/excerpt/"
    xmlns:content="http://purl.org/rss/1.0/modules/content/"
    xmlns:wfw="http://wellformedweb.org/CommentAPI/"
    xmlns:dc="http://purl.org/dc/elements/1.1/"
    xmlns:wp="http://wordpress.org/export/1.2/">
<channel>
    <title>Demo Name</title>
    <description>Demo description</description>
    <wp:wxr_version>1.2</wp:wxr_version>
    
    <!-- Posts and Pages here -->
    <item>
        <!-- Post content -->
    </item>
</channel>
</rss>

Critical Elements

1. Namespaces (Required):

xmlns:excerpt="http://wordpress.org/export/1.2/excerpt/"
xmlns:content="http://purl.org/rss/1.0/modules/content/"
xmlns:wp="http://wordpress.org/export/1.2/"

2. Post Structure:

<item>
    <title>Post Title</title>
    <wp:post_type>post</wp:post_type>
    <wp:status>publish</wp:status>
    <wp:post_date>2024-03-01 10:00:00</wp:post_date>
    <content:encoded><![CDATA[
        <!-- WordPress blocks here -->
    ]]></content:encoded>
</item>

3. Categories and Tags:

<category domain="category" nicename="technology"><![CDATA[Technology]]></category>
<category domain="post_tag" nicename="tutorial"><![CDATA[Tutorial]]></category>

Part 2: Demo Content Strategy

Three Unique Demos with Distinct Personalities

1. Business Demo – Professional & Corporate

  • Color Palette: Blue (#1A73E8) + Gray tones
  • Style: Clean, professional, trustworthy
  • Content: Services, team, testimonials
  • Target: Corporate sites, agencies, consultancies

2. Blog Demo – Warm & Personal

  • Color Palette: Warm gradient (#E91E63 to #FF9800)
  • Style: Friendly, readable, engaging
  • Content: Articles, categories, author bios
  • Target: Personal blogs, magazines, news

3. Portfolio Demo – Creative & Bold

  • Color Palette: Purple (#9C27B0) + vibrant accents
  • Style: Creative, showcase-focused, artistic
  • Content: Projects, galleries, about creative
  • Target: Designers, photographers, artists

Content Structure for Each Demo

Each demo includes:

  • ✅ 1 Homepage (using patterns)
  • ✅ 5-6 Blog posts (varied length)
  • ✅ 4-5 Pages (About, Services, Contact, etc.)
  • ✅ 3-4 Categories
  • ✅ 10-12 Tags
  • ✅ SEO-optimized content

Part 3: Creating Business Demo

Step 1: Business Demo XML Header

Create versana-companion/demos/business/content.xml:

<?xml version="1.0" encoding="UTF-8"?>
<!-- WordPress eXtended RSS (WXR) - Business Demo -->
<rss version="2.0"
    xmlns:excerpt="http://wordpress.org/export/1.2/excerpt/"
    xmlns:content="http://purl.org/rss/1.0/modules/content/"
    xmlns:wfw="http://wellformedweb.org/CommentAPI/"
    xmlns:dc="http://purl.org/dc/elements/1.1/"
    xmlns:wp="http://wordpress.org/export/1.2/">

<channel>
    <title>Versana Business Demo</title>
    <link>https://demos.codoplex.com/versana/business</link>
    <description>Professional business website with services and portfolio</description>
    <pubDate>Mon, 01 Mar 2024 10:00:00 +0000</pubDate>
    <language>en-US</language>
    <wp:wxr_version>1.2</wp:wxr_version>
    <wp:base_site_url>https://demos.codoplex.com/versana/business</wp:base_site_url>
    <wp:base_blog_url>https://demos.codoplex.com/versana/business</wp:base_blog_url>

Step 2: Business Homepage

    <!-- Homepage -->
    <item>
        <title>Home</title>
        <link>https://demos.codoplex.com/versana/business/</link>
        <pubDate>Mon, 01 Mar 2024 10:00:00 +0000</pubDate>
        <dc:creator><![CDATA[admin]]></dc:creator>
        <guid isPermaLink="false">https://demos.codoplex.com/versana/business/?page_id=1</guid>
        <wp:post_id>1</wp:post_id>
        <wp:post_date>2024-03-01 10:00:00</wp:post_date>
        <wp:post_date_gmt>2024-03-01 10:00:00</wp:post_date_gmt>
        <wp:post_type>page</wp:post_type>
        <wp:status>publish</wp:status>
        <wp:page_template>front-page</wp:page_template>
        <content:encoded><![CDATA[
<!-- wp:pattern {"slug":"versana/hero-banner"} /-->

<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|2xl","bottom":"var:preset|spacing|2xl","left":"var:preset|spacing|md","right":"var:preset|spacing|md"}}},"backgroundColor":"neutral-200","layout":{"type":"constrained"}} -->
<div class="wp-block-group alignfull has-neutral-200-background-color has-background" style="padding-top:var(--wp--preset--spacing--2-xl);padding-right:var(--wp--preset--spacing--md);padding-bottom:var(--wp--preset--spacing--2-xl);padding-left:var(--wp--preset--spacing--md)">
    <!-- wp:group {"align":"wide","style":{"spacing":{"blockGap":"var:preset|spacing|md","margin":{"bottom":"var:preset|spacing|xl"}}},"layout":{"type":"constrained","contentSize":"800px"}} -->
    <div class="wp-block-group alignwide" style="margin-bottom:var(--wp--preset--spacing--xl)">
        <!-- wp:heading {"textAlign":"center","style":{"typography":{"fontSize":"clamp(2rem, 4vw, 3rem)","fontWeight":"800"}}} -->
        <h2 class="wp-block-heading has-text-align-center" style="font-size:clamp(2rem, 4vw, 3rem);font-weight:800">Our Services</h2>
        <!-- /wp:heading -->
        
        <!-- wp:paragraph {"align":"center","textColor":"neutral-700","fontSize":"md"} -->
        <p class="has-text-align-center has-neutral-700-color has-text-color has-md-font-size">Comprehensive solutions tailored to your business needs</p>
        <!-- /wp:paragraph -->
    </div>
    <!-- /wp:group -->
    
    <!-- wp:columns {"align":"wide","style":{"spacing":{"blockGap":{"top":"var:preset|spacing|lg","left":"var:preset|spacing|lg"}}}} -->
    <div class="wp-block-columns alignwide">
        <!-- wp:column {"style":{"spacing":{"padding":{"top":"var:preset|spacing|lg","bottom":"var:preset|spacing|lg","left":"var:preset|spacing|lg","right":"var:preset|spacing|lg"}},"border":{"radius":"12px"}},"backgroundColor":"neutral-100"} -->
        <div class="wp-block-column has-neutral-100-background-color has-background" style="border-radius:12px;padding-top:var(--wp--preset--spacing--lg);padding-right:var(--wp--preset--spacing--lg);padding-bottom:var(--wp--preset--spacing--lg);padding-left:var(--wp--preset--spacing--lg)">
            <!-- wp:heading {"textAlign":"center","level":3} -->
            <h3 class="wp-block-heading has-text-align-center">Web Development</h3>
            <!-- /wp:heading -->
            
            <!-- wp:paragraph {"align":"center","textColor":"neutral-700"} -->
            <p class="has-text-align-center has-neutral-700-color has-text-color">Custom websites built with modern technologies for optimal performance and user experience</p>
            <!-- /wp:paragraph -->
        </div>
        <!-- /wp:column -->
        
        <!-- wp:column {"style":{"spacing":{"padding":{"top":"var:preset|spacing|lg","bottom":"var:preset|spacing|lg","left":"var:preset|spacing|lg","right":"var:preset|spacing|lg"}},"border":{"radius":"12px"}},"backgroundColor":"neutral-100"} -->
        <div class="wp-block-column has-neutral-100-background-color has-background" style="border-radius:12px;padding-top:var(--wp--preset--spacing--lg);padding-right:var(--wp--preset--spacing--lg);padding-bottom:var(--wp--preset--spacing--lg);padding-left:var(--wp--preset--spacing--lg)">
            <!-- wp:heading {"textAlign":"center","level":3} -->
            <h3 class="wp-block-heading has-text-align-center">Digital Marketing</h3>
            <!-- /wp:heading -->
            
            <!-- wp:paragraph {"align":"center","textColor":"neutral-700"} -->
            <p class="has-text-align-center has-neutral-700-color has-text-color">Strategic marketing campaigns that drive results and grow your online presence</p>
            <!-- /wp:paragraph -->
        </div>
        <!-- /wp:column -->
        
        <!-- wp:column {"style":{"spacing":{"padding":{"top":"var:preset|spacing|lg","bottom":"var:preset|spacing|lg","left":"var:preset|spacing|lg","right":"var:preset|spacing|lg"}},"border":{"radius":"12px"}},"backgroundColor":"neutral-100"} -->
        <div class="wp-block-column has-neutral-100-background-color has-background" style="border-radius:12px;padding-top:var(--wp--preset--spacing--lg);padding-right:var(--wp--preset--spacing--lg);padding-bottom:var(--wp--preset--spacing--lg);padding-left:var(--wp--preset--spacing--lg)">
            <!-- wp:heading {"textAlign":"center","level":3} -->
            <h3 class="wp-block-heading has-text-align-center">Consulting</h3>
            <!-- /wp:heading -->
            
            <!-- wp:paragraph {"align":"center","textColor":"neutral-700"} -->
            <p class="has-text-align-center has-neutral-700-color has-text-color">Expert guidance to help you make informed decisions and achieve your goals</p>
            <!-- /wp:paragraph -->
        </div>
        <!-- /wp:column -->
    </div>
    <!-- /wp:columns -->
</div>
<!-- /wp:group -->

<!-- wp:pattern {"slug":"versana/latest-articles"} /-->

<!-- wp:pattern {"slug":"versana/call-to-action"} /-->
        ]]></content:encoded>
        <excerpt:encoded><![CDATA[]]></excerpt:encoded>
    </item>

Step 3: Business Blog Post #1

    <!-- Blog Post: Digital Transformation -->
    <item>
        <title>5 Steps to Digital Transformation Success</title>
        <link>https://demos.codoplex.com/versana/business/digital-transformation</link>
        <pubDate>Mon, 15 Jan 2024 09:00:00 +0000</pubDate>
        <dc:creator><![CDATA[admin]]></dc:creator>
        <guid isPermaLink="false">https://demos.codoplex.com/versana/business/?p=10</guid>
        <wp:post_id>10</wp:post_id>
        <wp:post_date>2024-01-15 09:00:00</wp:post_date>
        <wp:post_date_gmt>2024-01-15 09:00:00</wp:post_date_gmt>
        <wp:post_type>post</wp:post_type>
        <wp:status>publish</wp:status>
        <category domain="category" nicename="business-strategy"><![CDATA[Business Strategy]]></category>
        <category domain="post_tag" nicename="digital-transformation"><![CDATA[Digital Transformation]]></category>
        <category domain="post_tag" nicename="technology"><![CDATA[Technology]]></category>
        <content:encoded><![CDATA[
<!-- wp:paragraph {"dropCap":true} -->
<p class="has-drop-cap">Digital transformation is no longer optional—it's essential for businesses to remain competitive in today's rapidly evolving marketplace. Organizations that embrace digital technologies are better positioned to meet customer expectations, streamline operations, and drive innovation.</p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2 class="wp-block-heading">Understanding Digital Transformation</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Digital transformation involves integrating digital technology into all areas of your business, fundamentally changing how you operate and deliver value to customers. It's about more than just adopting new tools—it's a cultural shift that requires organizations to continually challenge the status quo and experiment with new approaches.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3 class="wp-block-heading">Step 1: Assess Your Current State</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Before embarking on your digital transformation journey, conduct a comprehensive assessment of your current technology infrastructure, processes, and capabilities. Identify gaps and opportunities where digital solutions could make the greatest impact.</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul class="wp-block-list">
<li>Evaluate existing systems and tools</li>
<li>Identify pain points in current workflows</li>
<li>Assess team digital literacy levels</li>
<li>Review customer feedback and expectations</li>
</ul>
<!-- /wp:list -->

<!-- wp:heading {"level":3} -->
<h3 class="wp-block-heading">Step 2: Define Clear Objectives</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Successful digital transformation requires clear, measurable goals. Whether you're aiming to improve customer experience, increase operational efficiency, or create new revenue streams, having well-defined objectives will guide your strategy and help measure success.</p>
<!-- /wp:paragraph -->

<!-- wp:quote {"className":"is-style-default"} -->
<blockquote class="wp-block-quote is-style-default"><p>"Digital transformation is not about technology; it's about change, leadership, and reimagining your business model."</p><cite>— Industry Expert</cite></blockquote>
<!-- /wp:quote -->

<!-- wp:heading {"level":3} -->
<h3 class="wp-block-heading">Step 3: Build the Right Team</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Digital transformation success hinges on having the right people driving the initiative. Assemble a cross-functional team that brings together technical expertise, business acumen, and change management skills.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3 class="wp-block-heading">Step 4: Start with Quick Wins</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Rather than attempting a complete overhaul all at once, focus on implementing projects that can deliver quick wins. These early successes build momentum, demonstrate value, and help secure ongoing support for larger initiatives.</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3 class="wp-block-heading">Step 5: Foster a Culture of Innovation</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>The most successful digital transformations go beyond technology implementation—they create a culture that embraces change, encourages experimentation, and rewards innovation. Invest in training, communication, and change management to ensure your entire organization is aligned and engaged.</p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2 class="wp-block-heading">Measuring Success</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Track key performance indicators (KPIs) that align with your transformation objectives. Monitor both quantitative metrics (revenue growth, cost savings, productivity gains) and qualitative measures (employee satisfaction, customer feedback, innovation rate).</p>
<!-- /wp:paragraph -->

<!-- wp:separator -->
<hr class="wp-block-separator has-alpha-channel-opacity"/>
<!-- /wp:separator -->

<!-- wp:paragraph {"fontSize":"sm"} -->
<p class="has-sm-font-size"><strong>Ready to start your digital transformation journey?</strong> Contact our team of experts who can guide you through every step of the process.</p>
<!-- /wp:paragraph -->
        ]]></content:encoded>
        <excerpt:encoded><![CDATA[Learn the essential steps to successfully transform your business for the digital age. From assessment to implementation, discover proven strategies that drive results.]]></excerpt:encoded>
    </item>

Step 4: Business About Page

    <!-- About Page -->
    <item>
        <title>About Us</title>
        <link>https://demos.codoplex.com/versana/business/about</link>
        <pubDate>Mon, 01 Mar 2024 10:00:00 +0000</pubDate>
        <dc:creator><![CDATA[admin]]></dc:creator>
        <wp:post_id>20</wp:post_id>
        <wp:post_date>2024-03-01 10:00:00</wp:post_date>
        <wp:post_type>page</wp:post_type>
        <wp:status>publish</wp:status>
        <content:encoded><![CDATA[
<!-- wp:cover {"url":"","overlayColor":"primary","minHeight":400,"contentPosition":"center center","isDark":true,"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|xl","bottom":"var:preset|spacing|xl"}}}} -->
<div class="wp-block-cover alignfull is-light" style="padding-top:var(--wp--preset--spacing--xl);padding-bottom:var(--wp--preset--spacing--xl);min-height:400px"><span aria-hidden="true" class="wp-block-cover__background has-primary-background-color has-background-dim-100 has-background-dim"></span><div class="wp-block-cover__inner-container">
    <!-- wp:heading {"textAlign":"center","level":1,"textColor":"neutral-100","fontSize":"4-xl"} -->
    <h1 class="wp-block-heading has-text-align-center has-neutral-100-color has-text-color has-4-xl-font-size">About Our Company</h1>
    <!-- /wp:heading -->
    
    <!-- wp:paragraph {"align":"center","textColor":"neutral-100","fontSize":"md"} -->
    <p class="has-text-align-center has-neutral-100-color has-text-color has-md-font-size">Building the future of digital business</p>
    <!-- /wp:paragraph -->
</div></div>
<!-- /wp:cover -->

<!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"var:preset|spacing|2xl","bottom":"var:preset|spacing|2xl"}}},"layout":{"type":"constrained","contentSize":"800px"}} -->
<div class="wp-block-group alignwide" style="padding-top:var(--wp--preset--spacing--2-xl);padding-bottom:var(--wp--preset--spacing--2-xl)">
    <!-- wp:heading -->
    <h2 class="wp-block-heading">Our Story</h2>
    <!-- /wp:heading -->
    
    <!-- wp:paragraph {"fontSize":"md"} -->
    <p class="has-md-font-size">Founded in 2020, our company emerged from a simple belief: businesses deserve technology partners who understand their unique challenges and opportunities. What started as a small team of passionate technologists has grown into a full-service digital agency serving clients across industries.</p>
    <!-- /wp:paragraph -->
    
    <!-- wp:paragraph -->
    <p>Today, we combine cutting-edge technology with strategic thinking to deliver solutions that drive real business results. Our multidisciplinary team brings together expertise in web development, digital marketing, user experience design, and business consulting.</p>
    <!-- /wp:paragraph -->
    
    <!-- wp:heading -->
    <h2 class="wp-block-heading">Our Mission</h2>
    <!-- /wp:heading -->
    
    <!-- wp:paragraph {"fontSize":"md"} -->
    <p class="has-md-font-size">To empower businesses with innovative digital solutions that drive growth, enhance customer experiences, and create lasting competitive advantages.</p>
    <!-- /wp:paragraph -->
    
    <!-- wp:heading -->
    <h2 class="wp-block-heading">Our Values</h2>
    <!-- /wp:heading -->
    
    <!-- wp:list -->
    <ul class="wp-block-list">
    <li><strong>Excellence:</strong> We set high standards and consistently deliver exceptional results</li>
    <li><strong>Innovation:</strong> We embrace new technologies and creative approaches</li>
    <li><strong>Integrity:</strong> We build trust through transparency and honest communication</li>
    <li><strong>Collaboration:</strong> We work as partners with our clients, not just vendors</li>
    <li><strong>Growth:</strong> We invest in continuous learning and development</li>
    </ul>
    <!-- /wp:list -->
</div>
<!-- /wp:group -->
        ]]></content:encoded>
    </item>

Part 4: Creating Blog Demo with Warm Palette

Step 1: Blog Demo Strategy

Unique Aspects:

  • Warm, inviting color gradient
  • Focus on readability and engagement
  • Personal, conversational tone
  • Category-rich structure

Step 2: Blog Demo Homepage

Create versana-companion/demos/blog/content.xml:

<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
    xmlns:excerpt="http://wordpress.org/export/1.2/excerpt/"
    xmlns:content="http://purl.org/rss/1.0/modules/content/"
    xmlns:wfw="http://wellformedweb.org/CommentAPI/"
    xmlns:dc="http://purl.org/dc/elements/1.1/"
    xmlns:wp="http://wordpress.org/export/1.2/">

<channel>
    <title>Versana Blog Demo</title>
    <link>https://demos.codoplex.com/versana/blog</link>
    <description>Personal blog with engaging content and warm design</description>
    <wp:wxr_version>1.2</wp:wxr_version>
    
    <!-- Homepage -->
    <item>
        <title>Home</title>
        <wp:post_type>page</wp:post_type>
        <wp:status>publish</wp:status>
        <wp:page_template>front-page</wp:page_template>
        <wp:post_date>2024-03-01 10:00:00</wp:post_date>
        <content:encoded><![CDATA[
<!-- wp:cover {"overlayColor":"secondary","gradient":"warm-gradient","minHeight":600,"contentPosition":"center center","align":"full"} -->
<div class="wp-block-cover alignfull" style="min-height:600px"><span aria-hidden="true" class="wp-block-cover__background has-secondary-background-color has-background-dim-100 has-background-dim has-background-gradient has-warm-gradient-gradient-background"></span><div class="wp-block-cover__inner-container">
    <!-- wp:heading {"textAlign":"center","level":1,"textColor":"neutral-100","fontSize":"4-xl"} -->
    <h1 class="wp-block-heading has-text-align-center has-neutral-100-color has-text-color has-4-xl-font-size">Welcome to My Blog</h1>
    <!-- /wp:heading -->
    
    <!-- wp:paragraph {"align":"center","textColor":"neutral-100","fontSize":"lg"} -->
    <p class="has-text-align-center has-neutral-100-color has-text-color has-lg-font-size">Sharing stories, insights, and inspiration from my journey</p>
    <!-- /wp:paragraph -->
    
    <!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center"}} -->
    <div class="wp-block-buttons">
        <!-- wp:button {"backgroundColor":"neutral-100","textColor":"secondary"} -->
        <div class="wp-block-button"><a class="wp-block-button__link has-secondary-color has-neutral-100-background-color has-text-color has-background">Start Reading</a></div>
        <!-- /wp:button -->
    </div>
    <!-- /wp:buttons -->
</div></div>
<!-- /wp:cover -->

<!-- wp:pattern {"slug":"versana/latest-articles"} /-->

<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|2xl","bottom":"var:preset|spacing|2xl"}}},"backgroundColor":"neutral-200","layout":{"type":"constrained"}} -->
<div class="wp-block-group alignfull has-neutral-200-background-color has-background" style="padding-top:var(--wp--preset--spacing--2-xl);padding-bottom:var(--wp--preset--spacing--2-xl)">
    <!-- wp:heading {"textAlign":"center","fontSize":"3-xl"} -->
    <h2 class="wp-block-heading has-text-align-center has-3-xl-font-size">Popular Categories</h2>
    <!-- /wp:heading -->
    
    <!-- wp:columns {"align":"wide"} -->
    <div class="wp-block-columns alignwide">
        <!-- wp:column -->
        <div class="wp-block-column">
            <!-- wp:group {"style":{"border":{"radius":"12px"},"spacing":{"padding":{"top":"var:preset|spacing|lg","right":"var:preset|spacing|lg","bottom":"var:preset|spacing|lg","left":"var:preset|spacing|lg"}}},"backgroundColor":"neutral-100"} -->
            <div class="wp-block-group has-neutral-100-background-color has-background" style="border-radius:12px">
                <!-- wp:heading {"textAlign":"center","level":3} -->
                <h3 class="wp-block-heading has-text-align-center">Lifestyle</h3>
                <!-- /wp:heading -->
                <!-- wp:paragraph {"align":"center"} -->
                <p class="has-text-align-center">Daily inspiration and life tips</p>
                <!-- /wp:paragraph -->
            </div>
            <!-- /wp:group -->
        </div>
        <!-- /wp:column -->
        
        <!-- wp:column -->
        <div class="wp-block-column">
            <!-- wp:group {"style":{"border":{"radius":"12px"},"spacing":{"padding":{"top":"var:preset|spacing|lg","right":"var:preset|spacing|lg","bottom":"var:preset|spacing|lg","left":"var:preset|spacing|lg"}}},"backgroundColor":"neutral-100"} -->
            <div class="wp-block-group has-neutral-100-background-color has-background" style="border-radius:12px">
                <!-- wp:heading {"textAlign":"center","level":3} -->
                <h3 class="wp-block-heading has-text-align-center">Travel</h3>
                <!-- /wp:heading -->
                <!-- wp:paragraph {"align":"center"} -->
                <p class="has-text-align-center">Adventures around the world</p>
                <!-- /wp:paragraph -->
            </div>
            <!-- /wp:group -->
        </div>
        <!-- /wp:column -->
        
        <!-- wp:column -->
        <div class="wp-block-column">
            <!-- wp:group {"style":{"border":{"radius":"12px"},"spacing":{"padding":{"top":"var:preset|spacing|lg","right":"var:preset|spacing|lg","bottom":"var:preset|spacing|lg","left":"var:preset|spacing|lg"}}},"backgroundColor":"neutral-100"} -->
            <div class="wp-block-group has-neutral-100-background-color has-background" style="border-radius:12px">
                <!-- wp:heading {"textAlign":"center","level":3} -->
                <h3 class="wp-block-heading has-text-align-center">Food</h3>
                <!-- /wp:heading -->
                <!-- wp:paragraph {"align":"center"} -->
                <p class="has-text-align-center">Recipes and culinary discoveries</p>
                <!-- /wp:paragraph -->
            </div>
            <!-- /wp:group -->
        </div>
        <!-- /wp:column -->
    </div>
    <!-- /wp:columns -->
</div>
<!-- /wp:group -->
        ]]></content:encoded>
    </item>
    
    <!-- Blog Post: Morning Routine -->
    <item>
        <title>My Morning Routine That Changed Everything</title>
        <wp:post_type>post</wp:post_type>
        <wp:status>publish</wp:status>
        <wp:post_date>2024-02-15 07:00:00</wp:post_date>
        <category domain="category" nicename="lifestyle"><![CDATA[Lifestyle]]></category>
        <category domain="post_tag" nicename="productivity"><![CDATA[Productivity]]></category>
        <category domain="post_tag" nicename="wellness"><![CDATA[Wellness]]></category>
        <content:encoded><![CDATA[
<!-- wp:paragraph {"dropCap":true} -->
<p class="has-drop-cap">For years, I struggled with mornings. I'd hit snooze multiple times, rush through getting ready, and start my day feeling stressed and behind. Everything changed when I discovered the power of an intentional morning routine.</p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2 class="wp-block-heading">The Wake-Up Call</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>It started on a random Tuesday when I woke up naturally at 5:30 AM—no alarm. Instead of rolling back to sleep, I decided to embrace the early morning. That decision changed my life.</p>
<!-- /wp:paragraph -->

<!-- wp:image {"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large"><img src="" alt="Morning sunrise"/><figcaption class="wp-element-caption">Early morning light streaming through my window</figcaption></figure>
<!-- /wp:image -->

<!-- wp:heading {"level":3} -->
<h3 class="wp-block-heading">My Current Morning Routine</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Here's what my mornings look like now, and trust me, if I can do this, anyone can:</p>
<!-- /wp:paragraph -->

<!-- wp:list {"ordered":true} -->
<ol class="wp-block-list">
<li><strong>5:30 AM - Wake Up:</strong> No snoozing, phone stays across the room</li>
<li><strong>5:35 AM - Hydrate:</strong> Large glass of water with lemon</li>
<li><strong>5:40 AM - Movement:</strong> 15 minutes of gentle yoga or stretching</li>
<li><strong>6:00 AM - Meditation:</strong> 10 minutes of quiet reflection</li>
<li><strong>6:15 AM - Journal:</strong> Morning pages, gratitude, intentions</li>
<li><strong>6:30 AM - Reading:</strong> 20 minutes of personal development</li>
<li><strong>7:00 AM - Breakfast:</strong> Healthy, nourishing meal</li>
<li><strong>7:30 AM - Plan:</strong> Review goals, prioritize tasks</li>
</ol>
<!-- /wp:list -->

<!-- wp:quote -->
<blockquote class="wp-block-quote"><p>"How you start your day determines how you live your day. How you live your day determines how you live your life."</p><cite>— Louise Hay</cite></blockquote>
<!-- /wp:quote -->

<!-- wp:heading -->
<h2 class="wp-block-heading">The Results</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>After six months of this routine, here's what changed:</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul class="wp-block-list">
<li>✨ More energy throughout the day</li>
<li>🎯 Better focus and productivity</li>
<li>😌 Less stress and anxiety</li>
<li>💪 Improved physical fitness</li>
<li>📈 Achieved more personal goals</li>
<li>😊 Overall better mood and outlook</li>
</ul>
<!-- /wp:list -->

<!-- wp:heading -->
<h2 class="wp-block-heading">Start Small</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>You don't need to adopt this entire routine tomorrow. Start with just one element—maybe waking up 15 minutes earlier or adding a short meditation. Build from there.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>The key is consistency. It took me about 21 days before these habits felt natural, and 90 days before they became automatic. But the investment was worth every early alarm.</p>
<!-- /wp:paragraph -->

<!-- wp:separator -->
<hr class="wp-block-separator has-alpha-channel-opacity"/>
<!-- /wp:separator -->

<!-- wp:paragraph {"fontSize":"sm"} -->
<p class="has-sm-font-size"><strong>What's your morning routine like?</strong> Share in the comments below—I'd love to hear what works for you!</p>
<!-- /wp:paragraph -->
        ]]></content:encoded>
        <excerpt:encoded><![CDATA[Discover how a simple morning routine transformed my productivity, health, and overall happiness. Plus, get actionable tips to create your own routine.]]></excerpt:encoded>
    </item>

</channel>
</rss>

Part 5: Key Principles for Professional Demo Content

SEO Optimization

1. Keyword-Rich Titles:

<title>5 Steps to Digital Transformation Success</title>
<!-- Not: "Digital Stuff" -->

2. Meta Descriptions (Excerpts):

<excerpt:encoded><![CDATA[Learn the essential steps to successfully transform your business for the digital age. From assessment to implementation, discover proven strategies.]]></excerpt:encoded>
<!-- 150-160 characters, includes keywords -->

3. Proper Heading Hierarchy:

<!-- wp:heading {"level":1} --> H1 - Main Title
<!-- wp:heading --> H2 - Major Sections
<!-- wp:heading {"level":3} --> H3 - Subsections

4. Strategic Categories and Tags:

<category domain="category" nicename="business-strategy"><![CDATA[Business Strategy]]></category>
<category domain="post_tag" nicename="digital-transformation"><![CDATA[Digital Transformation]]></category>

Content Best Practices

Length Guidelines:

  • Blog Posts: 800-1500 words
  • Pages: 500-800 words
  • Excerpts: 150-160 characters

Readability:

<!-- Use drop caps for engaging starts -->
<!-- wp:paragraph {"dropCap":true} -->

<!-- Break up content with subheadings -->
<!-- Every 2-3 paragraphs -->

<!-- Use lists for scannable content -->
<!-- wp:list -->

<!-- Add quotes for emphasis -->
<!-- wp:quote -->

Design Elements

Spacing:

style="padding-top:var(--wp--preset--spacing--2-xl)"
<!-- Uses theme.json spacing tokens -->

Colors:

"backgroundColor":"neutral-100"
"textColor":"primary"
<!-- Uses theme.json color palette -->

Typography:

"fontSize":"md"
"fontWeight":"700"
<!-- Uses theme.json typography -->

Part 6: Testing Demo Imports

Step 1: Validate XML

Check for:

  • ✅ Proper XML syntax
  • ✅ All namespaces declared
  • ✅ CDATA sections closed
  • ✅ No invalid characters
  • ✅ Matching opening/closing tags

Use online validator:

https://www.xmlvalidation.com/

Step 2: Test Import Process

  1. Fresh WordPress Install
  2. Install Versana Theme
  3. Activate Versana Companion
  4. Go to Demo Import Tab
  5. Click Import on Business Demo
  6. Verify:
    • ✅ All posts imported
    • ✅ All pages imported
    • ✅ Categories created
    • ✅ Tags assigned
    • ✅ Content displays correctly
    • ✅ No broken blocks
    • ✅ Colors applied from theme.json
    • ✅ Spacing consistent

Step 3: Quality Checklist

Visual Check:

  • [ ] Homepage looks professional
  • [ ] Blog posts are readable
  • [ ] Images (if any) display
  • [ ] Buttons work
  • [ ] Colors match demo
  • [ ] Spacing is consistent
  • [ ] Mobile responsive

Content Check:

  • [ ] No Lorem Ipsum
  • [ ] Real, valuable content
  • [ ] Proper grammar/spelling
  • [ ] SEO-optimized
  • [ ] Categories make sense
  • [ ] Tags are relevant

Technical Check:

  • [ ] No block errors
  • [ ] No console errors
  • [ ] Fast page load
  • [ ] Valid HTML
  • [ ] Accessibility passes

Conclusion

Congratulations! You’ve learned how to create professional WordPress demo content that showcases your theme beautifully. These pixel-perfect XML files integrate seamlessly with Versana’s design system and provide users with stunning starting points.

What We Accomplished

✅ Understanding WordPress XML format ✅ Creating demo content strategy ✅ Building Business demo (corporate style) ✅ Building Blog demo (warm, personal) ✅ Planning Portfolio demo structure ✅ SEO optimization techniques ✅ Content best practices ✅ Testing and validation

What We Learned

Technical Skills:

  • WordPress XML (WXR) format
  • Block editor markup
  • Theme.json integration
  • Namespace handling
  • CDATA sections
  • Category/tag structure

Content Skills:

  • SEO optimization
  • Engaging writing
  • Proper structure
  • Readability techniques
  • Visual hierarchy
  • User experience

Key Takeaways

For professional demo content:

  1. Quality Over Quantity – 5 great posts > 20 mediocre
  2. Real Content – No Lorem Ipsum, write actual valuable content
  3. SEO Matters – Titles, excerpts, headings, keywords
  4. Visual Appeal – Use theme.json colors, spacing, typography
  5. Test Thoroughly – Import on fresh site, check everything
  6. User Perspective – Would YOU use this demo?
  7. Cohesive Design – All elements work together
  8. Performance – Don’t bloat with unnecessary content

Your Plugin Progress

✓ Episode 2: Basic plugin
✓ Episode 3: Theme compatibility
✓ Episode 4: Settings integration
✓ Episode 5: Demo library display
✓ Episode 6: Demo content creation ← YOU ARE HERE
→ Episode 7: Import functionality (wp_insert_post)

Download Complete Demo Files

I’ve created complete, production-ready XML files for all three demos. Each includes:

  • Business Demo: 1 homepage + 5 posts + 4 pages (~3500 words)
  • Blog Demo: 1 homepage + 6 posts + 3 pages (~4000 words)
  • Portfolio Demo: 1 homepage + 5 projects + 3 pages (~3000 words)

File locations:

versana-companion/
└── demos/
    ├── business/
    │   └── content.xml (Complete business demo)
    ├── blog/
    │   └── content.xml (Complete blog demo)
    └── portfolio/
        └── content.xml (Complete portfolio demo)

Frequently Asked Questions

Q: Can I edit the XML files after creation? A: Yes, but be careful with syntax. Always validate after editing.

Q: How do I add images to demos? A: We’ll cover this in Episode 8. For now, use placeholder URLs or leave empty.

Q: Can users customize imported content? A: Yes! Once imported, it’s regular WordPress content they can edit freely.

Q: What about custom post types? A: Use <wp:post_type>your_type</wp:post_type>. Works same as posts/pages.

Q: How do I update demo content later? A: Edit XML file, users re-import (will duplicate content though).

Q: Can I include forms/widgets? A: Yes, use block editor blocks. Most plugins have block versions.

Q: What about menus? A: Best created during import (Episode 7) not in XML.

Q: How to handle different color schemes per demo? A: Use theme.json color tokens. We’ll cover global color switching in advanced episodes.

Next Episode Preview

Episode 7: Demo Import Functionality

We’ll learn:

  • Processing XML files
  • Creating posts with wp_insert_post()
  • Handling categories and tags
  • Import progress tracking
  • Error handling
  • All with the XML files we created!

Congratulations on completing Episode 6! You’ve mastered professional demo content creation!

Series: Building Versana Companion Plugin

Episode: 6 of ongoing series (Demo Content Creation Complete)

Tags

Leave a Reply

Search

Categories

Recent Posts

Tags

angular block theme BlockTheme block themes CodoBookings c programming data science docker expressjs fastapi full site editing FullSiteEditing gutenberg java learn angular learn html & html5 learn nextjs learn wordpress machine learning mongodb n8n beginner guide n8n tutorial nginx nodejs react research methodologies R programming theme.json ubuntu versana companion plugin vps vps server website migration weebly app weebly apps weebly tutorials wordpress blocks wordpress block theme wordpress news wordpress plugin development wordpress plugins wordpress security wordpress templates wordpress theme development wordpress tutorials