Pixelesq Logo
Pages

Edit pages

Learn how to edit and customize existing pages in Pixelesq. Update content, adjust layouts, and refine SEO settings to ensure your site stays fresh and engaging, all without writing code.

Overview

After creating a page in Pixelesq, you can easily edit, reorganize, or enhance its content to keep your site up to date. This guide covers the essential steps to modify text, images, sections, and layout options using Pixelesq’s intuitive no-code editor.


Accessing the Page Editor

  1. Navigate to the Pages Section

    • From your Pixelesq dashboard, click Pages in the sidebar.
    • You’ll see a list of all existing pages.
  2. Select the Page to Edit

    • Click on the page title (e.g., “Home,” “Services,” “Blog”) you want to modify.
    • The Page Editor opens, displaying an interactive preview of your page.
  3. Explorer View vs. Preview

    • On the left, you’ll find the explorer (sidebar) with the UIslices (sections) composing the page.
    • On the right (or center), a live preview updates as you make changes.

Editing Content

Text & Headings

  • Click a Text Block:
    Simply select a heading or paragraph in the explorer or directly on the preview.
  • Modify Content:
    A small toolbar or panel will appear, allowing you to change fonts, colors, or alignment and update the text itself.
  • Add Hyperlinks:
    Highlight text and choose the link icon to create a hyperlink to another page or external URL.

Images & Media

  • Replacing Images:
    Click the image placeholder in the preview or sidebar. You’ll see an option to “Change Image” or “Replace”.
    • Browse your existing library or upload a new file.
  • Adjusting Image Properties:
    Some images let you edit settings like alt text, scaling, or crop to ensure the best presentation.

Buttons & CTAs

  • Edit Labels and Links:
    Select the button or call-to-action block. Change the text (e.g., “Learn More”) and set the URL.
  • Style and Layout:
    Depending on your theme, you can adjust button color, size, and placement.

Reordering or Removing Sections

Pages in Pixelesq are composed of UIslices—stackable, modular sections such as Hero, Features, Testimonials, or CTAs.

  1. Drag & Drop:
    In the left sidebar, click and hold a section to drag it above or below other sections. A highlight or guideline will indicate where it will land.
  2. Delete or Hide Sections:
    • To remove a section entirely, click the “Delete” or “X” icon (often in the section’s menu).
    • If your theme supports it, you may also find an option to temporarily hide (instead of delete) a section from public view.

Adjusting Layout

Layout Tab or Settings

Depending on your Pixelesq setup, you may see a Layout tab or panel. Here, you can:

  • Modify Spacing: Change padding and margins for each UIslice, text block, or image.
  • Alignment: Align content left, center, or right (useful for hero text blocks, images, etc.).
  • Responsive Controls: Toggle between Desktop, Tablet, and Mobile views to ensure the layout looks great on all devices.

Advanced Options (Optional)

  • Custom Classes or Styles: If you have coding knowledge or use a custom stylesheet, you can assign classes or inline styles for deeper customization.
  • Visibility Rules: Some themes let you show or hide specific sections based on the visitor’s device, user role, or other conditions.

Quick SEO Adjustments

Even though full publishing/SEO might be its own doc, you can still handle light SEO tasks while editing:

  • Meta Title & Description: Some page editors have an SEO or Settings button. Update these fields for better search visibility.
  • Open Graph & Social Preview: If available, set a preview image/title for sharing on social platforms.
  • URL Slug (If Allowed): If your doc or theme permits URL changes after creation, you can tweak the slug. However, be cautious if your page is already live.

Saving Changes

Depending on your Pixelesq version or plan, you’ll see options like Save, Save Draft, or Auto-Save:

  • Auto-Save: Some setups automatically keep track of your edits in real-time.
  • Manual Save: If needed, click Save or Apply to preserve changes.
  • Publish Later: If you haven’t published yet or prefer to hold changes in draft, simply exit. Your edits remain in draft form until you explicitly publish them.

Best Practices

  1. Focus on Clarity:
    Keep messaging concise and scannable. Most users skim pages, so use headings, short paragraphs, and bullet points.
  2. Reuse Partials:
    For site-wide elements (like headers or footers), consider using Partials so one change updates every page.
  3. Regularly Refresh Content:
    Outdated info hurts credibility. Schedule periodic reviews to ensure pages stay relevant.
  4. Preview on Multiple Devices:
    A clean desktop layout might need minor tweaks to look good on mobile or tablet.

Last updated on

On this page