image alignment and figcaption tag issue. about hugo-theme-hello-friend HOT 5 CLOSED

Hi @panr Image now centered but the title does not appear because <img> tag does not have the title attribute.

your shortcode input
{{< image src="/img/spot.gif" position="center" title="This is title" >}}

html output
<img src="/img/spot.gif" class="center">

actually it should be this way --> https://www.w3schools.com/tags/tag_figcaption.asp

from hugo-theme-hello-friend.

@hazar-e

Ok, now you have figure shortcode with props:

• src (required)
• alt (image alt)
• position (left is default; figure position left | center | right)
• style (image additional styling)
• caption (figure caption)
• captionPosition (center is default; but you can set it to left | center | right)
• captionStyle (caption additional styling)

from hugo-theme-hello-friend.

Hi @hazar-e 👋🏻 I’ve just added a shortcode {{ < image > }} to help you with this issue. Shortcode has one required prop src just like default html element and few optional: alt (String), position(left | center | right) and style (for any additinal CSS inline styling props).

If you don’t know what shortcodes are, please read Hugo docs
https://gohugo.io/content-management/shortcodes/

from hugo-theme-hello-friend.

Oh, now I see. I made image shortcode, not figure. I'll fix it today ;-)

from hugo-theme-hello-friend.

@panr thank you for your interest. Good work.

from hugo-theme-hello-friend.