Image in page bundles for organization, output to shared directory for saving space?

support
1

Hi all,

I have an issue I am trying to resolve. We are working on a large multi-lingual webpage with a lot of images. In order to be able to efficiently author and edit articles, we organized everything in page bundles. However, upon rendering we noticed that all images are duplicated for each language. This results in a very large output.

Content organization:

post-about-something-interesting/
├── images
│   ├── image1.jpg
│   ├── image2.png
│   ├── image3.png
│   ├── image4.jpg
│   ├── image5.jpg
│   ├── image6.jpg
│   ├── image7.jpg
│   └── image8.jpg
├── index.de.md
├── index.en.md
├── index.es.md
├── index.fr.md
└── index.pl.md

Output of generated pages

public/fr/post-about-something-interesting/
├── images
│   ├── image1.jpg
│   ├── image2.png
│   ├── image3.png
│   ├── image4.jpg
│   ├── image5.jpg
│   ├── image6.jpg
│   ├── image7.jpg
│   └── image8.jpg
├── index.html

public/en/post-about-something-interesting/
├── images
│   ├── image1.jpg
│   ├── image2.png etc
├── index.html

public/es/post-about-something-interesting/
├── images
│   ├── image1.jpg
│   ├── image2.png etc
├── index.html

public/de/post-about-something-interesting/
├── images
│   ├── image1.jpg
│   ├── image2.png etc
├── index.html

Is there a way to tell Hugo to copy the images in page bundles in to a shared output directory? This will help both with rendering in the development version as well as caching of media in the browser.

What are other options for addressing this issue?

Thank you!

2

Don’t put your images in page bundles.

1 Like
3

I don’t know if it is relevant in your case, but I could have a very simple image management where I only put images in only ONE language folder and images are available on other languages.

This conf also allows to show a non translated page in all the languages.

You’ll have to mess around my conf and see if it works for your use case.

config.toml

#------------------------------------------------------------------------------
# BLOG Content mounts (Missing EN filled with FR)
#------------------------------------------------------------------------------
[module]
  [module.hugoVersion]
   min = '0.96.0'

# EN content
[[module.mounts]]
source = 'content/english'
target = 'content'
lang = 'en'
# FR content
[[module.mounts]]
source = 'content/french'
target = 'content'
lang = 'fr'


# FR BLOG content
[[module.mounts]]
source = 'content/french/news'
target = 'content/news'
lang = 'fr'

# EN BLOG content
[[module.mounts]]
source = 'content/english/news'
target = 'content/news'
lang = 'en'

#------------------------------------------------------------------------------
# Fill in the missing translations
#------------------------------------------------------------------------------
# This fills in the gaps in FR content with EN content
[[module.mounts]]
source = 'content/french/news'
target = 'content/news'
lang = 'en'
4

See https://discourse.gohugo.io/t/hugo-creates-a-copy-of-each-image-for-each-translated-version-of-a-page/42922/4

5

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.