Silverstripe Overview

Getting Started

Silverstripe CMS Overview

Silverstripe CMS is the content management system used to manage the pages, images, documents, users, and other content on your website.

Typical areas include:

Pages

Manage website pages, page content, navigation, and page structure.

Files

Upload and organize images, PDFs, and other website files.

Reports

Review available website reports, such as broken links or pages without content. Available reports vary by website.

Security

Manage CMS users, groups, and permissions.

Settings

Manage available website-wide settings.

Your website may also include custom sections for blog posts, forms, products, locations, team members, resources, events, or other content.

Logging In

1. Visit yourwebsite.com/admin.
2. Enter your email address and password.
3. Select Log In.

Only select “Keep me signed in” on a private computer that you control.

If you forget your password, use the password reset option on the login screen.

Each person who needs CMS access should have their own account. Avoid sharing CMS accounts between staff members.

Managing Pages

Editing Page Content

1. Select Pages from the CMS menu.
2. Find and select the page you want to edit.
3. Edit the appropriate content fields. Depending on your website, these may include:
   • Page Name
   • Navigation Label
   • Content
   • Images
   • Buttons or Links
   • Advanced Content
   • Content Blocks
   • Search Engine Optimization fields
   • Page-specific settings
4. Select Save to save your changes as a draft.
5. Preview your changes before publishing.
6. Select Publish when the page is ready to appear on the live website.
7. Open the live page after publishing and check your work.

Previewing Your Changes

Silverstripe may allow you to switch between several editing and preview modes.

Edit Mode

Shows the CMS editing fields.

Split Mode

Shows the editor and website preview side by side.

Preview Mode

Shows a larger preview of the page.

You may also be able to switch between the Draft and Published versions of the page.

Draft vs. Published Content

Silverstripe separates draft content from the content visitors see on the live website.

Save

Stores your changes in the CMS as a draft.

Publish

Makes the current version available on the live website.

Draft

The page has not yet been published.

Modified

The published page has additional draft changes that have not been published.

Published

The live website contains the current published version.

This allows you to make changes, preview them, and have another staff member review them before publishing.

Creating a New Page

1. Select Pages from the CMS menu.
2. Select Add New.
3. Choose where the page should be located.
4. Select the appropriate Page Type.
5. Select Create.
6. Enter the page name and content.
7. Review the page URL and navigation settings.
8. Save and preview the page.
9. Select Publish when the page is ready to go live.

Top Level

Creates the page at the top level of the website structure.

Under Another Page

Creates the page as a child or subpage of another page.

Creating a top-level page does not always mean it should appear in your main navigation. Navigation behavior depends on your website design and page settings.

Page Types

Silverstripe supports different page types. A standard Page is typically used for general website content.

Other page types may include:

• Blog or News Article
• Form
• Landing Page
• Staff Page
• Location
• Event
• Product
• Redirect
• Resource
• Error Page

The available page types depend on how your website was developed.

Different page types may contain different editing fields and functionality.

Avoid changing the page type of an existing page unless you understand how the new page type works. Changing page types can affect available content fields and page functionality.

Moving and Reordering Pages

Pages can usually be moved within the Pages section by dragging them within the page tree.

You may:

• Reorder pages within the same section
• Move a page underneath another page
• Move a subpage to the top level

Changing the location of a page may also change its URL.

After moving a page, publish the page so the new structure appears on the live website.

Before making major navigation changes, consider how the change will affect visitors, search engines, internal links, and bookmarked URLs.

Unpublishing a Page

If you temporarily need to remove a page from the public website:

1. Select the page.
2. Open the publishing options.
3. Select Unpublish.

The page will remain in Silverstripe as a draft but will no longer appear on the live website.

If the page is no longer needed, your site may also provide an option to archive it.

Unpublishing or archiving is usually preferable to permanently deleting content that may be needed later.

Restoring an Earlier Version

Silverstripe stores page versions when content is saved or published.

If you need to recover older content:

1. Open the page.
2. Select the History tab.
3. Review previous versions.
4. Preview the version you want.
5. Select Revert to this Version.
6. Review the restored content.
7. Publish it if you want the restored version to appear on the live website.

Reverting creates a draft first. It does not immediately overwrite the live website.

Managing Images and Files

Working With Images and Files

Images and documents can be managed from the Files section.

Whenever possible, organize files into logical folders instead of uploading everything into one directory.

Example folders might include:

• Team
• Blog
• Products
• Events
• Locations
• Resources
• Page Banners
• 2026

File Naming Best Practices

Use file names that describe the content.

Good File Names

• erie-office-exterior.webp
• community-health-event.webp
• industrial-hose-testing.webp

Avoid

• IMG_4829.webp
• final-image-2.webp
• screenshot123.png

Clear file names make the Files area easier to manage and make it easier for other staff members to identify the correct file.

Image Format Best Practices

Werkbot recommends the following order for website images.

1. WebP or SVG

Use WebP for most photographs and standard website graphics. WebP typically provides very good image quality with a smaller file size than JPEG or PNG.

SVG may be appropriate for logos, icons, or other vector graphics if your website has been configured to support SVG files.

2. JPEG or JPG

Use JPEG when WebP is unavailable or when an existing workflow requires JPEG.

JPEG works well for photographs but should still be compressed before uploading.

3. PNG

Use PNG only when it provides something you need, such as transparency or lossless image detail.

PNG files can become very large and should not be the default format for photographs.

Avoid uploading large, uncompressed images directly from a phone, camera, stock photography website, or graphic design program.

Image Size and Performance

Large images can significantly affect how quickly a page loads.

Resize and compress images before uploading them.

As a general guide:

• Full-width banners and marquee images may require images around 1920 pixels wide.
• Standard page images typically do not need to be larger than approximately 1200 to 1600 pixels wide.
• Images displayed in smaller cards or grids may require even less.

Do not upload a 5000-pixel-wide photograph when the image will only display at 600 pixels wide.

A useful guideline is to provide an image approximately 1.5 to 2 times the size at which it normally displays. This provides enough resolution for high-density screens without unnecessarily large files.

For standard content images, try to keep compressed files below approximately 250 KB when practical.

For large banners or marquee images, try to remain below approximately 500 KB when practical.

These are guidelines rather than strict limits. Image quality, dimensions, and subject matter can affect the final file size.

Keep Image Ratios Consistent

Image consistency has a major effect on how polished a website looks.

When images appear beside one another, use the same aspect ratio.

4:3 Ratio

• 1200 × 900
• 1000 × 750
• 800 × 600

16:9 Ratio

• 1600 × 900
• 1280 × 720

3:2 Ratio

• 1500 × 1000
• 1200 × 800

The pixel dimensions can change while the ratio remains the same.

For example, three staff photos displayed together will look more consistent if every image uses the same ratio.

Avoid mixing a tall portrait image, square image, and wide horizontal image within the same row of cards unless the website design specifically calls for it.

Consistent image ratios help maintain:

• Consistent card heights
• Predictable cropping
• Cleaner page layouts
• Better mobile layouts
• A more professional visual presentation

When replacing an existing image, use the existing image's dimensions and ratio as a reference.

Image Cropping

Consider where an image will appear before cropping it.

For banner images, keep important people and objects away from the extreme edges of the photograph. Responsive website layouts may crop some portions of the image on different screen sizes.

Avoid placing important text inside an image.

Text should usually be added as website content instead. Website text is easier to read, search, translate, resize, and access with assistive technology.

Image Alt Text

Images that communicate meaningful information should include alternative text.

Alt text helps visitors who use screen readers understand the purpose or content of an image.

Good Alt Text

• Students working together in the university engineering lab
• Snap-tite industrial hose connected to a municipal fire hydrant
• Family walking through the entrance of the community center

Avoid

• image
• photo
• picture1
• IMG_5932

Do not start every description with “Image of” or “Photo of.” A screen reader already identifies it as an image.

Keep alt text concise and describe what matters in the context of the page.

Do not stuff keywords into alt text for SEO.

Decorative images that communicate no meaningful information may use empty alternative text when the CMS and website design support it.

Adding an Image to Page Content

1. Place your cursor where the image should appear.
2. Select the image or Files button.
3. Choose an existing image or upload a new image.
4. Review the image information.
5. Add meaningful alt text when appropriate.
6. Select Insert.
7. Save the page.
8. Preview the page on desktop and mobile layouts before publishing.

Working With Documents

PDFs and other downloadable documents can be uploaded through Files.

Before uploading a document:

• Use a descriptive file name.
• Make sure the document is the final approved version.
• Check the file size.
• Confirm the document itself is accessible whenever possible.

Avoid uploading multiple files named things such as:

• brochure-final.pdf
• brochure-final2.pdf
• brochure-new-final.pdf

A better naming structure would be:

• 2026-membership-brochure.pdf

When replacing a document that is already linked from multiple places, check how the Files section handles the existing file before uploading a duplicate.

Content Best Practices

Write for Scanning

Website visitors often scan content before reading it closely.

Break long content into:

• Short paragraphs
• Clear headings
• Bulleted lists
• Numbered lists
• Calls to action

Avoid large blocks of uninterrupted text.

Use Meaningful Headings

Use headings to organize content, not to change the appearance of text.

The page title normally serves as Heading 1.

Major sections should use Heading 2.

Sections within a Heading 2 may use Heading 3.

Example Heading Structure

Heading 1: Business Banking
Heading 2: Business Checking Accounts
Heading 3: Account Features
Heading 2: Business Loans

Do not jump from Heading 2 directly to Heading 4 simply because you prefer how Heading 4 looks.

Keep Formatting Simple

The website has been designed with established fonts, colors, button styles, spacing, and headings.

Use the styles built into the website instead of manually changing font sizes, colors, or spacing.

Consistency helps protect the website's visual design and accessibility.

Pasting Content

Copying directly from Word, Google Docs, email, or another website can bring unwanted formatting into the CMS.

Whenever possible, paste content as plain text and apply the correct website formatting within Silverstripe.

After pasting content, check:

• Headings
• Paragraph spacing
• Lists
• Links
• Bold text
• Special characters
• Extra line breaks

Link Best Practices

Links should tell visitors where they will go.

Avoid

• Click Here
• Learn More
• Read More
• More Info

Better

• View Checking Account Options
• Read the 2026 Annual Report
• Explore Our Manufacturing Services
• Download the Patient Registration Form
• Visit the Erie Office Location

Meaningful links improve usability, accessibility, and search engine understanding.

When linking to another page on your website, use Silverstripe's internal page linking option when available instead of manually copying the URL.

Avoid opening links in a new window unless there is a specific reason to do so.

Buttons and Calls to Action

Use the website's built-in button options when available.

Button text should describe the action.

Examples

• Request a Consultation
• View Available Positions
• Download the Guide
• Register for the Event
• Contact Our Team

Avoid manually creating button-like text using colors, bold formatting, or oversized fonts.

Paragraphs and Spacing

Use normal paragraph breaks to separate ideas.

Do not use repeated returns or blank paragraphs to create large spaces between sections.

Do not manually add spaces to align text.

The website's stylesheet controls spacing and layout across desktop, tablet, and mobile devices.

Text Formatting

Use bold text sparingly to emphasize important information.

Avoid underlining text unless it is a link. Visitors commonly interpret underlined text as clickable.

Avoid writing long sections in all caps.

Avoid changing text colors manually.

Avoid excessive exclamation points.

Use one space after a period.

Search Engine Optimization Best Practices

Page Names

Use page names that clearly describe the subject of the page.

Better

• Commercial Banking Services
• Volunteer Opportunities

Less Descriptive

• Services
• Get Involved With Us Today

Page URLs

Silverstripe normally creates the page URL from the page name.

Keep URLs:

• Short
• Descriptive
• Lowercase
• Easy to understand

Avoid changing the URL of an established page without a reason. Changing URLs can affect search rankings, bookmarks, advertising, and external links.

Meta Descriptions

Where available, provide a unique meta description for important pages.

The description should briefly explain what visitors will find on the page.

Focus on clarity rather than repeating keywords.

A useful target is approximately one or two concise sentences.

Page Content

Give each page a clear subject.

Include the primary topic naturally within:

• The page title
• The introductory content
• Relevant subheadings
• The body copy

Write for your visitor first. Avoid repeating phrases simply to influence search rankings.

Accessibility Best Practices

Content editors play an important role in maintaining website accessibility.

When editing the site:

• Use headings in the correct order.
• Provide meaningful alt text.
• Use descriptive link text.
• Keep text as text instead of placing important information inside images.
• Use real bulleted and numbered lists.
• Do not communicate meaning through color alone.
• Avoid manually changing text colors.
• Provide captions or transcripts for important video and audio content.
• Make PDFs and downloadable documents accessible whenever possible.
• Use tables for actual tabular data rather than page layouts.
• Keep instructions clear and concise.

Accessibility should be considered every time new content is added to the website.

Blog and News Content

Adding a Blog or News Article

If your website includes a Blog, News, or Article section:

1. Navigate to the appropriate section.
2. Select Add Article, Add Post, or the corresponding option.
3. Complete the available fields. These may include:
   • Article Title
   • Author
   • Publication Date
   • Categories
   • Tags
   • Featured Image
   • Summary
   • Article Content
   • Search Engine Optimization fields
4. Upload a properly sized and compressed featured image.
5. Use the same image ratio as other articles on the website.
6. Save the article.
7. Preview it.
8. Publish when ready.

Avoid creating new categories or tags that are nearly identical to existing ones. Consistent categorization keeps the website easier to manage.

Managing CMS Users

Adding or Editing Users

Administrator permissions are required to manage users.

1. Select Security.
2. Open Users.
3. Select an existing user or select Add Member.
4. Enter or update the user's information.
5. Assign the appropriate group or permissions.
6. Save the user.

Each user should have their own account.

Give users only the permissions they need.

Do not give every CMS user full Administrator access.

Remove or disable accounts when staff members no longer need access.

Use multi-factor authentication if it has been enabled for your website.

Website-Specific Features

Your Silverstripe website may contain additional functionality developed specifically for your organization.

Examples include:

• Advanced Content
• Content Blocks
• Forms
• Products
• Coupons
• Events
• Locations
• Staff
• Directories
• Resources
• Memberships
• Applications
• E-commerce
• Integrations

These features are not identical across every Silverstripe website.

Follow the website-specific instructions supplied by Werkbot for these sections.

Before You Publish

Take a minute to review the page before making changes live.

Pre-Publish Checklist

• Is the page title correct?
• Are the headings in a logical order?
• Are paragraphs easy to scan?
• Are links descriptive?
• Do all links work?
• Are images compressed?
• Are image ratios consistent with nearby content?
• Do meaningful images have alt text?
• Does the page look correct on desktop?
• Does the page look correct on mobile?
• Are there spelling or grammar errors?
• Is any unfinished or internal information visible?
• Does the call to action work?
• Are SEO fields complete when appropriate?

When everything looks correct, publish the page and review the live website.

Ongoing Website Maintenance

Keeping a website organized is easier than cleaning it up later.

As you manage content:

• Use consistent page naming.
• Use consistent image ratios.
• Organize the Files library.
• Avoid unnecessary duplicate files.
• Archive outdated pages.
• Remove expired events and promotions.
• Review old staff information.
• Check old documents and PDFs.
• Maintain meaningful page titles and meta descriptions.
• Check the website for broken links.
• Review content for accuracy.
• Continue following accessibility standards when adding new content.

A well-maintained CMS helps your website remain professional, accessible, searchable, and easier for your team to manage.

Website-Specific Image Standards

Each website may have different recommended image dimensions. These sizes provide a good starting point for most Werkbot websites.

Maintaining a consistent aspect ratio is often just as important as using the exact pixel dimensions.

Homepage Marquee

Recommended size:
1920 × 1080 pixels

Recommended ratio: 16:9

Use a large, high-quality horizontal image. Keep the primary subject near the center because portions of the image may be cropped at different screen sizes.

Page Title Banner

Recommended size:
1920 × 800 pixels

Recommended ratio: approximately 12:5

Page title banners are generally shorter than homepage marquee images. Choose images that work well with a wide crop.

Standard Content Image

Recommended size:
1200 × 900 pixels

Recommended ratio: 4:3

A 4:3 ratio works well for most standard page photography and provides a consistent format across the website.

Card or Tout Image

Common recommended sizes:

• 1200 × 900 pixels, 4:3 landscape
• 900 × 1200 pixels, 3:4 portrait
• 900 × 900 pixels, 1:1 square

Use the same ratio for every image within the same group of cards or touts. Avoid mixing landscape, portrait, and square images within one row unless the design specifically calls for it.

Blog or News Featured Image

Common recommended sizes:

• 1200 × 900 pixels, 4:3 landscape
• 900 × 1200 pixels, 3:4 portrait
• 900 × 900 pixels, 1:1 square

Choose one ratio for your blog or news section and use it consistently for every featured image.

Product Image

Common recommended sizes:

• 1200 × 900 pixels, 4:3 landscape
• 900 × 1200 pixels, 3:4 portrait
• 1200 × 1200 pixels, 1:1 square
• 900 × 900 pixels, 1:1 square

For product grids, square images are often the easiest format to maintain consistently. Keep products centered and use a similar amount of space around each product.

Use these dimensions and ratios whenever replacing or adding images to these areas.

Need Help?

If you are unsure whether a CMS change could affect website functionality, navigation, accessibility, or existing content, contact Werkbot before publishing the change.

Werkbot
(814) 461-1322