Fingerprinting CSS File

support
1

Little help on fingerprinting the CSS file. I have only one CSS file. I wanted to fingerprinting.

<link rel="stylesheet" href='{{ "./css/style.css" | relURL }}' media="print" onload="this.media='all'">

Can you help me on how to fingerprint this?

Thank you

2

assets/css/style.css

.foo {
  color: red;
}

layouts/_default/baseof.html

...
{{ $style := resources.Get "css/style.css" | fingerprint }}
<link rel="stylesheet" href="{{ $style.Permalink }}">
...

See https://gohugo.io/hugo-pipes/introduction/#asset-directory.

1 Like
3

you can add integrity

{{ $style := resources.Get "css/style.css" | fingerprint }}
<link rel="stylesheet" href="{{ $style.RelPermalink }}" integrity="{{ $style.Data.Integrity }}" />

not re-posted the first line from above, always needed!

1 Like
4

Little help…

Error: add site dependencies: load resources: loading templates: "/Users/sureshkumar/Documents/GitHub/thesitebuild/themes/statecitytheme/layouts/partials/footer.html:11:1": parse failed: template: partials/footer.html:11: undefined variable "$style"
5

Please post all of your code, not just this one line.

6

Hey Hi, It’s a private Repo.

If you like to see the code… I will send you the repo request.

Thank you
Suresh

7

No, just the code for this one file.

8

Sure, here is the footer file code.

If you need anything more let me know.

I already have critical CSS code at the header, hence adding the css file at the footer of the site.

9

There is no $style in this code. I guess it is not the one responsible for the error.

10

Please re-read my original response. You must:
a) Place your CSS in something like assets/css/
b) Access the CSS with resources.Get
c) Then do something with the resource (fingerprint, integrity)

1 Like
11

Yeah @jmooring I did tried your solution too. It didn’t worked.

Guess, I have to give you the whole repo access. Shall I dm you the access?

12

Found the solution for this!

The assets folder should be in the theme folder.

theme name → Assets → CSS

In my custom css setup it was everything in static as I had hard coded the css file.

Now after moving the location of assets folder into theme folder… it’s started to working.

@jmooring I missed your solution of adding the asset folder in theme folder. That was causing the issue. Now it’s solved.

Appreciate the help. @jmooring , @divinerites , @ju52

13

Hugo Pipes Introduction | Hugo (gohugo.io)

Use the theme asset directory for theme assets, all other should go to /assets
IF you don’t set another path in CONFIG

14

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.