[Skip to Content]

The Content Block

We have two blocks available for most users to create content for a page. Blocks are used in Cascade when plain old text and links won't do. If you want an accordion, image gallery, youtube video, or quicklinks, it requires a bunch of code that only the developers really want to deal with. To add these features, just create a new block, add your data, save, and then go into a page and pick that block in a block chooser (aka "Choose a block"). For non-multimedia text-and-link blocks, we've created a Content Block.

Content Block

Location: New -> Create -> New Block - Content

What is an accordion? What you see here, with "Expand all" and (+) signs that allow you to expand and contract information is an accordion.

You can add accordions to your site via the Content Block.  Go to the "New" dropdown and then to Create -> "New Block - Content" block. It should look like this:

accorion block

Once created and saved, go to a page and insert them into a "Choose a block" block chooser. Submit the page, and publish to see your changes live.

Accordion Example

Example Text

Heading Text

More Text

A contact block is often featured on a webpage, in the top right corner, underneath the H1 Heading Title of a page. When adding the block to the page, remember to have it align to the right, and be at half width.

Bluepage Listing

There's two options for adding a block. One is to search the Dept/Services bluepage listings for your department's (or service's) official bluepage listing code. The best way to show how to find your code number, is by example.

A search for "Campus Web Technology" retrieves a listing. When you click on it, it gives you the full listing. At this point, you should look at the url. In this case, it looks like this:


The "eid" is equal to 342. This is your bluepage number. You can then insert this number into a block, which will come up with suggestions. Click on the one that begins with bluepages, in this case bluepages_342. This is your block. When adding the block to the page, remember to have it align to the right, and be at half width.

If you need your bluepage listing edited, visit "How to Edit a Contact Block"

Your own contact block

The benefits of using a bluepage block is if you change an email, phone, location for the dept/service, it will change in all bluepage blocks and on the Depts/Services search tab. If you want your own personalized contact block, you can access it via the Content Block. It looks like this:


If you highlight over the question marks, it should give you a description of what the specific labels will do.

Contact Box Example
Contact: Your Name Your Title
Location: Room 101
Extra Label: More Content
Phone: 4-4115
Fax: 4-4126
Email: [email protected]

quicklinks block

  1. Class - the choices are either Bullets, Buttons, Menu, and No Bullets. Examples are below.
  2. Title of the box - This is optional, but often preferred. We tend to use all-caps, ala "QUICK LINKS" or "RESOURCES."
  3. + and - - Use this to add, remove, and rearrange links.
  4. Link Text - This is the text that will appear for the link.
  5. Page, file, or external link - Pick out in cascade asset you want to send users to.
  6. Icon - If the link is a PDF, external link, Word Document, or Intra link, please click the correct button.

When complete, you can add the block into the right column of your site.

Remember, blocks cannot be published. After completing your changes, don't forget to publish every page that has this quicklink box (in many cases this means publishing the entire site) to see your changes on the live site.

Using the table function, a simple table ( up to 4 columns ) can be created and placed on a page.  Input can be through a simple text-box for each row, or a WYSIWYG field for more options.  The rows are automatically striped in alternating colors of white and light gray.

A Tabbed display is identical in setup as an accordion block.  You add items and the put the content in the WYSIWYG area.  The only difference is the display on the page.  Where an accordion opens and closes vertically, the Tabbed display lists the items at the top, and by selecting one, the content is then displayed.

The block you are viewing now is a Tabbed block.

You can see another example in the HR benefits section.

The timeline function is used to display events across a span of time. A date range, a label, and then the content can be added for each event. Content is added through a WYSIWYG section for each event.  A good example can be found in the COM Dean's website here: The Curriculum Renewal Timeline.

WYSIWYG means "what you see is what you get", which means the styles and formats you add to the text, should show up on the site pretty accurately based on how it looks here. In reality, it's more like 50% accurate, but it still hides complicated html code, giving you a decent idea of how your page will look.  This WYSIWYG can be added, via a block chooser (aka "choose a block") into your page.  If you use this, most likely it will be when working with Rows. In most cases, please keep photos out of the WYSIWYG.

Screen grab of the wysiwyg group block

For information on what all those buttons mean, and working with Rows, visit the Content Section (WYSIWYG) section of Create and Edit a Page.

MS word iconWYSIWYG Block Example

This is all inside the WYSIWYG block. Hey, it looks like regular text!