Editing with Apostrophe CMS

Apostrophe is our new Content Management System.  It allows for the editing of our main NCSSM website.  Apostrophe uses in-context editing to simplify the editing experience while allowing for complex layouts and dynamic content. 

Login 

If you are a designated editor on our main website, you will be given access to it through My NCSSM. You can log in with your Google Email address and password. See how to log in to MyNCSSM here. Once you log in to My NCSSM, you are logged in to NCSSM.edu as well.

My Account Menu

If you have access to edit NCSSM.edu you will see this menu in the top left corner. Click the A to open the menu.

 

Editing Screen

Editing Text

Apostrophe uses in-context editing–a method for changing text, images, and links while viewing the content exactly as it will appear when published. It’s like previewing the content without pressing a preview button.

  1. To add text to the area, click the Pencil button which will activate the cursor and toolbar giving you basic text editing controls. Don’t see the pencil? Click the Eye Icon in the top right corner to remove additional icons.

  2. From here you can just start typing. Easy, right?

  3. When hovered, text elements show the rich text editor. Use it for formatting text and creating links. 

  4. Once you complete your changes, double-click outside of the text area, and the system will autosave. 

Note: Sometimes you see a pencil that lets you edit other elements like Edit Image shown above.

Rich Text Editor

  1. Highlight the text that you want to link.

  2. Select the link button.

  3. Select Link type. 

    1. For URL, type a web address (e.g. http://www.ncssm.edu )

    2. For email, type an email address.

  4. Click Done.

How to Single-Space Text

  1. Highlight the text that you want to be single-spaced.

  2. Select Normal from the Styles select list.

  3. The text tightens to be single-spaced.

Logging Out of Apostrophe

  1. Look for My Account in the menu at the top. 

  2. Select it to display a menu.

  3. Click Logout.

Editing with Apostrophe (Advanced)

Adding to the Media Library

  1. Find the Media Library button in the admin bar. Click it.

  2. To add a new image or document, you can either do a or b:

    1. Click the link in that dotted area to select a file from your computer or device.

    2. Drag a new image or document into the dotted area marked Drag Images here. Note: This only works in Google Chrome.  

  3. You may add some information about your image or document: a title, any appropriate tags, a credit (for photos), and a description.

  4. Click Save Changes.

How to Add New Content

  1. Go to the page that you want to add new content.

  2. Click the wrench icon in the top right corner to change to Layout Mode.

  3. Look for the black Add Content button on the left side of the screen. Click it to open the drop menu of widgets.

  4. Select the element that you want to add.

  5. (Optional) For text, where the toolbar appears to start typing. Note: Clicking outside of the box will allow it to Autosave.

  6. For all other elements, Fill out the dialog box that opens.

  7. Select Save Changes at the top right corner of the screen.

  1. Go to the page that you want to add new content.

  2. Click the wrench icon in the top right corner to change to Layout Mode.

  3. Look for the black Add Content button on the left side of the screen. Click it to open the drop menu of widgets.

  4. Select the Link Button.

  5. For all other elements, Fill out the dialog box that opens.

  6. Select Save Changes at the top right corner of the screen.

How to Add New Text Elements

  1. Go to the page that you want to add new content.

  2. Click the wrench icon in the top right corner to change to Layout Mode.

  3. Look for the black Add Content button on the left side of the screen. Click it to open the drop menu of widgets.

  4. Select the element that you want to add.

  5. (Optional) For text, where the toolbar appears to start typing. Note: Clicking outside of the box will allow it to Autosave.

  6. For all other elements, Fill out the dialog box that opens.

  7. Select Save Changes at the top right corner of the screen.

 

Viewing Page Versions

As you work in Apostrophe, most changes to pages are autosaved.  Each time a change is made a new revision is created. You may view those revisions at any time in the Page Menu at the bottom left corner.



  1. Select the red and white gear symbol in the bottom left corner to open the Page Menu.

  2. Select Page Versions.

  3. Select one of the 3 tabs see changes in the last week, month or all changes. 

  4. Click Done to close.