How to Use WPS Workbench Editing on macOS

Last updated:July 23, 2026

Use WPS Workbench Editing through 6 how-to topics covering opening the editor, switching device views, setting layouts, setting themes and backgrounds, managing page components, and saving, previewing, and publishing; 6 items are available without membership and 0 are membership-related.

How-to Index

How-to Guide

1. Open the Workbench Editor

Entry path: Enterprise Admin Console → Workbench Settings → Custom Workbench → Workbench Editor

  1. Click Admin Console in the left navigation pane.
  2. Click Workbench Settings in the left menu.
  3. Open the Custom Workbench tab.
  4. Find the workbench you want to edit and click Workbench Editor.

Success Criteria

  • Interface result: The workbench editing page opens.
  • Next action available: You can see entries for layout, theme settings, or component settings.

Tips While Using

  • Permissions: Appropriate enterprise admin permissions are required.
  • Network: If the admin page does not load correctly, check your network connection and account status.

2. Switch Device Views

Entry path: Workbench Editor → Desktop / Mobile tabs

  1. After opening the workbench editor, review the default Desktop editing view.
  2. To configure the mobile display, click the Mobile tab.
  3. Adjust the page content for the currently selected device view.

Success Criteria

  • Interface result: The editing area switches to the selected device view.
  • Next action available: You can continue with layout, theme, and component settings for desktop or mobile.

Tips While Using

  • Usage tip: Desktop and mobile can be configured separately, so confirm the current view before making changes.

3. Set the Page Layout

Entry path: Workbench Editor → Layout → Web Layout

  1. Click Layout in the left panel.
  2. In the Web Layout area, choose the layout you need.
  3. Select from single-column, double-column, mixed double-column, three-column, or mixed three-column layouts based on your page content.
  4. Review the live layout effect in the editing area.

Success Criteria

  • Interface result: The editing area shows the selected layout structure.
  • Next action available: You can continue adjusting themes and component content in the new layout.

Tips While Using

  • Common issue: After changing the layout, review component placement again to make sure it still fits the new column structure.

4. Set the Theme and Background

Entry path: Workbench Editor → Theme Settings

  1. Click Theme Settings in the left panel.
  2. In the web layout background area, choose a background color or background image.
  3. If you use a background color, click the color block or enter a color code.
  4. Select a built-in theme from the theme list.
  5. If needed, turn on Use Custom Background Image and upload an image.

Success Criteria

  • Interface result: The page background and theme style are updated.
  • Next action available: You can preview the overall page style or continue to component editing.

Tips While Using

  • Image requirements: Custom background images support jpg, png, and jpeg formats, with a maximum size of 3 MB.
  • Usage tip: Light mode and dark mode can be configured separately for different display scenarios.

5. Manage Page Components

Entry path: Workbench Editor → Component Settings

  1. Review the component list on the current page in the workbench editor.
  2. Click the component you want to adjust to enter its editing or configuration state.
  3. Maintain desktop or mobile component content based on the current device view.

Success Criteria

  • Interface result: The selected component content is updated or configured.
  • Next action available: You can continue editing other components or move to saving and previewing.

Tips While Using

  • Usage tip: After switching device views, check whether component content is displayed completely in each view.

6. Save, Preview, and Publish

Entry path: Workbench Editor → Save / Preview / Publish

  1. During editing, click Save at the top to save your current progress.
  2. To discard unsaved changes, click Reset.
  3. After editing, click Preview to review the actual display effect.
  4. When the page looks correct, click Publish to apply the configuration.

Success Criteria

  • Interface result: The page shows saved time information or the published live effect.
  • Next action available: Other users can refresh the workbench to view the updated page.

Tips While Using

  • Common issue: Save only stores editing progress. Publish is required before changes appear on the live workbench.
  • Usage tip: Preview before publishing so unconfirmed content is not applied directly.