Scott Reed
Mar 14, 2023
  408
(2 votes)

Restoring Help Text For Description in Latest Optimizely CMS

It's been a well known CSS hack for a while to force the showing of the description text for a property in to the editor view rather than a hover as per these articles

https://buildoptimizely.com/episerver/optimizely-cms-12-help-text-and-expanded-input-text-boxes/ 

https://talk.alfnilsson.se/2014/12/18/display-help-text-in-on-page-editing/ 

However in a recent version of CMS this broke due to updated UI around the all properties view.

With the following replacement CSS this will restore a similar features

div.dijitTabPaneWrapper div:has(div.oui-pop--over) {
    display: block !important;
}


div.dijitTabPaneWrapper div.click-area {
    display: none !important;
}

div.dijitTabPaneWrapper div.oui-pop--over {
    border: none !important;
    max-width: 600px;
    font-style: italic;
    color: red;
}

With this applied you'll get an interface that looks like this

This is working in Chrome and Edge and will restore the inline text and remove the popup icon, only for the main properties area.

I've highlighted it red but feel free to modify.

As per the previous guides this needs to be placed in a CSS file such as this editmode.css

And then registered in a module.config in the application root (not wwwroot) such as

<?xml version="1.0" encoding="utf-8" ?>
<module>
	<clientResources>
		<add name="epi-cms.widgets.base" path="Styles/editmode.css" resourceType="Style"/>
	</clientResources>
</module>
Mar 14, 2023

Comments

Please login to comment.
Latest blogs
Optimizely Search & Navigation - Get autocomplete suggestions in right language

When you are using Optimizely Search & Navigation (Find) to help you generate autocomplete suggestions server side in a multi-language scenario it...

Allan Thraen | Jun 5, 2023 | Syndicated blog

Easy property inheritance in Optimizely CMS

Ever needed a way to inherit property values down through the page hierarchy in Optimizely CMS 12? Now there is an easy way to enable that.

Allan Thraen | Jun 5, 2023 | Syndicated blog

Content Bulk Edit

Bulk Edit is a plugin that allows to make changes to more than one Content at the same time. This can save time by simultaneously updating multiple...

Grzegorz Wiecheć | Jun 5, 2023 | Syndicated blog

Caching & Rendering of metadata from the DAM

For the EPiServer.Cms.WelcomeIntegration.UI 1.2.0 release, we have facilitated the ability to cache and render metadata from assets within the DAM....

Matthew Slim | Jun 2, 2023