I have some foo.md which is using some foo.html template. Say that I add css: /static/css/foo.css in foo.md. What would I need to do inside foo.html to insert a <link href="/static/css/foo.css" media="all" rel="stylesheet" type="text/css"> inside <head> which is defined in baseof.html ? I want to …

The define in baseof.html is to supply a default. I seem to recall in one of my experiments hugo complained about a missing definition for the block. Apparently I was mistaken, so the last line of baseof.html can go. [image] alexrt: You’re not calling the nifty.html partial from anywhere Not…

If i call the partial then that page ends up empty. Every other generated page seem to get the customcss. if you comment out the partial, then that page gets generated, with the custom css. However, both single.html and list.html layout file do define "main" so I can’t say I understand how block ac…

[image] alexrt: If i call the partial then that page ends up empty. In single.html you have added code outside of the definition of “main”. This is documented to generate unexpected results.

check baseof.html for a head partial, my looks like <!DOCTYPE html> <html {{ with site.Language.Lang }}lang="{{ . }}"{{ end }} > {{ $section := .Section | default "home" }} {{ partial "meta" . }} <body> {{ partialCached "aside" . $section }} {{ partialCached "navigation" . $section}} {{ block "main…

@ju52 Thanks for the feedback. Your setup works but the inclusion of the css files is controlled by page frontmatter. What I would like to achieve is that the inclusion depends on whether a particular feature is actually used on the page.

In baseof.html or in a partial called within the <head> of baseof.html… {{- $shortCodeName := "foo" -}} {{- $regex := printf "{{(<|%%)\\s%s\\s(>|%%)}}" $shortCodeName -}} {{ with findRE $regex .RawContent }} <link rel="stylesheet" href="foo.css"> <script src="foo.js"></script> {{ end }} This l…

It is getting interesting! This is a step forward… the inclusion if now controlled by the (raw) contents of the page. Usable in a number of situations. The ultimate goal remains: Can I do something in the shortcode to control the inclusion? (The answer may be ‘no’, but the question is intriguing.…

Sure. For example: layouts/shortcodes/foo.html: <span data-foo>{{ .Inner | .Page.RenderString }}</span> Then, in baseof.html, use findRE against .Content instead of .RawContent to look for data-foo: {{- $regex := "data-foo" -}} {{ with findRE $regex .Content }} <link rel="stylesheet" href="foo…

Bingo! So the magick is: have the shortcode generate something ‘visible’ in the content, and examine the content in the base template. Nifty.

I find this quite awkward (and prone to future portability issues) … is this the best we have? It sounds like block/define should have been the answer but their behavior still stumps me – you can have multiple defines of something and don’t get duplicate content in all pages, while other defines do …

How do I add css/js to `<head>` from partial content/template

support

sciurius July 9, 2020, 6:30am 32

Topic		Replies	Views
How to associate CSS to a specific partial and render it in <head> section of the HTML support	19	707	November 9, 2024
Inline only used CSS styles inside head support	2	299	May 28, 2024
Block in a partial and defining in a page support	5	4263	March 1, 2024
Another newb question support	13	548	November 15, 2018
Adding content to block from mutiple partial templates support	6	750	April 7, 2021

How do I add css/js to `<head>` from partial content/template

Related topics