Using a variable to define image path

I have been searching through the documentation and just cannot find the solution.
I am new to Hugo, want to migrate old site from WP to Hugo.
The wp to hugo coverter has left me with this code for when an image is inserted in a post:


Now I would like to convert this to markdown in a way that doesn’t have the full url baked in the code.
Like for example this:

![image alt text](/my_image.png)

However can I have this location set with a variable or will it always point to the static folder?
For example I would like to try migrating all the images that are currently on the old wordpress website to point to a public S3 bucket like

or an image repository service like Cloudinary or Cloudimage.

What I think you want to look into is Markdown Render Hooks (they should pop up if you use the search on the docs site).

1 Like

Hi @McDragon

I’m using Cloudinary for hosting my images … I use a Shortcode which means I dont have to write the full-URL when adding an image – i think this is what you are asking?

So instead of writing this in markdown…

I do something like

{{< shortcodename "folder/imagename.png" "alt image title" >}}

I’ve also figured out how to make it responsive - so you don’t need to keep all the duplicates of the image set

You can find details on the cloudinary shortcode and how to use

You can then use the same approach for other image hosts if you want

Thank you @damien1 for your suggestion. Does this “future proof” my posts so I could use any source. Local or external sites like aws, cloudinary or cloudimage?
I really don’t want to switch to a proprietary solution. I guess there is an old-fashioned search and replace and run it through you posts to change the source but I think that is a rather old-fashioned method.

Yes its likely you would need only revise the shortcode file itself and not have to do a search and replace.

1 Like