How to preserve text in <style> tags

support
1

I’m trying to get a custom shortcode to output an HTML style tag.

css.html shortcode:

<style class="example-css">
  {{ printf "%s" .Inner | safeHTML }}
</style>

sample use:

{{% css %}}
  body {
    background: green;
  }
{{% /css %}}

expected output:

<style class="example-css">
   body {
     background: green;
   }
</style>

actual output:

<style class="example-css">  
  ZgotmplZ
</style>

Not sure why Hugo is generating that random text. I just need it to pass through the code passed into the shortcode as plain text. Note that if my shortcode uses a div instead of a style tag, it works as expected (but doesn’t apply CSS like I need it to).

2

Ahh I figured it out. Here it is for anyone else that comes looking for how to do this:

{{ plainify .Inner | safeCSS }}

1 Like
3

:smile: Sorry to Bother you, That way

hugo:v0.53-DEV

{{% rawcss %}}
.blog-post > h2:first-child{
  display:none;
}
{{% /rawcss %}}
  • output
<style class="example-css">
.blog-post &gt; h2:first-child{ display:none; }

</style>

Note: >>> &gt show up, How can I unescape ?

Thinks

4

:white_check_mark:Ok, it Work

Luck for me, I found the way that solve it

<!-- raw css -->
<style class="example-css">
{{ htmlUnescape .Inner | safeCSS }}
</style>

htmlunescape:> gohugo docs

  • input
{{% rawcss %}}.blog-post > h2:first-child {display:none}{{% /rawcss %}}
  • output
<style class="example-css">
.blog-post > h2:first-child {display:none}
</style>
1 Like