W E B S I T E U S E R G U I D E V . 8
CASCADE INTERFACE OVERVIEWLOGIN PAGE
USER DASHBOARD
SITE DIRECTORY
PAGE EDITORPAGE EDITOR OVERVIEW
STANDARD ROW COMPONENTSWYSIWYG COMPONENT
HOW TO STYLE SECTION HEADINGS AND PARAGRAPHS
HOW TO CREATE TEXT LINKS AND RED CALL-TO-ACTION BUTTON
HOW TO ADD/EDIT A VIDEO
HOW TO ADD A LIST AND SUBLIST
HOW TO ADD AN IMAGE
HOW TO ADD A TABLE AND FORMAT THE TABLE CELLS
HOW TO ADD AN ACCORDION
HOW TO ADD A PROFILE COMPONENT
SIDEBARSFIRST SECTION
ADDITIONAL SIDEBARS
S EC . 01
S EC . 0 2
S EC . 0 3
S EC . 0 4
TA B L E O F C O N T E N T S
S EC . 07
S EC . 0 8
S EC . 0 9
TA B L E O F C O N T E N T S( C O N T I N U E D )
CREATING NEW PAGES
APPROVAL WORKFLOWSWORKFLOWS OVERVIEW
SAVING/PREVIEWING PAGE AND SUBMITTNG CHANGES
STARTING A WORKFLOW
REVIEWING REJECTIONS AND MAKING MORE CHANGES
UPLOADING DOCUMENTS AND IMAGESADDING BRAND NEW DOCUMENTS
UPDATING EXISTING DOCUMENTS
ADDING BRAND NEW IMAGES
UPDATING EXISTING IMAGES
BACKGROUND IMAGE ROWSCONTENT FEATURE WITH IMAGE
SLIDER
3 CALLOUT
STORY BLOCKSCREATING STORY BLOCKS
ADDING STORY BLOCKS TO PAGES
EDITING STORY BLOCKS
S EC . 0 6
S EC . 0 5
0 4 U N I V E R S I T Y O F I N D I A N A P O L I S I N T R O D U C T I O N
UNIVERSITY OF INDIANAPOLISWEBSITE USER GUIDE
To ensure proper procedures for updating content on the website, we have developed a website user guide that consists
of several basic tutorials.
1. Navigating the Interface
2. Editing Pages
3. Editing the Sidebar
4. Approval Workflows
5. Uploading Files
For questions, please contact:
Kaye Manuel ([email protected])
T H I S I S A L I V I N G D O C U M E N TElements outlined within are subject to change.
CASCADE INTERFACE OVERVIEWUNIVERSIT Y OF INDIANAPOLIS
S E C . 0 1
0 6 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
1. Go to: https://uindy.cascadecms.com/login.act
2. Login with your own credentials.
First-time users will be provided with a default password. For security
purposes, all users are encouraged to change their default password after
their first login.
LOGIN PAGE
USER DASHBOARD
M Y C O N T E N T
Provides quick links to files you’ve recently accessed, files you own, drafts
you haven’t saved, and workflows to review.
N O T I F I C A T I O N S
Notifies you of any recent activity on your account, such as files that have
recently been published, including files you have submitted for review and
have been approved.
NotificationsMy Content
0 7 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
SITE DIRECTORY
H O W T O A C C E S S T H E S I T E D I R E C T O R Y
1. Click on the SITE drop-down on the top-left corner of the user dashboard.
2. Select “UIndy”.
F I L E E X P L O R E R
The file explorer (narrow pane on the left) contains a list of all the assets on
the website (e.g. folders, subfolders, pages, files, custom sidebars, etc.)
C U R R E N T V I E W
The current view (wide pane on the right) shows your currently selected
asset. The screenshot on the left shows the root folder, UIndy, as the
currently selected view.
H O W T O A C C E S S A F O L D E R
1. Right-click on the folder on the file explorer (narrow pane on the left).
2. Select “View”.
(CONTINUED ON NEXT PAGE)
The site directory contains all of the files on the website.
SITE drop-down
File explorer Currently selected view Folder options
0 8 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
S E A R C H B A R
Search for keywords in filenames, file titles, or file path. When searching by
file path, DO NOT begin with a forward-slash.
A D D C O N T E N T
The Add Content button provides options for creating new pages, folders,
custom sidebars, and uploading files (e.g. photos and PDFs).
Select the “Default” option to view more assets (e.g. folders and files).
(CONTINUED ON NEXT PAGE)
Search Bar
Add Content button
Incorrect format: /campus-life/lecture-programs
Correct format: campus-life/lecture-programs
E X A M P L E
Page
Click to view more assets
Folder
0 9 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
H O W T O A C C E S S A P A G E
1. Click on a folder in the file explorer to expand the list of files within that
folder.
2. Click on a page to see it as the current view.
The file path of a page after UIndy is the page URL. The page URL will be
active after an administrator publishes the page.
Current viewPageFolder
Page options
File path
(page URL)
File path: UIndy / training / about-uindy-training / index
Page URL: www.uindy.edu/training/about-uindy-training
Note: index at the end of a page URL can be excluded. By default, web browsers display the index file inside a folder when no other page name is specified in the URL.
E X A M P L E
PAGE EDITORUNIVERSIT Y OF INDIANAPOLIS
S E C . 0 2
0 1 1 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
PAGE EDITOR OVERVIEW
Edit buttonSelected page
The page editor contains options for editing a page’s settings and body
content. Options are also available to hide/show the breadcrumb navigation
and sidebar on the page.
H O W T O A C C E S S T H E P A G E E D I T O R
1. Click on a page in the file explorer to select it. The current view will display
a preview of that selected page.
2. Click “Edit” on the page options, located on the top-right corner of the
current view.
D I S P L A Y N A M E V S . T I T L E
Use these fields to set up the general settings of a page (e.g. Page Title).
The Display Name is the text label for this page that’s used on the
breadcrumb navigation and sidebar. If this field is blank, it will default to the
Page Title.
The Page Title is the text label for this page that’s displayed on the fIle
explorer and browser tab. If this field is blank, it will default to the Display
Name.
If the Display Name and Page Title fields are both blank, it will default to the
Page Name, which is the same filename that’s used in the URL.
(CONTINUED ON NEXT PAGE)
Page Title
Display Name
0 1 2 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
Banner panel
Content Row
panel
C O N T E N T P A N E L S
Content panels can be expanded to reveal options for editing section
content.
The first type of content panel on any page is the Banner panel. It provides
options for updating the top banner image, headline, and subheadline.
However, the banner is optional. Leave at least one field on a banner blank
to hide the entire banner.
All content panels after the Banner panel is a Content Row panel, which
contains options for editing the body conent. There are several types of
content rows. The difference between them are the available components for
displaying content (e.g. buttons, headings). New content rows can be added
by clicking on the plus-sign (+) on the right side of a Content Row panel.
Content panels Add new Content row
STANDARD ROW COMPONENTSUNIVERSIT Y OF INDIANAPOLIS
S E C . 0 3
0 1 4 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
STANDARD ROW OVERVIEWThe most common type of content row is a “Standard Row”. This is used for
displaying components such as: standard headings, paragraphs, lists, links,
buttons, videos, images, tables, and accordions.
Select “Standard Row” from the Content Row Type drop-down to reveal the
Component Type drop-down.
ComponentType
Content RowType
(CONTINUED ON NEXT PAGE)
0 1 5 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
Toolbar
W Y S I W Y G C O M P O N E N T
“WYSIWYG” the most common type of Standard Row component. This is
used for displaying standard headings, paragraphcs, lists, links, buttons, and
tables. It looks similar to the standard text editor with a toolbar for changing
the text formatting.
H O W T O S T Y L E A S E C T I O N H E A D I N G
1. Highlight the heading you want to format.
2. On the WYSIWYG toolbar, click Formats > Headings > Heading 2.
The Headings drop-down reveals the different heading classes. Use the
“Heading 2” class for the main section headings within a page.
Use the “Heading 3” class for sub-section headings.
Use the “Heading 1” class in a WYSIWYG component only if you are styling
the name of the page. This typically happens when you are not displaying
the name of the page in the top banner. Each page can only have one
“Heading 1”, class for search engine optimization (SEO) purposes.
Formats drop-down
0 1 6 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
Paragraph
H O W T O S T Y L E P A R A G R A P H S
By default, paragraphs will already be styled as soon as you begin typing in
a WYSIWYG Content box. However, if you are copying and pasting text from
a Word document, the paragraph may not be recognized in the editor as a
paragraph.
Highlight the paragraph text. If the element indicator at the bottom of
the WYSIWYG Content box displays “p”, then the editor recognizes the
highlighted text as a paragraph. No further styling is needed. However, if the
element status bar is blank or displays something other than “p”, then the
paragraph will need to be styled properly.
1. Highlight the paragraph text you want to format.
2. On the WYSIWYG toolbar, click Formats > Blocks > Paragraph.
H O W T O C R E A T E T E X T L I N K S
1. In the WYSIWYG Content box, highlight the text you would like to use as
the link.
2. Click the Insert/Edit Link button on the toolbar. This is pop-up a dialog box.
3. If you want to link to a page inside Cascade, checkmark “Internal” for the
Link Source. Otherwise, choose “External” if you’re linking to an external
URL.
4. In this example, we’ll choose “Internal” link. Click on the Choose File Page,
or Link button. This will open the file chooser panel on the right side.
Element indicator
Highlightedtext
Insert/Edit Linkbutton
Insert/EditLInk button
(CONTINUED ON NEXT PAGE)
0 1 7 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
Browse tab
Keyword search box
Selected page
5. Click the Browse tab. You may use the keyword search box to narrow
down the results.
6. After you select the page you page, click Choose at top-right corner.
This will bring you back to the Insert/Edit Link dialog box. If you inserted an
external link, select “New Window” from the Target drop-down option. This
ensures the external link will open in a new tab so the user doesn’t leave the
current website. Otherwise, select “None” from the Target drop-down option.
7. Click OK button.
H O W T O A D D A R E D C A L L - T O - A C T I O N B U T T O N
1. At the bottom of a WYSIWYG Content box, select “Yes” for the Include
Button Link? option. A Button Link panel will appear. Click it to expand the
options.
2. Fill in the Link Text (button label).
3. Select the LInk Type. “Internal” is a page within Cascade. “External” is an
external URL.
4. If you choose “Internal Link”, click the Choose File, Page, or Link button
and browse for the page.
5. If you want to add another button, click on the plus sign (+) to the right of
the Button Link panel.
Include ButtonLink option
Add another button
0 1 8 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
H O W T O A D D / E D I T A V I D E O
1. Click on the plus sign (+) to the right of a Component panel to add a new
component after it.
2. In the Component Type drop-down, select “Video”. A Video panel will
appear. Click it to expand.
3. For the video Type field, select “Full Size” or “Excerpt”. “Full Size” will
appear larger on the page but without a caption. “Excerpt” will appear as a
smaller thumbnail with a short caption on the right side of the thumbnail.
4. Provide the YouTube ID.
5. Provide a video Image for the thumbnail.
6. If using “Excerpt”, provide a 3-5 word video Description.
H O W T O A D D A L I S T
1. In a WYSIWYG Content box, add some text including the list heading and
list items.
2. To style the list heading, highlight the heading text and click Formats >
Headings > Heading 2 on the toolbar.
3. Highlight the list items and click Bullet List button on the toolbar. For a
numbered list, click Numbered List button on the toolbar.
Bullet List button
Numbered List
button
YouTube URL: https://www.youtube.com/watch?v=0APmoW-LrmQ
E X A M P L E Y O U T U B E I D
Selected list items
Component Type
0 1 9 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
H O W T O A D D A S U B L I S T W I T H I N A L I S T I T E M
In a WYSIWYG Content box, highlight the sublist text and press “Tab” on your
keyboard.
To remove the sublist, highlight the sublist text and press “Shift” + “Tab” on
your keyboard.
H O W T O A D D A N I M A G E
All new images must be emailed to [email protected] for
approval. An administrator will resize and upload images to the specified
department folder.
1. In a WYSIWYG Content box, click and place your cursor where you want
the image to appear.
2. On the toolbar, click the Insert/Edit Image button. This is pop up a dialog
box.
3. On the Image field, click Choose File.
4. Use the Browse tab in the file chooser to search for the image name.
5. Select the image file and click Choose on the top-right corner.
6. In the Image Description field of the Insert/Edit Image dialog, provide an
image description for screen readers and accessibility purposes.
7. Click OK. The image should display in the WYSIWYG Content box.
Image
Image description
Sublist textInsert/Edit Image
button
0 2 0 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
Fullscreen button
H O W T O A D D A T A B L E
1. Before inserting a table, click on the Fullscreen button on the toolbar for a
larger view.
2. Click and place the cursor where you want to insert a table.
3. On the toolbar, click the Table drop-down, hover over the “Table” option,
and select the table layout (e.g. 4x4). After you select a table layout, a
standard table will display in the WYSIWYG component.
4. Click anywhere inside the table. On the toolbar, click the Table drop-down
again, and select “Table Properties.” Checkmark the option labeled “Caption”
and click OK. This adds an additional cell above the table that allows you to
type in a table title. You must provide a table title.
5. Click inside the other cells and start adding text content.
It add more rows or columns, click inside a cell, and table options will display
under the table that looks like this:
Select the option that you need.
H O W T O F O R M A T T H E T A B L E C E L L S
Column headings should be formatted as cell headers (in red text and all
caps).
1. Highlight across all the column headings and right-click on the highlighted
area. A context menu will appear.
2. Click Cell > Cell properties. The Cell properties dialog will appear.
3. For the Cell type field, select “Header cell”.
4. For the Scope field, select “Column”, then click OK.
Optional: You may also change the alignment of cell content. For example, if
you want the entire first column to be right-aligned, follow these steps:
1. Highlight all the text in a column.
2. Click Cell > Cell properties. The Cell properties dialog will appear.
3. For the H Align field, select “Right” and click OK.
Column headings
Cell properties option
0 2 1 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
ComponentType
H O W T O A D D A N A C C O R D I O N
1. Click on the plus sign (+) to the right of a Component panel to add a new
component after it.
2. In the Component Type drop-down, select “Accordion”. An Accordion
panel will appear. Click it to expand.
3. Add text for the accordion Heading field.
4. Add text the Content box. This box works similarly to the WYSIWYG
content box.
5. Click on the plus sign (+) to the right of a Accordion panel to add more
accordions.
Accordion Heading Accordion Content
0 2 2 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
H O W T O A D D A P R O F I L E C O M P O N E N T
A “Profile” component is a type of Standard Row component that’s typically
used to display faculty/staff information. The elements contain a photo on
the left and text content on the right side of the photo.
1. Click on the plus sign (+) to the right of a Component panel to add a new
component after it.
2. In the Component Type drop-down, select “Profile”. A Profile panel will
appear. Click it to expand.
3. Add the Photo. Most faculty/staff professional photos are available on the
system. You can find them by browsing for their last name. If a faculty/staff
photo is not available, search for the file called “no_photo.png” and use it as
a placeholder.
If a brand new faculty/staff photo needs to be uploaded, please send a
request to [email protected]. An administrator will resize
and upload images to the appropriate “images” folder so they are available
in the file chooser panel.
4. Provide the ALT Text, which is the image description used by screen
readers. You can set this to the person’s name.
5. Provide the Content, which is the person’s information, including name,
title, and contact information.
6. Format the name as a “Heading 3”. First, highlight the name. On the
toolbar, select Formats > Headings > Heading 3.
7. When you are finished making all edits on the page, submit the change
and go through the approval workflow.
Profile component
Component Type
Photo(129x194)
Image description
Toolbar
Paragraph text
Heading 3
SIDEBARSUNIVERSIT Y OF INDIANAPOLIS
S E C . 0 4
0 2 4 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
H O W T O C H A N G E T H E L I N K O R D E R
1. On the file explorer (left side), right-click on the parent folder of the page
(e.g. About UIndy Training).
2. Click View to select the folder. The current view will display a list of all the
folder contents.
3. On top of the list, click on the Order colum heading. This will automatically
reorder the list items in ascending order (startng with “1” at the top).
4. On the list, click and drag a page title to the order you want it to display.
5. When you are finished, send an email to marketing-webrequests@uindy.
edu and state which folder needs to be re-published. An administrator must
publish the entire parent folder in order for the changes to be live.
H O W T O U P D A T E T H E C A L L - T O - A C T I O N C O N T E N T
1. In the file explorer, right-click on the “call-to-action” file in the folder and
select Edit.
2. In the call-to-action’s content box, modify the section heading and links
just like you would in a regular WYSIWYG component.
3. When you are finished, click Preview Draft on the top-right corner.
4. Click Submit and go through the workflow approval process. (See section
Approval Workflows in this document)
Link
Section heading
FIRST SECTION
ADDITIONAL SIDEBARS
The links on the first section of a sidebar are auto-generated based on the
pages inside the current folder.
Each folder should have an file entitled “call-to-action”. These blocks of code
are used to update other sidebar sections/links on the right side of the page.
File explorer Current view Order column heading
(CONTINUED ON NEXT PAGE)
0 2 5 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
Additional section
H O W T O A D D A D D I T I O N A L S I D E B A R S E C T I O N S
1. In the content box, highlight an existing section starting from the beginning
of the section heading to the end of the last link in its list.
2. On your keyboard, press Ctrl+C to copy (Command+C on Mac).
3. Click and place your cursor at the end of the last link on the list.
4. On your keyboard, press Enter TWICE to place the cursor where the next
sidebar section should begin.
5. On your keyboard, press Ctrl+V to paste (Command+C on Mac) the new
sidebar section. You might see that the section heading appears right under
the last link of the previous section.
6. Click and place your cursor at the beginning of the new section heading
and press Enter TWICE on your keyboard to add some space between the
last link of the previous section and the heading of the next section.
7. Modify the new section heading and links just like you would in a regular
WYSIWYG component.
8. When you are finished, click Preview Draft on the top-right corner.
9. Click Submit and go through the approval workflow process. (See section
Approval Workflows in this document)
CREATING NEW PAGESUNIVERSIT Y OF INDIANAPOLIS
S E C . 0 5
0 2 7 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
DisplayName
Page Title
Page Name
Configure
“Include when indexing” “Include when publising”
H O W T O C R E A T E N E W P A G E S
1. In the file explorer, right-click on the folder where you would like to add a
new page, and click VIew to select the folder.
2. On the top menu, click Add Content and select Page. This will display a
basic page editor.
3. At the top of the page editor, fill in the Page Name. This is the filename
that’s used as part of the page URL. Please use LOWERCASE letters and NO
SPACES. You may use dashes instead of spaces.
P A G E N A M E V S . D I S P L A Y N A M E V S . P A G E T I T L E
The Page Title is the text label for this page that’s displayed on the fIle
explorer and browser tab when users bookmark this page. If this field is
blank, it will default to the Display Name.
The Display Name is the text label for this page that’s displayed on the
breadcrumb navigation and sidebar. If this field is blank, it will default to the
Page Title.
If the Display Name and Page Title fields are both blank, it will default to the
Page Name, which is the same filename that’s displayed in the URL.
H O W T O P R E V E N T A P A G E F R O M B E I N G P U B L I S H E D
Full site publishes may be scheduled in order to update the links on the
mega menu and footer. This means all pages must be re-published. To
prevent an incomplete page from being published accidentally, follow these
steps:
1. In the page editor, click on the Configure tab.
2. Uncheck “Include when publishing” and “Include when indexing”. When
you’re ready to submit the page for review and publish, checkmark those two
items again and go through the Approval Workflow.
Website URL: https://www.uindy.edu/about-us/fast-facts
Page Name: fast-facts
E X A M P L E
APPROVAL WORKFLOWSUNIVERSIT Y OF INDIANAPOLIS
S E C . 0 6
0 2 9 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
Preview Draft button
Submit button
Comments used for the system’s version history
1. When you are finished editing a page, click the Preview Draft button at the
top-right corner of the page editor to preview the changes. If further changes
are needed, click Edit to open the page editor again.
2. On the top-right of the current view, click the Submit button. This will pop
up a box that allows you to make notes of changes you’ve made. These
comments are for the system to keep in its version history.
3. Click Check Content & Submit. This will go through the system checks
(e.g. spell check, broken links check, and accesibility check).
WORKFLOWS OVERVIEW
SAVING/PREVIEWING PAGE AND SUBMITTING CHANGES
Approval workflows are set up by the administrator to ensure any changes
are reviewed before publishing to the live site.
In a nutshell, the process is:
1. Save changes and preview page.
2. Submit changes.
3. Go through system checks (e.g. spell check).
4. Provide comments of changes for the reviewer and start workflow.
5. Approver reviews changes.
6. Changes are approved and published live.
Check Content & Submit button
0 3 0 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
Comments for the approver to read
Current Step Owner
W O R K F L O W I N P R O G R E S S
If the Content Step Owner line on this screen says “Approvers”, that means
the changes have been sent. At this point, you’ll have to wait for the approver
to review the changes.
G E T T I N G A P P R O V E D
When the changes have been approved, you will receive an email stating
that the workflow is complete. No other action is needed.
1. On the Start Workflow screen, please use the Comments for reviewer box
to describe the changes you have made on a page. These comments will be
emailed to the approver so he/she knows what was updated and what page
elements to review.
Note: Changes may be rejected if Comments for reviewer box is left blank.
2. Click the Start Workflow button on the top-right of the screen. This will
take you to the Workflow in Progress screen.
STARTING A WORKFLOW
0 3 1 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
Comments from the approver.
Workflows tabWorkflow
H O W T O M A K E F U R T H E R C H A N G E S
1. Click on Go to the dashboard link from the email. This will take you to your
user dashboard.
2. In the blue My Content box, you’ll see a red indicator on the Workflows
tab. Click on the Workflows tab and click on the workflow. This will take you
to workflow screen.
3. In the workflow screen, click on the Edit link under the Available Actions
section. This will open the page editor so you can make your changes based
on the approver’s comments.
4. When you are finished making changes, click the Preview Draft button.
5. Click the Advance button. This is similar to the Submit button. Fill in the
Enter Workflow Comments for the approver to read.
6. Go through the system checks and click the checkmark button.
7. Afterward, you’ll see the workflow screen again. If the Content Step Owner
line the screen says “Approvers”, that means the changes have been sent. At
this point, you’ll have to wait for the approver to review the changes again.
In some cases, your changes may be rejected and sent back to you by the
approver. If this happens, you will receive an email that looks similar to the
email on the left screenshot. Read the comments from the approver.
REVIEWING REJECTIONS ANDMAKING MORE CHANGES
UPLOADING DOCUMENTS AND IMAGESUNIVERSIT Y OF INDIANAPOLIS
S E C . 0 7
0 3 3 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
“Files” folder File option Current view
“choose” link“Use the suggested name” link
File upload box
Acceptable documents file formats: .PDF | .DOC | .DOCX
H O W T O A D D B R A N D N E W D O C U M E N T F I L E S
1. On the left file explorer, right-click on the “files” folder within your
department and click View to select the folder. The current view should
display any files within that folder.
2. At the top, click the Add Content button.
3. Click Default to see more options.
4. Click the File option. The file uploader will appear.
5. In the file uploader window, click the choose link inside the file upload box
(box with dotted lines)
6. Browse for the file on your computer.
7. The filename must be lowercase and have no spaces. Use underscores
to replace spaces. If the filename includes uppercase letters and/or
spaces, you’ll see some red text at the top of the file uploader window that
suggests a different name. Click the link use the suggested name. This will
automatically convert any uppercase letters to lowercase and any spaces to
underscores.
8. When you are finished, click Preview Draft on the top-right corner.
9. Click Submit.
10. Send an email to [email protected] and state which
document needs to be published. When uploading a brand new document,
an administrator must manually publish the document to be viewable on the
live site.
UPLOADING DOCUMENTS
0 3 4 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
Select document to update
Edit buttonCurrent view
“Add Content” button“Images” folder
H O W T O U P D A T E E X I S T I N G D O C U M E N T F I L E S
1. On the left file explorer, click on the document you want to update. The
current view should display a preview of that document.
2. At the top right, click the Edit. The file uploader window will display.
3. In the file uploader window, click the choose link inside the file upload box
(box with dotted lines).
4. Browse for the updated document on your computer.
5. Click Preview Draft on the top-right corner.
6. Click Submit and go through the Approval Workflow.
Acceptable image file formats: .JPG | .PNG | .SVG
H O W T O A D D B R A N D N E W I M A G E F I L E S
1. On the left file explorer, right-click on the “Images” folder within your
department and click View to select the folder. The current view should
display any images within that folder.
2. At the top, click the Add Content button.
3. Click Default to see more options.
4. Click the File option. The file uploader will appear.
5. In the file uploader window, click the choose link inside the file upload box
(box with dotted lines).
6. Browse for the image on your computer.
(CONTINUED ON NEXT PAGE)
UPLOADING IMAGES
0 3 5 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
Note: If you are unsure whether an image is sized correctly or do not
have the tools to resize a photo, please email the image(s) to marketing-
[email protected]. Descibe where on the page you will use the image
(e.g. banner, slider, regular body content, etc.). An administrator will resize
the image accordingly.
7. The filename must be lowercase and have no spaces. Use underscores
to replace spaces. If the filename includes uppercase letters and/or
spaces, you’ll see some red text at the top of the file uploader window that
suggests a different name. Click the link use the suggested name. This will
automatically convert any uppercase letters to lowercase and any spaces to
underscores.
8. When you are finished, click Preview Draft on the top-right corner.
9. Click Submit.
10. Send an email to [email protected] and state which
image needs to be published. When uploading brand new a image file, an
administrator must manually publish the image file to be viewable on the live
site.
H O W T O U P D A T E E X I S T I N G I M A G E F I L E S
1. On the left file explorer, click on the image you want to update. The current
view should display a preview of that image.
2. At the top right, click the Edit. The file uploader window will display.
3. In the file uploader window, click the choose link inside the file upload box
(box with dotted lines).
4. Browse for the updated image on your computer.
5. Click Preview Draft on the top-right corner.
6. Click Submit and go through the Approval Workflow.
Select image to update
Edit buttonCurrent view
“choose” link“Use the suggested name” link
File upload box
BACKGROUND IMAGE ROWSUNIVERSIT Y OF INDIANAPOLIS
S E C . 0 8
0 3 7 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
A content feature with an image is a type of Background Image Row that
include text on the left side and a photo on the right now. See preview on the
left.
CONTENT FEATURE WITH IMAGE ROW
H O W T O A D D A C O N T E N T F E A T U R E W I T H I M A G E R O W
1. In the page editor, click on the plus sign next to the last content row to add
a new row.
2. For the new row, select “Background Image Row” from the Content Row
Type dropdown. This will display a Background Image Row Type dropdown.
3. In the Background Image Row Type dropdown, select “Content Feature w/
Image + Greyhounds”. This will display other fields to fill in.
4. Provide a Heading for the section.
5. In the Content box, you can include paragraphs or lists.
6. Choose an image for the Right Image field. This image will be displayed
on the right side of the text content. Contact the administrator if new photos
are needed. Note: This photo area is designed to disappear on smaller
screens.
7. Provide an Image Alt Text. This is a short image description for users who
use screen readers.
Content RowType
Background Image Row Type
Content Feature with Image
Add new row
Heading
Content
0 3 8 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
Each slide within a Slider row contains one image and a short description.
One slider may have unlimited slides. All sliders must have one relevant title.
See preview on the left.
SLIDER ROW
H O W T O A D D A S L I D E R R O W
1. In the page editor, click on the plus sign next to the last content row to add
a new row.
2. For the new row, select “Background Image Row” from the Content Row
Type dropdown. This will display a Background Image Row Type dropdown.
3. In the Background Image Row Type dropdown, select “Slider”. This will
display other fields to fill in.
4. Provide a Title for the slider.
5. For each slide, select an Image and provide a short description for the
Image Alt Text. Contact the administrator if new photos are needed.
6. Fill in the Content field with a short description for the slide.
7. Under the Content field, you add one optional link. Otherwise, leave it
blank.
8. OPTIONAL: After the last slide, you also have the option to add a section
called WSYIWYG + Right Iimage. This is very similar to the Content Feature
with Image section. This section will include text content on the left side and
a photo on the right side. Note: The photo area is designed to disappear on
smaller screens. If you choose to use the WSYIWYG + Right Iimage section,
provide a Heading, Content, Image, and Image Alt Text. Otherwise, leave all
of it blank.
Content RowType
Background Image Row Type
Slide text content
Slider
Slider title
Add new row
Title
Add new slide
Image Alt Text
Slide image
0 3 9 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
A 3 Callout row features three linkable images. Each featured image
includes a short description and link underneath it. This component requires
three and only three images.
3 CALLOUT ROW
H O W T O A D D A 3 C A L L O U T R O W
1. In the page editor, click on the plus sign next to the last content row to add
a new row.
2. For the new row, select “Background Image Row” from the Content Row
Type dropdown. This will display a Background Image Row Type dropdown.
3. In the Background Image Row Type dropdown, select “3 Callout”. This will
display other fields to fill in.
4. Provide short content for the Intro field. This will be displayed at the top of
the section.
5. For the Emblem field, click on “Choose Image” and the File Chooser will
open on the right side. Click the Browse tab and type in “emblem” to display
all files that begin with that name. Select an image and click the “Choose”
button. Note: If you need a new emblem created, please submit a request to
Each callout requires the following: Image, title, description, and link.
6. For each callout, select a photo for the Image field. For more images,
please send a request to [email protected]. An
administrator will resize and upload images to the appropriate “images”
folder so they are available in the file chooser panel.
7. Provide a Title for each callout. This is the heading that displays under the
featured image.
8. Provide a short Description for each callout.
9. Lastly, provide a Link where a user will be directed to when they click on
the image.
Content RowType
Background Image Row Type
3 Callout
Add new row
Intro content
Image
Title
Emblem
STORY BLOCKSUNIVERSIT Y OF INDIANAPOLIS
S E C . 0 9
0 4 1 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
A Story Block row is a student or faculty testimonial/quote. You can create a
block one time and re-use it on multiple pages.
CREATING STORY BLOCKS
1. On the left file explorer, right-click on the “stories” folder and click View to
select the folder.
2. On the top menu, click Add Content and select Story Block. The story
block editor will pop-up.
3. In the story block editor, provide the Data Definition Block Name, which
is typically the name of the person (e.g. jane-smith). Note: Please use
lowercase letters and dashes to separate words.
4. The Placement Folder should already be set to “stories” if you followed
Step 1 correctly. Otherwise, click it and browse for the “stories” folder.
5. Provide the Section Heading. This is either “Student Story” or “Faculty
Story”, depending on whose testimonial you’re creating.
6. The Featured Image is a square photo of the person whose testimonial
you’re creating. Send a photo to [email protected] for
approval. An administrator will resize and upload images to the “images”
folder.
7. The default Background Image will be the same for all stories, so you
can leave this blank. Otherwise, you can submit a new photo to marketing-
[email protected] for approval. An administrator will resize and
upload images to the “images” folder.
8. Provide a Heading, which is the name of the person whose testimonial
you’re creating.
9. The Subheading is typically the faculty member’s title or student’s major
and graduation year.
10. Lastly, provide the Content, which is the student or faculty quote. You do
not need to include the opening and closing quotation marks.
11. When you are finished, submit the story and go through the approval
workflow.
Story Block
Section Heading
Block name
Folder
Background Image
Subheading
Heading
Featured Image
0 4 2 U N I V E R S I T Y O F I N D I A N A P O L I S U N I V E R S I T Y W E B S I T E
1. Select the page you want to add the story block to, and click Edit to open
the page editor.
2. In the page editor, click on the plus sign next to the last content row to add
a new row.
3. For the new row, select “Story” from the Content Row Type dropdown.
4. For the Data Source field, select “Block”.
5. For the Story Block field, browse for the name of the story block you want
to add (e.g. jane-smith).
6. When you’re finished, click Preview Draft to see a preview of the story
block content on the page.
1. On the left file explorer, go to the “stories” folder.
2. Click on the story block you want to modify and click Edit to open the
story block editor.
3. Make the necessary changes.
4. When you’re finished editing, click Preview Draft.
5. Click Submit and start the approval workflow process.
Add new row
ADDING STORY BLOCKS TO PAGES
EDITING STORY BLOCKSSection Heading
Background Image
Subheading
Content
Heading
Featured Image