Overview

The GetSite Website Editor provides a powerful interface for modifying your website content. It combines visual editing capabilities with code editing options, allowing users of all skill levels to customize their websites effectively.

Editor Interface

The editor interface consists of several key components:

  • Visual Editor: View and modify specific sections of your website
  • Code Editor: Direct HTML, CSS, and JavaScript editing
  • Preview Pane: Real-time preview of your website
  • Responsive Preview: Test your site on different device sizes

Key Features

Visual Editing

The visual editor allows you to modify your website without writing code:

  • Text Editing: Edit text content directly on the page
  • Image Manipulation: Resize, crop, and replace images
  • Style Controls: Adjust colors, fonts, and other visual properties

Code Editing

For more advanced users, the code editor provides direct access to your website’s code:

  • HTML Editing: Modify your website’s structure
  • CSS Editing: Customize styling and appearance
  • JavaScript Editing: Add interactive functionality
  • Syntax Highlighting: Color-coded code for easier editing
  • Auto-completion: Intelligent code suggestions

Real-time Preview

See your changes immediately with the real-time preview feature:

  • Live Updates: Changes appear instantly in the preview
  • Device Previews: See how your site looks on different devices
  • Interactive Testing: Test functionality directly in the preview

Usage Instructions

1

Access the Editor

From your dashboard, select a website and click “Edit” or click on the edit icon next to any website.

2

Choose Editing Mode

Select either visual editing mode or code editing mode based on your preference and requirements.

3

Make Changes

Use the appropriate tools to modify your website’s content, design, or functionality.

4

Preview Changes

Use the preview pane to see how your changes will look on the live site.

5

Save and Publish

Click “Save” to store your changes and “Publish” to make them live on your website.

Best Practices

  • Regular Saves: Save your work frequently to prevent loss of changes
  • Mobile Testing: Always check how your site looks on mobile devices
  • Code Organization: Keep your custom code organized and commented
  • Performance Optimization: Be mindful of image sizes and script loading
  • Backup Before Major Changes: Create a backup before making significant changes