-
Notifications
You must be signed in to change notification settings - Fork 192
Inserting Figures
Rise edited this page Sep 17, 2021
·
7 revisions
To post a centering image, you can:
<center>
![](search_result.jpg)
</center>
NOTE: The blank lines matter, don't remove them.
To insert images in HTML, such as <img src=... />
, there is a limit. Hugo's Markdown renderer doesn't allow raw HTML code by default.
To enable raw HTML support in Hugo, please configure your config.toml
:
[markup.goldmark.renderer]
unsafe = true
And don't raise issues on this, please. Because it's implemented by Hugo. You can give a feedback to Hugo's Markdown renderer, GoldMark
.
Inspired by this issue, I ported a shortcode from cupper-hugo-theme. Thanks for zwbetz-gh's code.
Additionally, I add a property align
for aligning.
{{< insertFigure
img="resource_name"
caption="This is an example figure. For details, view [here](https://github.com/AmazingRise/hugo-theme-diary/issues/55)."
command="Resize"
align="Right"
options="700x" >}}
NOTE:
-
img
: it can be a resource name; or a file's name, which is located in current directory. How to define a source? -
caption
: will be shown beneath the figure (markdown supported). -
command
: it can beFit
,Fill
,Resize
, orOriginal
. -
align
: possible value:Left
,Right
,Center
,Justify
(it is not case-sensitive). -
options
: parameters, please see image processing methods.
In fact, this shortcode is equivalent to Image processing methods.