Error adding partial view macro to RTE content

Hi all,

A client of ours has a widget they need added to a content page - unfortunately no matter what i do the RTE strips out the important parts of the widget (the script and IDs) when trying to add it.

As such i thought a good work around would be instead to create a partial view macro and have that load in the RTE’s body of content instead. Unfortunately, even after several hours and more forum posts than i can count, i have not found a way to get the macro to work; every time i add it to the RTE i get “error loading partial view script”

What they needed added to the page isn’t complicated, just a couple lines of codes, but unfortunately with the upcoming elections here in the UK they need this sorted asap; and i’m all out of ideas.

Does anyone possibly know how to fix this? I’m working with umbraco 13.1.0

Also here’s the code i’m trying to add (it’s a publicly available widget so it’s fine for me to share it)


<noscript>
<a href="https://whocanivotefor.co.uk">Find election information at
<span aria-label="Who Can I Vote For">WhoCanIVoteFor.co.uk</span></a></noscript>
<div id="dc_wdiv" data-language="cy" data-candidates="false" aria-live="polite" role="region"></div>
<script type="text/javascript"
  src="https://widget.wheredoivote.co.uk/wdiv.js">
</script>

Hey @abidelaney , you’re actually dealing with two separate issues here,

1. Macros

Macros still work in v13 but they’re on the way out and are removed entirely in v14. The annoying part is that “error loading partial view script” is a pretty generic error it usually means Umbraco couldn’t render the partial (e.g. wrong path, model mismatch, etc.), so it doesn’t give much to go on.

2. The RTE stripping your script

This is the actual culprit. TinyMCE strips <script> tags by default for security reasons, which is exactly why your widget keeps getting mangled on paste. you can whitelist scripts via Umbraco:CMS:RichTextEditor:ValidElements in appsettings.json by appending script[*], but it introduces XSS risk and editor instability so it’s not really worth it.

Here’s what I’d actually dooo:

Option 1 - Fastest to ship (Textarea property)

Add an embedCode Textarea property to the document type, let editors paste the widget in there, and render it in your template with:

cshtml

@Html.Raw(Model.Value("embedCode"))

Just make sure only trusted editors have access since this bypasses sanitisation.

Option 2 - Cleanest (hardcode in template)

If the widget lives on one specific page and never moves, just drop it straight into the Razor template. Nothing to configure, nothing to strip, done in minutes.

Option 3 - Proper v13 approach (RTE Blocks)

If the client needs to control placement inside the RTE:

  • Enable Blocks on the RTE data type in the backoffice

  • Create a WidgetBlock document type

  • Add a partial at /Views/Partials/RichText/widgetBlock.cshtml and render the widget there

This is the correct long-term solution but probably overkill given your timeline.

Given the elections deadline, Option 1 or 2 will get you live today. Option 3 is worth revisiting once the pressure is off hehe. Good luck!

/Bishal

2 Likes

Hi @abidelaney

The “Error loading partial view script” in Umbraco 13 is likely due to one of three things:

  1. Wrong inherits directive. Your macro partial view file must start with:

@inherits Umbraco.Cms.Web.Common.Macros.PartialViewMacroPage

If it has @inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage instead (common if you’ve copied a regular partial view), that will cause exactly the error you’re seeing.

  1. Wrong file location. The file needs to be in /Views/MacroPartials/ - not in /Views/ or any subfolder of it.
  2. Path mismatch in the macro configuration. Under Settings > Macros in the backoffice, check that the partial view path set on the macro exactly matches the filename including casing. On Linux hosts this will cause silent failures.

If you wanted to go the RTE approach without macros, you would need to allow script tags in the RTE as it strips them by default. To do this, you can extend ValidElements in your appsettings.json, appending script[*] to the existing list:

"Umbraco": {
  "CMS": {
    "RichTextEditor": {
      "ValidElements": "+a[id|style|rel|...your existing elements...,script[*]"
    }
  }
}

Be aware there is a security trade-off to doing this, so make sure you trust your editors.

Justin

1 Like

Hi @BishalTimalsina12 , thank you so much for the detailed reply, i really appreciate it! I’ll give up on the macro idea, thank you for explaining it to me, i was finding a lot of posts of people having a similar problem with no solution so that explains why :laughing:
The codeneeds to go on two language variations of one page, but sadly we just have a default page we use for almost every page on the site (which is over 400 pages as they’ve made a lot of content over the years.) I may attempt to see if i can get the first option you mentioned working and if that doesn’t work I may edit what RTE is allowed to strip. We’re actually in the middle of remaking the site, as the current site is a poorly done upgrade that has a lot of problems sadly, but this means they’re quite open to short term solutions in the meantime. There’s only two editors so I’m not too worried about them accidentally putting in something they shouldn’t, worst case I’ll tell them to run things by me before they start adding stuff (since it’ll be my job to fix it if it does break anything haha.)

Again, thank you so much for the detailed reply, you’ve been a huge help!
Abi

1 Like

Hi @justin-nevitech, thank you for the reply and the explanations, i really appreciate it!
I did try it with both inherits that you mentioned, and placed it in the correct folder, sadly i still get the same error. It’s the only Macro on the site too currently, and i’ve not got any duplicates of it, so I don’t believe that’s the cause of the error (thank you for explaining though, as when creating the Macro i tried it in a lot of different places as i was struggling to find consistent information on where it needed to be and what it needed to inherit.)
I gave the ValidElements you mentioned a quick go, and it partially worked! I’ll try a few other things and then come back to this as a solution (after I figure out how to get it to stop removing everything else as well :laughing: )
Thankfully since there’s only two editors (and then me being in charge of the backend and keeping the site running smoothly) i’m not too worried about them causing any security problems.

Thank you!

Abi