Transforming UB’s digital communications.
For Developers
Support for our UBCMS developers.
On this page:
Last reviewed: November 18, 2024
Permissible Activities
To maintain security and stability of the UBCMS, we have established the following guidelines for customization and development.
Site authors (developers) can do the following.
- Add unfiltered HTML, CSS or JavaScript to individual pages using our HTML Snippet, or to every page in a site by adding the HTML snippet to the site's header or footer.
- Customize the look and feel of an entire site with a custom CSS stylesheet and custom JavaScript. That can be added in an HTML Snippet in your site's header or footer, or instead to the main.css and main.js within the /etc/designs area for your site within CRXDE.
- Embed custom external content in individual pages by adding JavaScript or an <iframe> to an HTML Snippet. This works well for forms, videos and maps.
- Integrate with custom back-end applications by embedding the front-end application framework into individual pages and calling the backend APIs through JavaScript in an HTML Snippet. (See a JamStack example - usual login required.)
- Use an API to automate publishing external content into UBCMS pages (see a RestAPI example - usual login required). This is a way for an external script (e.g. PHP) to manage UBCMS pages instead of using Author tools. Typically this external script would run once to create pages that would then be edited in the normal way in Author going forward (such as a migration), or it would run continuously and be the only way certain pages are maintained (perhaps from an external database).
- Access pieces of UBCMS content via REST API, such as to download your UBCMS header and footer to an external server to extend your UBCMS look and feel to other sites.
- Develop custimized sites outside the UBCMS. UBit supports additional hosting platforms (e.g. UB CaaS, Wordpress).
- Use the UBCMS Training Server as a sandbox separate from your real site. This is a fully functional AEM environment equivalent to the main Author server, but content developed there cannot be transfered back to the Author server. (Request a sandbox on the Training Server.)
These actions are not allowed.
- Installing custom server-side AEM code (e.g. Java, JSP, HTL):
- On our servers.
- On your own university server or a third party server.
Please keep in mind:
- Any customizations must be supported by your team.
- We run code deployments on a weekly schedule and suggest you test regularly to address any code in your site that is affected.
Code Deployments and Blackout Windows
FYI, we normally deploy code changes on Wednesday mornings before business hours, but emergency changes may be pushed out with little or no notice.
If you work requires changes on the backend, we avoid periods of peak university activity (e.g. start of semester, and examss) as well as holidays.
Akamai Content Delivery Network
The Akamai content delivery network (CDN) delivers our Web pages through high-speed 'edge' servers physically located around the globe, instead of through the 'origin' servers directly (our UBCMS servers). The CDN helps accelerate, filter, and secure web traffic.
Analytics / Google Analytics / Google Tag Manager (GTM/UA/GA4)
The UBCMS supports the collection of usage data including Google Analytics and Universal Analytics. UB’s centralized code (GTM-T5KRRKT) is added automatically to all published UBCMS pages.
University Communications manages a Google Analytics GA4 property that collects usage data across all UBCMS websites. This data is available to all units in the UBCMS. UWLs and Site Owners/Managers can request viewer access to the GA4 property.
University Communications maintains a set of tags that collect data into different event categories. Each time a user 'clicks' a tagged element, Google Analytics records the link text (label) and URL under the corresponding category.
More details about UB's GA4 property and event tags is in the main Analytics documentation.
Heatmap data can also be collected. University Communications has been using hotjar. Contact the team for more details.
Tracking Tags
These guidelines apply to adding Google Analytics to UBCMS websites.
- All sites in the UBCMS are required to run the main tracking code (GTM-T5KRRKT). The main code can be disabled for an individual page in the Google Analytics section in the Advanced tab of that page's Properties, but we strongly discourage this action.
- Please be aware that while adding multiple Google Analytics codes should not have a large impact on page performance, adding analytics scripts to pages (e.g. for heat mapping) can have an impact. Always be cautious before adding any custom code to your pages, and test for function and accessibility as recommended for all customizations.
- A single code can be added by entering its type and ID in the Google Analytics section in the Advanced tab of page Properties. This will be applied to child pages as well, so it is typically set on your home page and is the preferred way to add a second code.
- Additional codes can also be added in an HTML Snippet in your site's header, with custom JavaScript to load it on every page of your site. But the page Properties method is preferred to this approach.
- Custom HTML code, such as analytics snippets can also be added to the <head> section of an individual page under Head Content in the Advanced tab of that page's Properties. This code only applies to that one page.
To work correctly, Google Analytics can be placed in an HTML Snippet on the header (or footer), or in the Properties of your site's home page, but NOT in the header or footer page Properties.
Access to GA4/GTM
Author Debugging Tools
- This trick is good for debugging page problems in live sites and Author.
- Simply add "?nocustom=1" to the end of the URL in the browser location bar to turn off any custom code that is not normally part of the UBCMS which may be interfering with page behavior.
- e.g. compare https://www.buffalo.edu and https://www.buffalo.edu?nocustom=1
- nocustom temporarily suppresses:
- HTML snippets
- External embeds
- “Head HTML” from page properties
- Custom HTML from design properties
- main.css and main.js from design folders
- Google Tag Manager
- Shared Content Reference components directly including CSS or JS files
- “customize” nodes
- This trick is good for debugging and fixing page problems in the Author environment.
- It reduces the page to a skeleton view, so it is easy to find all the components including any that are hidden.
- Components can be modified normally, or temporarily turned off, before the page is then re-displayed.
- Switch to Preview Mode then add "?rescuemode=1" to the end of the URL in the browser location bar. e.g. https://ubcms-author.buffalo.edu/content/your-domain/your-site.html?rescuemode=1
- This does not disable all CSS but renders most components in a data-only way which can block the effects of misbehaving components that might mess up the whole page. It can also reveal empty or invisible components that cannot otherwise be edited or deleted.
- This trick allows you to preview a page in Author as if it were published live.
- Temporarily disable most of the author environment on a page, including the Edit Console toolbar.
- Switch to Preview Mode then add "?wcmmode=disabled" to your page’s URL in the browser location bar.; e.g. https://ubcms-author.buffalo.edu/content/www/cmshelp.html?wcmmode=disabled
CRXDE
location of CRXDE off the Start page
The link to CRXDE is off the Start page. Look on the left for the Tools hammer icon. Click that to reveal 'General'. Click that to reveal the link to CRXDE (developers only).
Tag Admin Console
location of Tag Admin Console off the Start page
The link to the Tag Admin Console is off the Start page. Look on the left for the Tools hammer icon. Click that to reveal 'General'. Click that to reveal the link to Tags (admins only).
User Admin / Group Manager
location of User and Group Manager admin tools off the Start page
The links to the User Admin and Group Manager Tools are off the Start page. Look on the left for the Tools hammer icon. Click that to reveal Security. Click that to reveal the link to both user tools (admins only).
Emulator / Mobile Device Simulator
Display your page as it would appear in mobile phones and other size devices.
Copy Content to Another Page
You can copy and paste content from one browser tab to another.
Compare Pages (DIFF)
Compare two versions of a page, usually the current with the last published.
Compare Two Different Pages
Use this trick to compare two different pages side by side in one window. It's similar to the Diff tool, but for any pages you specify, and without markup.
This example compares two university news releases in from shared content: https://ubcms-author.buffalo.edu/mnt/overlay/wcm/core/content/sites/diffresources.html/content/shared/university/news/news-center-releases/2021/01/001?item=/content/shared/university/news/news-center-releases/2021/01/003&sideBySide
Replace the URL fragments manually:
https://ubcms-author.buffalo.edu/mnt/overlay/wcm/core/content/sites/diffresources.html +
/content/shared/university/news/news-center-releases/2021/01/001
+ ?item=
/content/shared/university/news/news-center-releases/2021/01/003
+ &sideBySide
Sandbox / Experimental Space
In addition to special sandbox areas, ALL UBCMS users have permissions for the QA Server. This server has a copy of all UBCMS sites from Author that is normally refreshed every weekend. Authors can revise a recent copy of their real site to make experimental changes but remember these changes will only be safe until the next sitewide refresh, cannot be directly copied back to the Author environment, and we do not guarantee the QA Server will always be available with a fresh copy of Author pages. (The main purpose of the QA Server is for testing and troubleshooting. Syncing content from Author to QA or temporarily stopping that sync is all in service of carrying out various backend work by our development team.)
QA Authors (require UB network or VPN access):
- https://ubcms-qa.buffalo.edu
- https://cmsauthqa1.acsu.buffalo.edu:8443
- cmsauthqa1 is the primary author, cmsauthqa2 is there as an additional VM where we can do upgrades and testing on, otherwise AEM is not running there normally.
QA Dispatcher - to view live pages (require UB network or VPN access):
- may require UB network or normal VPN access
- e.g. https://ubcms-disp-qa.acsu.buffalo.edu/content/www/news.html
- e.g. https://ubcms-disp-qa.acsu.buffalo.edu/content/nursing.html
Tree Activation Tool
Publish (activate) multiple pages or assets in a specified path of the UBCMS.
Be very cautious with this tool. There is no undo feature!
Especially useful for large numbers of pages, and nested sub-folders. It is also a safer (more controlled) alternative to some AEM tools such as Manage Publication.
The process can be limited to just modified or just activated pages, and can ignore deactivated pages. It also has a 'dry run' mode.
Recommendations:
- Do a dry run first to check paths and number of resources.
- Make sure <path> is included correctly (eg: /content/www/sitename, or /content/sitename).
- Normally, activation takes about 1 minute per 200 pages.
- If connection is lost, the process should continue.
- Activate one tree at a time.
- Do not activate over 500 objects 8:00 AM - 5:00 PM weekdays (replication queues back up and authors complain)
- Status can be checked by by viewing page status indicators in author once they catch up. EAS can also view replication queues and error logs.
SiteImprove
SiteImprove-Only Setting
The 'Siteimprove-Only Block' is located in page Properties, Advanced tab, under Site Visibility, but can only be adjusted by System Admins.
This is normally applied to the home page when a site is first created. It is used to allow advanced access by SiteImprove for pre-launch accessibility testing and normally removed when a site launches.
When set, your live site can only be seen by the SiteImprove platform. People and crawlers will see a 403 server error. It is not a 'noindex' block.
SiteImprove Known Issues (for UBCMS elements)
Page Load Speed
Why We Care
- user retention, especially mobile
- SEO, especially Google
- first page load is more important than it used to be; e.g. clicking a search result, ad, email campaign link
- browser cache is no help here
How We Measure...
- Core Web Vitals (LCP, FID, CLS) - https://web.dev/vitals
- green (90-100) is unrealistic for mobile but commonf or desktop
- yellow (50-89) most pages will be in this range on mobile
- red (0-49) our pages shouldn't scor ethis low without a large external script or iframe but Google expects the average to be 50 so half of pages in general will be in this range including our many of our peers
- “Lab” Measurements - force a measurement
- Google PageSpeed Insights - https://pagespeed.web.dev
- Lighthouse - in Chrome DevTools and elsewhere - https://developers.google.com/web/tools/lighthouse
- Web Vitals Chrome extension - https://chrome.google.com/webstore/detail/web-vitals/ahfhijdlegdabablpippeagghigmibma
- “Field” Measurements - log what real users actually experience
- Chrome User Experience Report - https://developers.google.com/web/tools/chrome-user-experience-report
- Google Search Console Core Web Vitals Report - https://support.google.com/webmasters/answer/9205520
What Matters...
- Mobile devices
- mobile processor speeds are slow
- mobile network conditions are slow and unreliable
- Fonts
- Javascript, especially at the top of the page
- Third-party embeds (scripts, iframes)
- Duplicate or unnecessary analytics tags
What Doesn't Matter (as much)...
- desktops/laptops typically fast and well-connected
- images (somewhat, but we optimize for you)
- off the screen / below the fold - does not contribute to LCP
- video - does not contribute to LCP
- background images - does not contribute to LCP
What You Can Do...
- consider the impact of everything you put on each page (cost/benefit)
- think even harder about what you put on every page (header, footer)
- watch for scripts, iframes, tags in GTM
- move slow things lower down the page / below the fold
- turn heavier analytics off when not needed (e.g. heat tracking)
- measure and test
Learn More, Including What We're Doing For You
Formstack Forms
RSS Feeds (from external sources)
Master Classes
Embedding I - Developer Master Class (5/8/2014)
Solutions Group Date: May 8, 2014
Presenter: Kevin Eye
Embedding II: Accessing UBCMS Content via REST APIs - Developer Master Class (7/31/2014)
Solutions Group Date: July 31, 2014
Presenter: Kevin Eye
Making Your Pages Load Faster (1/21/2022)
Solutions Group Date: January 21, 2022
Presenters: Rebecca Bernstein, Nick Peterson, Kevin Eye & Mary Henesey