How to modify front-matter to have a correct image folder with asciidoctor

support
1

Hi,

I use Hugo with gitlab CI to render my website made with asciidoctor.

All my *.adoc files are locally in /content/post and I succesfully render them always locally.

When I push my *.adoc files and images one to gitlab, Hugo looks for the images in /images and not in ./images

What could I specify in the front-matter (I guess it’s here) to have Hugo look for images in the right place ?

Here is my front-matter :

---
title: Cryptographie en LoRAWAN
tags: ["cryptographie", "LoRaWAN", "AES", "sécurité", "NwkSkey", "AppSKey"]
date: "2018-11-05"
---

:data-uri:
:imagesdir: ./images

Many thanks :slight_smile:

2

I don’t use GitLab CI so I’m not sure if my suggestion will work for that, but here’s what I suggest:

  1. Do not set the imagesdir attribute in your AsciiDoc Document Header (or anywhere). This will make it easier to figure out what’s going on.
  2. In one of your .adoc files, experiment with images that use relative and absolute paths, e.g.:
    A. image::./images/foo.png[alt text]
    B. image::/images/bar.png[alt text]

For 2B, the abosolute path /images should point to the directory root/static/images. For 2A, the relative path ./images might point to the directory root/content/post/images but I don’t know if Hugo will copy that images directory (that’s a subdirectory of the post directory) to the public directory when you do a build (using hugo as opposed to hugo -server). All my .adoc files are leaf bundles and the relative-path images reside in the bundle. I wrote about how I do things here:

Please let us know if you can get this working. I’m also learning about how to use Hugo and AsciiDoc.

3

2A and 2B didn’t do the job (with gitlab CI and the need for me to generate asciidoctor locally).

I found a workaround by setting in the files header :

:imagesdir: ./content/post/images/

Hugo understands that and copies them.

To generate locally, I use a Makfile with attributes that will override the ones in the documents :

 THEME=flask

FLAGS=-a skip-front-matter -a data-uri -a theme=$(THEME) -a imagesdir=./images

SRCS=$(wildcard *.adoc)
OBJS=$(patsubst %.adoc, html/%.html, $(SRCS))

.PHONY: all
all: $(OBJS)

html/%.html: %.adoc
	@mkdir -p images html src
	@echo "ASCIIDOCTOR     $(basename $@).html"
	@asciidoctor -o $(basename $@).html $(FLAGS) $<
	
.PHONY: clean
clean:
	rm -f html/*

Many thanks for your ideas, they led me to find a solution. Hope my reply be of any help :slight_smile: