Editing Pages
Editing webpages in LiveWhale couldn’t be simpler. Of course, there’s more you can do on a page besides just edit text, but we’ll cover the basics below.
Editing Your Page (Static Content)
Once you’re logged in, simply click the “Edit Page” link in the top left corner of the page. (You’ll only see the link if you’re authorized to edit the page-and if the page contains editable regions.)
You will see areas of the page that have been predefined as editable regions and they will become surrounded by a box. Click inside any one of these regions, a toolbar will appear, and you can make the desired edits. Please adhere to style guidlines.,
When you’ve finished making your page edits, click the Save and publish button. Your changes will be saved and published immediately.
Note: As a rule of thumb, we suggest avoiding the Save Draft feature, and opt for Save and Publish, just be sure to review what you edited after publishing.
Note: If the web page you are editing is a detailed view of a dynamic item (a news story, event, profile etc.) and you have access to edit that item, you will see the “Edit this item” link in the top left of the editor toolbar. This provides a quick access to edit the item without having to go into the dashboard.
Text Editing
Headers and Paragraph Text
It is important to make your webpage readable and useful to the user. We do this most simply with the use of headers to break up paragraph text.
Style Guidelines with text (A few never-evers to remember)
- Never underline anything on the Ursinus website (pretend the underline icon does not exist on the toolbar). Utilize headers, bold or italicize as needed.
- Never bold Headers. Bold is reserved for paragraph text only.
- Headers are reserved for exactly what they say—headers. Do not use a header text to emphasize a paragraph of text.
- Do not center justify your text. Text should be left justified for ease of reading on mutiple device sizes.
This is header 2
It is always a good idea to use at least one Header 2 on a page for accessibility and SEO reasons. You may use multiple.
This is header 3
This is header 4
This is header 5
This is Header 6
This is paragraph
Toolbar Buttons
When you click into a highlighted content area, you’ll see an editing toolbar. Descriptions for each of the toolbar buttons are below.
- Bold, italic, underline: Pretty self-explanatory; these work just like similar buttons in other programs.
- Link: Select some text and then click this button to create a link. You can link to a page in your own site (your group’s site), a page elsewhere on the Ursinus site (check the box to select all groups), an outside URL, one of your files, an anchor link on this page, or an email address.
- Unlink: To remove a link, select the text and click this button.
- Anchor: This button creates an anchor (“jump link”), which you can link to with the Link button.
- Format dropdown: This dropdown includes a list of customized text styles that you can use while editing text. This houses the LINK styles including red arrow before, red arrow after and red button links. It also houses the link styles for social media. First create the link, second, apply the format to the text. See some button link examples below
- Paragraph dropdown: This dropdown shows text formats, primarily headers and paragraphs. To create subheaders, choose the appropriate header for the context (preview size is shown in a dropdown menu).
- Tx (Clear Formatting): Highlight text that appears to be formatted incorrectly and click this button. This will generally removes formatting that accompaines pasted in text from another web or document source.
- Image icon and Insert dropdown. See Add Widgets and Images below
- Bullets and Numbered Lists: Highlight separate items on different lines and select the bullet or numbered list icon. Click and hold to see other list style options.
- Table: Add and modify tables. To add a table, go to the menu, and select table icon. Within a table, right-clicking (or control+clicking) will show additional cell options. More information on tables below.
- Justification: Right, center, or left align text.
- Indent/Outdent: Indent your content from the left margin.
- Undo/Redo
- <> HTML Source: Edit the HTML source of the editable region you’re in.
- Horizontal Rule: Add a horizontal rule below your content areause the Line icon at the end of the editor toolbar.
-
Blockquote: use for quotes icon to set them off from regular page text. Blockquote
Highlight the quote you typed in and click on the Quotation marks icon on the toolbar. Use the italics button for name of quoted person.
This is a blockquote. Use the curly quotes button to add a quote like this to the page.
Adding Widgets and Images:
- Image icon: Displays the images in your image library for quick placement on your webpage. You can also upload images directly from your computer using this button.
-
Insert: This toolbar element opens a dropdown with more options for adding page content:
- Widget: Add a feed of your dynamic content. Select from the list of 2019 options that open up. Customize your selection with a tag.
- Accordion list: display long sections of text in a collapsible accordion. Great for an FAQ. Details below.
- Video/Media: Add a URL for any Web video (YouTube, Vimeo, etc.) and it will be automatically embedded on the page. Contact Erin to discuss first uploading your video on the Ursinsu College official YouTube or Vimeo.
- Slideshow: Add a quick slideshow (a.k.a Gallery). See Photo Galleries for 4 types available to editors.
- Blurb: Add one of your blurbs
- Form: Drop in a form that has been created in the Dashboard under Forms
- Files
Buttons and Link Styles
1) Make a link
2) Apply the Format drop down style that you wish (example Arrow After Link or Red Button)
This is a featured link with an arrow
Adding Widgets
- Click Edit Page,
- Place your cursor in the content area that you desire
- Select Insert on the toolbar and then Widget
- All new widgets for the NEW design begin with 2019.
- Select desired widget, click insert this widget.
NOTE: widgets pull specific dynamic content from the dashboard. Items being pulled must be LIVE and meet the credentials for that widget.
Contact Erin Hovey if you need a custom widget.
Accordion
Add an accordian by click on on Edit Page and putting your cursor in the box that you want. Click on Insert dropdown on toolbar and then select Accordian List. Header and content areas are added by hitting the TAB button on your keyboard. To delete an extra tab, siply hit the Backspace button on your keyboard.
Note: Please do NOT add any links to the Header content of an accordian.
Tables
Tables are useful for displaying complex data on your website. Headings can be placed in the left column or along the top. Make sure they have the heading styles applied (header 2 - header 6 can be used).
Note: the top row on the table will be red. This is for column header information. Header information in a table is important for web accessibility. Use the top row as a header, not for the table’s content.
Year | Month | Accrual Rate per Month | Days per year | Maximum Accrual |
---|---|---|---|---|
1 | First two months | 0 | ||
1 | Months 3-12 | 1.000 | 10 | 10 |
2 | 0.917 | 11 | 11 | |
3 | 1.000 | 12 | 12 |