CODEWITHSUNDEEP
markdownline-breakshugoblogdownhugo-shortcode
Philipp Gärtner
Philipp Gärtner

Reputation: 196

How to insert a linebreak in hugo image tag title element?

I am using blogdown and kakawait/hugo-tranquilpeak-theme to write a plain markdown blog post. When I add images with the shortcode option tag such as 

{{< image classes="fancybox right clear" src="image2.png"     
thumbnail="http://google.fr/images/image125.png" group="group:travel"   
thumbnail-width="150px" thumbnail-height="300px" title="A beautiful    
sunrise" >}}

I am unable to break the title of the image. Now I have 

A beautiful image

But I would like 

A beautiful 
image

BTW, these breaks:

\n
<br>
<br />

don't work for me. Any idea how to solve this?

Upvotes: 7

Views: 4534

Answers (2)

Rajiv Singh
Rajiv Singh

Reputation: 3937

We can use Shortcodes to break lines.

Make line_break.html file inside layouts/shortcodes and add <br /> tag to it. So line_break.html file will look like this:

<br />

Now you can use this Shortcode to your markdown file by adding {{< line_break >}}. So in your case, it will look like this:

A beautiful
{{< line_break >}}
image

Upvotes: 2

Waylan
Waylan

Reputation: 42517

The HTML5 spec states:

If the title attribute's value contains "LF" (U+000A) characters, the content is split into multiple lines. Each "LF" (U+000A) character represents a line break.

What does your generated HTML look like? Is the line break being stripped out? If so, that is the falt of the tools you are using. You may need to file a bug report.

Upvotes: 0

Related Questions