Web Services Blog

Starting August 1, 2025 Clemson University is moving to LiveWhale for the University Calendar. The new calendar will be hosted at events.clemson.edu. As part of the changeover process you will need to update any of your pages in Cascade where you pull an event feed. In this post I’ll show you how you can easily make this update so that your pages are ready when we flip the switch.

Step 1. Find your group calendar

First thing you need to do it hit the Calendar Group Listing page to find the calendar group name you want to embed events for on your page. The group names Once you have the correct group name copied you can paste that into the LiveWhale widget in Cascade.

When you find the group name for the calendar you want just click the name and it will automatically be copied to your clipboard so that you can paste it into the Cascade editor in the next step.

Step 2. Head to Cascade and update your calendar modules/widgets

In Cascade, you can find the LiveWhale calendar embed as either a module or a widget. For the module selector, choose “LiveWhale Events Listing” and then paste in the group name you copied in the previous step.

In Cascade, you can find the LiveWhale calendar embed as either a module or a widget. When using the widget, choose “LiveWhale Events Feed” option under the Display Widget question. You will then see the LiveWhale Calendar Group Name input, where you’ll paste the group name you copied in the earlier step.

Much like our current event feeds, LiveWhale calendar feeds will not be displayed in the editor. You will see an editor that lets you know that one will be shown on publish as well as the settings you’ve pasted into the input.

Step 3. Publish your changes

Once you publish these changes you’ll see the events feeding onto your page. They’ll look the same, but the links will now be pointed to the new-and-improved University Calendar! Congratulations on winning the day!

Please note: If your widget doesn’t return any results then the entire widget is hidden.

Update: If you want to add a more-specific feed, you can add a filter for a specific tag. For example, to see academic calendar events that are tagged “summer-2025” you just need to enter: “Registration Services&tag=summer-2025” in the calendar group name input. You can read more about this and more in the LiveWhale API documentation at https://support.livewhale.com/live/blurbs/json-api.

We’d like to share a couple recent updates the the video player in your Cascade templates. These updates provide a little more flexibility and accessibility for the video elements.

1. You can drop the controls below the player if you have the space and need that section of the video for captions, etc.
2. You can hide volume controls if the video has no volume.

Below you can see some example code that will output your video in these sweet new ways. 

<div class="cu-video drop_controls">
  <video class="video" autoplay="" aria-label="Clemson Works Video" preload="auto" poster="../_images/campus-life/finding-your-community/video.jpg" crossorigin="anonymous" data-transcript="transcript" data-hidevolumecontrols="">
    <source type="video/mp4" src="https://media.clemson.edu/ows/web/community.mp4">								 
    <source class="descriptions" type="video/mp4" src="https://media.clemson.edu/ows/web/community_AD.mp4">
  </video>
  <div class="controls">
    <button class="pause-play playBtn ended">
      <span class="las la-play"></span>
      <span class="las la-pause"></span>
      <span class="las la-redo-alt"></span>
      <span class="sr-only">Video ended. Click to replay.</span>
    </button>
  </div>
</div>

• In the containing div element (with the cu-video class), the additional “drop_controls” class will drop the controls area below the video.
• Notice in the video element above the “data-hideVolumeControls” attribute. That will hide the mute, volume down, and volume up buttons. 

See below for an example of these video settings.

We hope these updates allow you a bit more flexibility and contribute to delivering the Clemson message on your sites.

For more information on video elements and accessibility see the audio and video digital accessibility concepts on the Accessibility Portal.

Attention web editors working in Cascade templates: here’s a quick tip to improve user experience.

If you’ve encountered issues with anchor tags scrolling under fixed headers, worry no more. With the .anchor-space class, you can easily add some top space to your anchor tags, ensuring they can still be in the viewport even with fixed header in place.

Simply apply the .anchor-space class to your anchor tags. No more content hidden under fixed header. This should clear up some user confusion.

Check out the example below:

<h2>
  <a id="reading-order" class="anchor-space"></a>
  Reading Order
</h2>

This is still dev-only but will soon be pushed to production.

With the rebrand and launch of the new Clemson News we are making a few changes to the news feeds workflow in order to serve up the best user experience across sites. Below are the details on the philosophy behind the new workflow and how you can incorporate Clemson News into your redesign project.

Organization

There are some organizational changes on the Clemson News site that will affect how feeds are pulled into Cascade. Clemson News uses three primary taxonomies to achieve the new organization: Categories, Tags, and External Site Feeds. (Need to find out more about taxonomies? See the explanation on wordpress.org.)

1. New Taxonomy: Clemson News administrators created a new taxonomy called “External Site Feeds” that can be applied to stories that should be pulled onto the main pages for college/divisions. This new taxonomy is primarily used for main pages, for example college/division homepages, and the main landing pages in the .edu site.
2. Categories and tags will continue to be used for departmental feeds. Be aware that some categories and tags have been recently changed so you will want to utilize the new parameter builder tool I show you below. 

This new taxonomy allows communicators in Clemson News to control what stories funnel to the main .edu website and which should remain only available on the Clemson News site.

Each category on the Clemson News site has a customizable landing page that houses any post in that category. The communications team also heard multiple requests for a way to keep certain stories from being pushed to the main website and the External Site Feeds taxonomy does just that. 

For example, if someone in the College of Education has a story they’d like to push to both the Clemson website and the College landing page in Clemson News she would need to apply both the Category and External Site Feeds selection of “College of Education”. 

Generating the feed

We have an updated parameter builder tool for web editors to pull Clemson News feeds into their sites in Cascade. To get the feed into Cascade just make the taxonomy selections to filter Clemson News content to your specific needs, copy the param string result, and paste that into the News widget in the Cascade editor. Once the page is published it will pull the appropriate stories into the feed on your page.

For a college homepage it may be best to utilize just the external site feed taxonomy, but the builder tool allows you to customize the filter to give them just the feed you need. In the example below the feed has been filtered to show just stories tagged Department of Teaching and Learning in the College of Education category.

You can see the new builder here: ows.sites.clemson.edu/cascade/tools/clemsonnews/builder

We previously did not have some default color theming set on particular widgets, modules, and buttons. The default color if no color is selected should now be Diploma. Please let us know if anything different is discovered.