I'm trying to add simple html such as bullets, underline, bold inside an Custom Experience Editor Notification.

I have followed the example outlined by Marek Below (and looked at many other examples too):

How to provide custom info messages in Sitecore Preview Mode

My custom GetPageEditorNotificationsProcessor pipeline is firing and adding my custom messages and my custom WebEditRibbonForm class is loading when I attach a breakpoint to the OnLoad() method. My RenderNotification() method (which contains my changes) runs and I can see my changes reflected on this line in the RenderNotifications() method:

 this.Notifications.InnerHtml = output.InnerWriter.ToString();

However when I look on the front-end in experience editor my changes are not present. All the text and html set in my custom WebEditRibbonForm class just doesn't show up. The html I try and set from my custom GetPageEditorNotificationsProcessor pipeline is there but it is rendered as text (as seen below). I want to show this as html so that is why I've trying to over-ride the WebEditRibbonForm method to handle this.

enter image description here

I can see that PageEditorNotificationOption items are rendered as links so it is possible to support html somehow but It's not working for me.

One other thing I noticed is that the markup for the message is like so:

<div class="sc-messageBar-messageText-container">

Yet this doesn't match up with the markup in my pipeline which is like so:

<div class="scPageEditorNotification">

This suggest that perhaps some js such as that in MessageBar.js and the knockout view of MessageBar.cshtml is being used instead (as that markup matches) but when I try and edit these files I am seeing no changes in Experience Editor either. Very confusing.

Further info: Sitecore 8.2 update 7

  • Which Sitecore version? – Marek Musielak Nov 15 '19 at 14:12
  • Sorry forgot to say 8.2 u7 – Adam Seabridge Nov 15 '19 at 14:33
  • In Sitecore.Speak.Components.Web.dll there is _sitecore_shell_client_Business_Component_Library_version_2_Layouts_Renderings_Common_MessageBars_MessageBar_cshtml class which renders output of MessageBar html. In theory it should be enough to replace text binding with html binding in line containing data-bind="text: viewModel.Text() but I wasn't able to find how you can replace Sitecore implementation with custom one. I thought it's the /sitecore/client/Business Component Library/version 2/Layouts/Renderings/Common/MessageBar item from core database, but it didn't work for me. – Marek Musielak Nov 15 '19 at 20:18
  • Thanks for looking into this Marek, I’m not going mad then 🙂. I wonder if anyone else had done this and knows how to solve this issue. – Adam Seabridge Nov 15 '19 at 20:30
  • So because Marek is right - I won't steal his wind :) The only thing that is wrong is that this one is actually using the verison 1 of speak and not version 2 - so the control is located in /sitecore/client/Business Component Library/version 1/Layouts/Renderings/Common/MessageBar and you have to change the text: to html binding in the file located on this path - '/sitecore/shell/client/Business Component Library/Layouts/Renderings/Common/MessageBars/MessageBar.cshtml' – nsgocev Nov 16 '19 at 14:54

If we combine what @nsgocev wrote in his comment and what I wrote in mine, we have the following answer:

  • create a duplicate of /sitecore/shell/client/Business Component Library/Layouts/Renderings/Common/MessageBars/MessageBar.cshtml file and change the text: binding to html: binding in every line containing data-bind="text: text, attr: { title: text }"
  • find the /sitecore/client/Business Component Library/version 1/Layouts/Renderings/Common/MessageBar
  • update the path field to the path of the duplicated file enter image description here
  • as Speak is heavily cached, always create a copy of cshtml file and update the path, otherwise it may not work
  • and proof that it's working (thanks to @nsgocev): https://www.screencast.com/t/rlDkWp2u
| improve this answer | |
  • Awesome. Thanks @nsgocev and Marek. I'll give this a go but it looks like this should solve the issue :-) – Adam Seabridge Nov 19 '19 at 9:48

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.