Page Builder

Page Editor Overview

The page editor is where you customize your product landing pages. Interface overview: - Left sidebar — list of all sections on your page, drag to reorder - Center — live preview of your page as it will appear on Shopify - Inline editing — click any text in the preview to edit it directly - Floating toolbar — appears when you select text, with formatting and AI rewrite options - Right sidebar — section settings (background, padding, colors) when editing a section - Top bar — undo/redo buttons, publish button Click any section in the left sidebar to select it. Click the gear icon to open its settings panel. Toggle the eye icon to show/hide sections.

Available Sections

ProdUp offers 17 section types to build your pages. Product sections: - Hero — full-width banner with headline and CTA - Product Hero — product showcase with images and buy button - Feature Cards — grid of product features with icons - Product Features — detailed feature highlights - Use Cases — show how the product is used Social proof: - Reviews Grid — customer reviews in a grid layout - Review Highlight — featured single review - Testimonial — customer quote with photo - Quote — standalone quote block - Stats — key numbers (e.g., "10,000+ sold") - Badge Cloud — trust badges and certifications - Trust Strip — logos of press mentions or partners - Image Marquee — scrolling image carousel Content: - FAQ — expandable questions and answers Navigation: - Header — site header with logo and navigation - Footer — links and branding - Announcement Bar — top banner for promotions

Adding, Reordering, and Removing Sections

Manage your page sections from the left sidebar. To add a section: 1. Click the + button in the sections list 2. Browse available section types 3. Click a section to add it to your page To reorder sections: - Drag and drop sections in the left sidebar to change their order To hide/show a section: - Click the eye icon next to a section to toggle its visibility - Hidden sections won't appear on the published page To remove a section: - Click the section's menu (three dots) - Select Delete Sections are added with AI-generated content based on your product. You can edit everything after adding.

Editing Text and Images

Edit content directly in the live preview. Text editing: 1. Click any text element in the preview 2. Edit it inline — just type 3. A floating toolbar appears with formatting options 4. Use the AI rewrite button in the toolbar to rewrite with AI AI rewrite styles: - Professional, Casual, Luxury, Technical - Or generate fresh text from your product title Image editing: 1. Click any image in the preview 2. An image picker opens 3. Choose from your product images or upload a new one 4. Click to replace the image Changes save automatically as you edit.

Section Settings and Styling

Customize each section's appearance from the settings panel. To open settings: 1. Click a section in the left sidebar 2. Click the gear icon to open the settings panel Available settings: Section layout: - Background color — set any color - Padding — top, bottom, left, right spacing - Border — color and width - Max width — constrain content width Element controls (vary by section type): - Color theme — primary or secondary colors - Font sizes — heading and body text - Spacing — gaps between elements - Columns — grid layout options - Show/hide elements — toggle specific parts on/off Settings changes appear instantly in the live preview.

Header, Footer, and Announcement Bar

These global sections appear on every page. Header: - Logo — upload SVG, PNG, or WebP (max 2MB) - Navigation — synced from your Shopify store's menus - Appears at the top of every page Footer: - Links — add footer navigation links - Branding — customize text and layout - Appears at the bottom of every page Announcement Bar: - Text — promotional message displayed at the very top - Great for sales, free shipping notices, or limited offers - Toggle visibility on/off These sections are shared across all your pages. Editing them on one page updates them everywhere. Logo requirements: - Formats: SVG, PNG, WebP - Max file size: 2MB - SVG recommended for best quality