Website Editor

Editing content on your website using the Pages Editor

Accessing the Page Editor

Open the Pages Section

1. Scroll down on the left navigation of your Spillover Command Center and click "Pages".

2. You will see all your website pages listed.  You can add new pages, edit existing pages, copy old pages, and edit SEO settings.


3. In the Main Page settings you will see the Page Title, Page URL, and Schedule publish.
(If you are adding a new page these fields will be blank and you should enter a Page Title. The Page URL will be created by default (but can be edited). 


4. Beneath the Main Settings, you will see one (or more) content boxes displayed. Select an element inside the content box to start editing.
When making extensive edits we recommend copying the source code to a text editor before making changes so you can revert if needed.


Working with Page Elements

Adding and Editing New Elements

5.  Adding and Editing New Elements
  1. Content - Drag and drop elements to add to the Page Content
  2. Settings - Settings for the element selected in the Page Content area
  3. Sections - Premade styled sections to drag and drop into the Page Content area
  4. Layers - Hierarchy of page elements
      



Content Elements

  1. Paragraph:
    1. Inserts a block of text.
    2. Used for writing paragraphs of content.
  2. Text:
    1. Adds plain text.
    2. Used for inserting a single line or small block of text.
  3. Image:
    1. Inserts an image.
    2. Used to display an image uploaded from your device or selected from the Media Library.
  4. Div:
    1. Adds a division or container.
    2. Used for grouping elements together for styling or scripting purposes.
  5. Link:
    1. Adds a hyperlink.
    2. Used to create clickable links that direct visitors to another page or website.
  6. Anchor:
    1. Inserts an anchor.
    2. Used to create a specific point on the page that can be linked to from another location.
  7. Button:
    1. Inserts a button.
    2. Used to create an interactive element that can link to another page or trigger an action.
  8. Button Group:
    1. Adds a group of buttons.
    2. Used to display multiple related buttons together.
  9. Heading:
    1. Inserts a heading.
    2. Used to create headings from H1 to H6 and organize content hierarchically.
  10. List:
    1. Inserts a list.
    2. Used to create an ordered or unordered list of items.
  11. List Item:
    1. Adds an item to a list.
    2. Used to add an individual item within an ordered or unordered list.
  12. Table:
    1. Inserts a table.
    2. Used to display information in rows and columns.
  13. Card:
    1. Adds a card element.
    2. Used to present related content in a visually distinct section.
  14. Gallery:
    1. Inserts an image gallery.
    2. Used to display multiple images together in an organized layout.
  15. Events Calendar:
    1. Inserts an events calendar.
    2. Used to display events, meetings, or other important dates.
  16. Form:
    1. Adds a form.
    2. Used to collect information or submissions from website visitors.
  17. Custom Code:
    1. Provides an option to insert custom code.
    2. Used to add custom HTML, CSS, JavaScript, or other functionality.
  18. Video:
    1. Inserts a video.
    2. Used to embed and display video content on the page.



Layout Elements

  1. Container:
    1. Inserts a container element.
    2. Used for grouping and structuring content within the page layout.
  2. Row:
    1. Adds a row within a container.
    2. Used to arrange columns and other elements horizontally.
  3. Column:
    1. Adds a column within a row.
    2. Used to divide a row into separate sections for content.
  4. Content Section:
    1. Inserts a content section.
    2. Used to create a structured section for grouping related page content.



Main Widgets

  1. Hours:
    1. Inserts the business hours widget.
    2. Used to display the hours entered in the Business Center.
  2. Address:
    1. Inserts the business address widget.
    2. Used to display the complete address entered in the Business Center.
  3. Phone:
    1. Inserts the business phone number widget.
    2. Used to display the phone number entered in the Business Center.
  4. FAQ:
    1. Inserts the FAQ widget.
    2. Used to display frequently asked questions and answers from information entered in the Business Center.
  5. Social Row:
    1. Inserts a row of social media links.
    2. Used to display the available social media accounts entered in the Business Center.



Secondary Widgets

  1. Email:
    1. Inserts the business email address.
    2. Used to display the email address entered in the Business Center.
  2. Email-Phone:
    1. Inserts the business email address and phone number.
    2. Used to display both contact methods together.
  3. Special Hours:
    1. Inserts the business's special hours.
    2. Used to display temporary, holiday, or date-specific hours.
  4. Long Hours:
    1. Inserts an expanded version of the business hours.
    2. Used to display each day's hours in a longer format.
  5. Street Address:
    1. Inserts the street portion of the business address.
    2. Used to display the street address separately from the city, state, and ZIP Code.
  6. City:
    1. Inserts the city from the business address.
    2. Used to display the city as an individual element.
  7. State:
    1. Inserts the state from the business address.
    2. Used to display the state as an individual element.
  8. ZIP Code:
    1. Inserts the ZIP Code from the business address.
    2. Used to display the ZIP Code as an individual element.
  9. Country:
    1. Inserts the country from the business address.
    2. Used to display the country as an individual element.

Social Widgets

  1. Facebook:
    1. Inserts a link to the business's Facebook page.
    2. Uses the Facebook URL entered in the Business Center.
  2. Instagram:
    1. Inserts a link to the business's Instagram profile.
    2. Uses the Instagram URL entered in the Business Center.
  3. X:
    1. Inserts a link to the business's X profile.
    2. Uses the X URL entered in the Business Center.
  4. Google:
    1. Inserts a link to the business's Google profile.
    2. Uses the Google URL entered in the Business Center.
  5. Yelp:
    1. Inserts a link to the business's Yelp page.
    2. Uses the Yelp URL entered in the Business Center.
  6. Trip Advisor:
    1. Inserts a link to the business's Trip Advisor page.
    2. Uses the Trip Advisor URL entered in the Business Center.

Editing Existing Elements

Element Settings

6. Editing Elements: When editing an element you will see additional options on the element editor tab (paintbrush icon) e.g. screenshot of Text Editor options below.


Saving and Publishing

Preview and Publish

7. You can save and preview you changes before publishing.  Preview will generate a temp URL which you can click on to view the draft page. When you are happy with the changes click Publish Page to display the updates on your website.


8. If you have added a new page you will probably want to add a new navigation link:  How to add a Navigation Link

Additional Information

Out of Scope Areas

9.  Out of Scope Areas
NotesThere may be sections of your website pages that are not editable through Engage.  If you need to make an update to one of these sections please contact Support@spillover.com.

    • Related Articles

    • Using the new Email Editor

      To start designing the content of your email click on the Design Email Tab. If you have chosen to start with a blank template, your initial email body will display an empty row. Rows act as containers for content blocks. Simply drag and drop the ...

    • Website Management Tools Overview (Video)

      <br> Topics covered in this session: Adding a Home Page Popup message to your website Adding an event to your Website Events Calendar Making simple edits to your website pages e.g. editing About Us copy Making Simple ...

    • Website Analytics

      1. Click on Analytics in Website section of Navigation. 2. A Summary Report Displays. You can change the period, change the metric being reported and apply filters. You can also link to your Google Analytics Account. Additional Data is available such ...

    • Getting started with your Spillover Website Management Tools

      Viewing and Responding to Website Form Submissions Adding a Home Page Popup message to your website Adding an event to your Website Events Calendar Adding Blog/News Posts to your website Making simple edits to your website pages e.g. editing About Us ...

    • Adding an Event Calendar and/or Upcoming Events Feed to your website

      1. Create a new Page that you will display your Calendar on. Adding a new page to your website 2. Click on the content editor of your new webpage and drag and drop Events Calendar into the content section. Click Add. 3. Click Publish to save your ...