Introduction to Silverstripe - Content Management System (CMS)

The following pages will give you an overview of the Silverstripe CMS. The slides are not meant to cover everything or show-off the advanced features of Silverstripe, but instead focus on commonly asked questions and basic functionality (“how do I edit a page?”, “how do I add an image?”, “where can I administer the users?”)

1

Logging in @ http://demo.silverstripe.com/admin/

2

Username: “admin”, Password: “Password”

Orientation: the main tabs

3

Main site options:

“Site Content”add/edit/delete pages.

“Files & Images”Storage and editing area for images, pdfs, flash (video) files, word documents, and all other files.

“Comments”If the comments module is enabled then this is where you manage comments (e.g. mark as spam)

“Reports” Custom reports can be accessed here (e.g. product sales)

“Security”All users (logged-in visitors to your site) can be managed here (e.g. add/remove permissions, add new user, review and change their details).

“Help”Hopefully you will not need this after you have read this presentation.

NOTE: some sites will have more options available for customised content (e.g. a tab for administering a list of cities).

SITE CONTENT: getting to the right page

4

Create, search or batch process pages (e.g. mass-delete or mass-publish).

Click on any of the pages to view details. The layout usually matches your site’s menu, clicking on a plus will show second-tier (child) pages – e.g. click on the plus next to ecommerce to find individual products for sale.

Click on this box first if you want to move page (drag and drop).

“Page Version History”After selecting a page, you can open this slide to see previous versions of the page (and revert back to them if required).

“Site Reports”This is another way to find pages (e.g. one report shows pages edited in the last two weeks).

SITE CONTENT: editing a page

5

Depending on the customisation of your site and the page type (e.g. home page, gallery page or blog page) you have selected, the tabs available will change. “Content” : is the main one and allows you to change page content (e.g. title).“Behaviour” : the attributes of the page such as its type and whether it is shown in the menu.“To Do” : make quick notes to yourself or other editors on what needs doing.“Reports” : any custom reports associated with the page.“Access” : who can view and who can edit the page?“Translations” : only available for websites that are translated into foreign languages.

For each selection that you make on the top-row (in this case “S ite Content”), different options will appear on the row below (in this case “Main” and “Metadata”)

The two most important fields for each page are “Page Name” and “Navigation Label”. They are usually the same, but you may want to opt for a shorter version of the navigation label if limited space requires a shorter name of the page in the menu.

SITE CONTENT: making changes

6

1. Select a page 2. Edit content (using buttons above for formatting ) or change any of the other fields on any of the tabs.

3. “Save” a draft or “Save and Publish” your changes to your live website.

SITE CONTENT: meta-data = important for Search Engine Visibility

7

1. URL is the actual website address (e.g. http://demo.silverstripe.com/terms-and-conditions). This is set automatically and usually does not need changing.

2. Choosing a quality Page Title is (which appears at the top of your browser window and not on the page itself) is important for Search Engine visibility (ask us how to write these)

3. Writing a description for your page is usually not that important, but also helps. Keywords are of little significance to Search Engines.

SITE CONTENT: Page behaviour

8

The format of your page will depend on the page type you choose (e.g. homepage, gallery page, blog page, etc…). You select this when creating a new page, but you can change it here.

“Show in Search” and “Show in Menus” are handy for hiding pages without making them inaccessible.

If this has been setup, you can add a comments section to your pages here. A comments section allows visitors to make a comment on the page they are viewing (e.g. ask a question or make a suggestion).

SITE CONTENT: Adding a new page

9

2. Select the page you want to add a new one “under” – that is, where do you want to add a page?

1. Click “Create”

3. Select page type (e.g. Page) and click “Go”.

SITE CONTENT: Publishing or Deleting Pages

10

To publish or delete a bunch of pages, click on “Batch Actions”. Next, select the pages and choose “Delete the selected pages” OR “Publish the selected pages”

To delete just one page, click on this button and then click again (it will ask you if you also want to delete the page from the published site).

After any page changes, of course don’t forget to “Save” (as a draft) OR “Save and Publish” (recommended). The CMS will warn you if you exit the page without saving.

SITE CONTENT: Moving a page

11

To move a page, select “allow drop and drag reordering” – and then click, hold and drag the page you want to move (drag the page). Once it is in the right position (blue lines and boxes will guide you), release the click button.

SITE CONTENT: Editing rich-formatted text with confidence

12

Never copy and paste from a rich text-format application (e.g. MS Word) without using these buttons forcing a text -only “Paste”.

Insert images and flash files (can load to “Files & Images” first).

Insert a link (highlight text first).

Make sure to select the right markup for each section (e.g. paragraph, heading 1, etc…). This is important for Search Engines.

Directly edit HTML. Manage tables.

Formatting matches typography format on live website.

SITE CONTENT: managing additional content

13

For most Silverstripe Websites, there are pages with customised content. Here is an example of a Product for the ecommerce shop. Tabs have been added to the content section:-Images – load an image for the product.-Variations – e.g. XL, L, M, S, XS-Product Groups – e.g. where does this product belong? Under toys, jewelry, collectibles, and/or antiques?Each page type can have different tabs with additional fields ranging from “extra images”, through to “comment managers”, through to additional fields for behaviour and content.

The icon indicates the page-type (in this case the icon for a product).

FILES AND IMAGES: Adding images – Step 1: selecting folder

14

This structure works similar to the page selector (Site Tree) in the “Site Content” section. Before adding files, make sure to create or select the right folder. Documents uploaded directly in the “Site Content” section or other parts of the website will be stored in “Uploads”. We recommend our clients to setup meaningful folders first.

FILES AND IMAGES: Adding images – Step 2: upload images

15

1. Choose an appropriate folder.

2. Select files from your own computer. They will appear below

3. Review selection AND click on “Upload Files Listed Below”.

FILES AND IMAGES: Adding images – Step 3: review

16

Click on the image to edit.

“Drag” to alternative folder.

Search for files in this folder.

Change name of folder

For more questions, please contact us …

17

Thank you