Skip to main content

Preview & Publishing

Before your page goes live, it's important to preview your work and understand how publishing works with Promptless WP. This guide covers everything about previewing, checking your work, and publishing pages.

Understanding Preview vs Live

Editor Preview

What it is: The live preview you see in the center panel of the editor Shows: Real-time updates as you edit Purpose: Immediate feedback while building Limitations: May not show exact theme integration

Page Preview

What it is: Full page preview in a new browser tab Shows: Exactly how visitors will see your page Purpose: Final check before publishing Includes: Your theme's header, footer, and navigation

Live Site

What it is: Your actual published page on the internet Shows: The final result visitors see Purpose: The real deal - your published content Includes: Full theme integration, SEO, and functionality

Using the Preview System

Opening Preview

  1. Click the "Preview" button in the top toolbar (eye icon)
  2. New browser tab opens showing your page
  3. Page displays exactly as visitors will see it
  4. Keep both tabs open for easy comparison

What Preview Shows

The preview includes:

  • Your theme's header and footer
  • Navigation menus
  • Sidebar widgets (if your theme has them)
  • All your sections with final styling
  • Responsive design for different screen sizes

Auto-Refresh Feature

The preview page automatically updates when you:

  • Save changes in the editor
  • Make global setting changes
  • Update section content
  • Change display modes

[Screenshot: Editor and preview tabs side by side]

Display Modes Explained

Promptless WP offers two display modes that affect how your page appears:

Canvas Mode

What it does: Creates a blank page with no theme elements Best for:

  • Landing pages
  • Sales pages
  • Event pages
  • Pages that need full control

Includes:

  • Only your sections
  • No theme header or footer
  • No sidebar or navigation
  • Clean, distraction-free layout

How to enable:

  1. Go to the WordPress page editor (not Promptless WP)
  2. Find the "Promptless WP" meta box
  3. Change Display Mode to "Canvas"
  4. Update the page

Fullwidth Mode (Default)

What it does: Shows your sections within your theme's layout Best for:

  • Regular website pages
  • Blog posts with sections
  • Pages that should match site navigation

Includes:

  • Your theme's header and footer
  • Navigation menus
  • Sidebar (if theme has one)
  • Your sections in the main content area

How to enable:

  1. Go to the WordPress page editor
  2. Find the "Promptless WP" meta box
  3. Change Display Mode to "Full Width"
  4. Update the page

[Screenshot: Canvas vs Fullwidth mode comparison]

Preview Testing Checklist

Before publishing, check these important elements:

Content Review

  • All text is correct - No typos or placeholder text
  • Images display properly - No broken images or wrong pictures
  • Links work - Test all buttons and text links
  • Contact information is accurate - Phone numbers, emails, addresses
  • Calls-to-action are clear - Visitors know what to do next

Visual Check

  • Sections align properly - No weird gaps or overlaps
  • Colors look good - Brand colors are consistent
  • Fonts are readable - Text size is appropriate
  • Images are high quality - No blurry or pixelated images
  • Spacing looks natural - Not too cramped or too spread out

Responsive Design

  • Desktop looks good - Full-width browser window
  • Tablet works well - Medium-width browser window
  • Mobile is functional - Narrow browser window or actual phone
  • Touch targets are big enough - Buttons easy to tap on phone
  • Text is readable - Not too small on mobile devices

Functionality Test

  • All buttons work - Click every call-to-action button
  • Forms submit properly - If you have contact forms
  • Videos play correctly - Test embedded videos
  • FAQ sections expand - If using FAQ sections
  • Links open correctly - Internal vs external link behavior

[Screenshot: Preview testing on different devices]

Publishing Your Page

First-Time Publishing

If this is a new page:

  1. Complete your preview testing
  2. Go back to WordPress page editor
  3. Set page status to "Published"
  4. Choose visibility (Public, Private, or Password Protected)
  5. Set publication date (now or schedule for later)
  6. Click "Publish"

Updating Existing Pages

If updating a page that's already live:

  1. Make your changes in Promptless WP editor
  2. Save your changes in the editor
  3. Preview to verify everything looks correct
  4. Go to WordPress page editor
  5. Click "Update" to make changes live

Publishing Workflow

Recommended steps:

  1. Build content in Promptless WP editor
  2. Save frequently while building
  3. Preview when sections are complete
  4. Test on multiple devices
  5. Fix any issues you find
  6. Final preview check
  7. Publish or update in WordPress

[Screenshot: WordPress publishing interface]

Cache and Performance Considerations

Browser Cache

What it is: Your browser stores copies of images and files Why it matters: You might not see changes immediately Solution:

  • Refresh with Ctrl+F5 (Windows) or Cmd+Shift+R (Mac)
  • Use private/incognito browsing for testing
  • Clear browser cache if changes don't appear

Plugin Caching

What it is: Caching plugins store page copies for speed Why it matters: Changes might not appear on live site immediately Solution:

  • Clear cache after publishing
  • Check with cache plugin for clearing options
  • Wait a few minutes for automatic cache updates

CDN Caching

What it is: Content delivery networks cache your site globally Why it matters: Changes may take longer to appear worldwide Solution:

  • Clear CDN cache if you have one
  • Wait for cache expiration (usually 24 hours max)
  • Test from different locations or use online tools

Troubleshooting Preview Issues

Preview Doesn't Match Editor

Possible causes:

  • Display mode setting (Canvas vs Fullwidth)
  • Theme conflicts with section styling
  • Cache not cleared
  • Changes not saved properly

Solutions:

  1. Check display mode in WordPress page editor
  2. Clear all caches and refresh
  3. Save changes again in editor
  4. Contact support if issues persist

Preview Shows Errors

Possible causes:

  • Missing required content in sections
  • Invalid image or video URLs
  • Theme compatibility issues
  • JavaScript conflicts

Solutions:

  1. Check for orange/red section indicators
  2. Fix missing content or broken media
  3. Test with default theme temporarily
  4. Disable other plugins to test conflicts

Mobile Preview Problems

Possible causes:

  • Theme not responsive
  • Custom CSS overrides
  • Images too large
  • Text too small

Solutions:

  1. Test with mobile device (not just narrow browser)
  2. Check theme responsiveness
  3. Optimize images for mobile
  4. Adjust text sizes in global settings

[Screenshot: Common preview issues and solutions]

SEO and Publishing

SEO Considerations

Before publishing, consider:

  • Page title - Set in WordPress page editor
  • Meta description - Use SEO plugin or WordPress settings
  • URL slug - Make it descriptive and clean
  • Image alt text - Add descriptions for all images
  • Internal links - Link to other pages on your site

Social Media Preview

Your page will be shared on social media:

  • Featured image - Set one for social media previews
  • Page title and description - How it appears when shared
  • Open Graph tags - Use SEO plugin for better control

Search Engine Indexing

  • Make sure page is public if you want it found in search
  • Submit to Google Search Console for faster indexing
  • Create XML sitemap with SEO plugin
  • Monitor search performance over time

Publishing Best Practices

Pre-Launch Checklist

  • Content is final - All text and images approved
  • Links are tested - No broken internal or external links
  • Mobile experience is good - Test on actual devices
  • Page loads quickly - Check speed with online tools
  • SEO is optimized - Title, description, images have alt text

Post-Launch Monitoring

  • Check analytics - Monitor page performance
  • Test regularly - Ensure everything still works
  • Update content - Keep information current
  • Monitor comments/feedback - Address user issues
  • Track conversions - See if page meets goals

Version Control

  • Save before major changes - Always have a backup plan
  • Document changes - Keep notes on what you changed
  • Test staging site - If available, test changes first
  • Schedule updates - Don't make changes during busy times

Common Publishing Questions

"Why don't I see my changes on the live site?"

  • Make sure you clicked "Save Changes" in the editor
  • Make sure you clicked "Update" in WordPress
  • Clear your browser cache and any site caching
  • Wait a few minutes for changes to propagate

"Can I preview before publishing?"

Yes! Use the Preview button to see exactly how your page will look before making it live.

"How do I unpublish a page?"

In WordPress page editor, change status from "Published" to "Draft" and click "Update".

"Can I schedule publication for later?"

Yes! In WordPress page editor, click "Edit" next to "Publish immediately" and set a future date.

Next Steps

Now that you understand preview and publishing:

  1. Practice with test pages before building important ones
  2. Learn about Section Types for better content
  3. Explore AI Features to speed up content creation
  4. Master the Design System for professional styling

Need More Help?

Remember: always preview your work before publishing, and don't be afraid to make updates after your page is live!