Params appears in an ambiguous context within a URL

support
1

I have html template for inline css below

<style>
{{ if and (eq .Type "collection") (eq .Params.layout "list") }}
    .hero-bg::before { background-image: url(/uploads/{{ .Params.hero_bg | safeCSS }}); }
    {{ with $collListStyle }}{{ .Content | safeCSS }}{{ end }}
{{ end }}
</style>

the result was error

{{.Params.hero_bg | safeCSS}} appears in an ambiguous context within a URL

any idea?

thanks

2

CSS background image URLs need to be quoted

Edit: something like:

.hero-bg::before { background-image: url('{{ printf "/uploads/%s" .Params.hero_bg | safeCSS }}'); }
1 Like
3

No luck still the same error, but strangely it works in homepage condition without quote at all

{{ if .IsHome -}}
    .hero-bg::before { background-image: url(/uploads/{{$.Site.Params.hero}}); }
{{ end }}
4

This works for me for homepage and regular pages. I supplied front matter as

hero_bg: some-img.jpg

What does that param actually look like?

5

I’m using colon

hero_bg: "some-img.jpg"
6

Me too. It’s YAML, so those values are equivalent.

Since your error cannot be reproduced off the original code snippet, you need to share your repo, or create a small sample project that reproduces your issue and share that.

1 Like