I'm creating a page. I have a site-wide parameter defined in my default config.toml file like this.
[Params]
tdName= "Mr. Tournament Director"
In my page I'm writing:
{{ .Site.Params.tdName }}
Rather than the string in quotes, the code below that is litterally showing up when I run the "hugo server" command. What am I doing wrong?
Thanks.
Another option is to use Hugo's built-in param shortcode like this:
{{< param tdName >}}
To learn about this built-in shortcode, see:
https://gohugo.io/content-management/shortcodes/#param
https://github.com/gohugoio/hugo/blob/master/tpl/tplimpl/embedded/templates/shortcodes/param.html
To specify Go template code in a file in the content directory, you need to use a Hugo shortcode. For example, you could use this inline shortcode:
{{< tdname.inline >}}
{{ site.Params.tdName }}
{{< /tdname.inline >}}
To use inline shortcodes, as I do above, you need to set enableInlineShortcodes to true in your config file.
Note that:
site.Params.tdName is usually equivalent to .Site.Params.tdName but is better because it is context free (no leading dot (.))
Hugo has some weird case sensitivity issues so I recommend that you change tdName to td_name or tdname or something without upper case characters.
Related
So I am building my first data blog with RStudio and Blogdown and I am seriously stuck on something small but infuriating.
https://data-issues.netlify.app/
Above is the site I am building. I made a logo for it but I would like to make this centered. How would I do so in my markdown (.md) file.
Code here:
---
# Homepage
type: widget_page
# Homepage is headless, other widget pages are not.
headless: true
weight: 1
design:
columns: "1"
---
{{< figure src=/datavision.png theme="light" class="center">}}
EDIT: added this too to no avail
<p align="center">
</p>
I am using .md files, so where exactly would I define the shortcode for p if not here?
As #YihuiXie said in the comment section below, you don't really need to use a shortcode for raw HTML, there are multiple solutions that you can use.
Edit your config to use raw HTML in Markdown
In your config.toml enter:
[markup]
[markup.goldmark]
[markup.goldmark.renderer]
unsafe = true
If you have in your project config.yaml use this:
markup:
goldmark:
renderer:
unsafe: true
This enables raw html support in markdown files, in this way you don't need to use shortcodes.
https://gohugo.io/news/0.60.0-relnotes/
Raw HTML using Shortcodes
Depending how your project is structured, there should be some kind of layouts folder. I have a project made with Hugo and I have a something like this ../layouts/shortcodes/rawhtml.html with this code:
{{.Inner}}
For example in your code you're already using a Hugo’s Built-in shortcode. After you create the file, you just need to insert your shortcode in this way in your Markdown:
{{< rawhtml >}}
<img src=/datavision.png class="center">
{{< /rawhtml >}}
The custom CSS code should be defined in ../static/css/, in your config.toml, simply check if there is a variable to set your custom CSS code, for example:
# Custom CSS
customCSS = ["/css/custom.css"]
I used this configuration because the theme required it, but it can be different in your project so keep this in mind. If you don't want to use another file to save your CSS code, you can simply insert it into your shortcode like I did with the HTML, for example:
{{< rawhtml >}}
<style>
.center{
/* your code here */
}
</style>
{{< /rawhtml >}}
Use HTML for content pages instead of Markdown
With Hugo, you could also use a HTML instead of a md file in your project. It simply follows the same syntax, but you have to use HTML instead of the Markdown syntax, for example:
---
title: "Contact me"
---
<p>
Some text here
</p>
In this case you don't need the shortcode from the moment you're already using a HTML.
I have 3 images that start with the PAGENAME and have different endings. Now I want to display them in a gallery like this:
<gallery>
File:{{PAGENAME}}.png|Adult
File:{{PAGENAME}} Egg.png|Egg
File:{{PAGENAME}} Baby.png|Baby
</gallery>
But the PAGENAME doesn't transclude and the gallery stays empty.
How can I achieve that?
Thanks
edit: I would also like to add the mode="slideshow" parameter to it
Html tags have priority in page content parsing, which means that any parser function inside is interpreted as string. So you need to turn them into a parser function, using #tag
{{#tag:gallery | content }}
Note that you cannot have literal pipes inside content, you have to turn them into a template call, using build-in pipe template:
{{!}}
You'll end up with this code:
{{#tag:gallery |
File:{{PAGENAME}}.png{{!}}Adult
File:{{PAGENAME}} Egg.png{{!}}Egg
File:{{PAGENAME}} Baby.png{{!}}Baby
|mode=slideshow}}
I am using Mustache Template in my HTML DOM to generate some Dynamic contents.
I am using {{ }} inside HTML tags for that..
Now i want generate non HTML dynamic extension, for that i have {{{ }}}
But i dont know the difference between both.
so, what is the difference between these 2?
See the manual
The most basic tag type is the variable. A {{name}} tag in a basic
template will try to find the name key in the current context. If
there is no name key, the parent contexts will be checked recursively.
If the top context is reached and the name key is still not found,
nothing will be rendered.
All variables are HTML escaped by default. If you want to return
unescaped HTML, use the triple mustache: {{{name}}}.
I'm using Jekll and kramdown to build a static side.
I am often repeating the same large paths to things in assets in image tags, like:
Can I somehow save the /assets/foo/bar/2019-03-17/more/stuff portion in a per-page variable so I can refer to it succintly in the markdown, like:
Yes, you can set it in the front matter. You can set custom variables for each page.
---
... other stuff in front matter
myPath: /assets/foo/bar/2019-03-17/more/stuff
---
<p>........ </p>
but it simply displays
.....
[Hello World]({% post_url 2015-01-19-soccer %})
.......
what am I doing wrong?
Since you used a mix of Markdown and HTML, which is causing the markdown processor to ignore anything in between the HTML blocks.
Markdown is also sometimes not processed when you have HTML right above the Markdown. (This is the case for you, since your example shows you have closed off the <p> tags)
There are a few ways around this.
Make sure there is a newline in between any HTML and Markdown, this will not show up as a <br> or a <p> in the final output, but rather ensures that the processor will convert the Markdown correctly.
So you should have something like this:
<p>......</p>
[Hello World]({% post_url 2015-01-19-soccer %})
<p>........ </p>
Notice the extra line there between the first <p></p> and the Markdown.
Use only HTML (this is as answered by user #topleft)
Use only Markdown, since <p> tags are supported.
Try the markdown=1 HTML attribute.
Markdown processors like Kramdown allow you to add an explicit tag to tell the processor to go through HTML blocks and process any Markdown there. I'm assuming you're using the default (which I believe is Redcarpet) and couldn't find the links on whether this is supported. But you can try this:
<div id="someDiv" markdown=1>
[This is a Markdown link that will be parsed](http://www.example.com)
</div>
You are using markdown language here, it won't work in html. You need to use that instead :
Hello World
site.baseurl default is empty
you can change it in _config.yml to suit your needs
for instance :
baseurl: "me/blog"