Trying to use this module, but I can't get any feature to work

[Metamere]

Hi Sean,
I started out using the basic hugo image module, but it doesn't have as much flexibility built into it as yours does. I'd like to be able to use each of the various methods you provided for responsive images though partials, shortcodes, and render hooks. Each one that I try throws errors, ones that seem to be internal to your code, though I'm somewhat new to hugo, just working on my first site for the last month, so I can't be sure if I'm doing something wrong in how I'm calling them. Unfortunately, your test site only shows things called in one way through a loop of parameters, so I can't use it as a reference to see if I need to do things differently or not. I just upgraded to hugo extended amd64 v0.120.0 and am using the current version of this module. I'm working with a weblog post page bundle, attempting to get the header image and content images to work properly like I had them working with the previous image module.

When I try to use a partial, I get an error like so:

ERROR Rebuild failed: render: failed to render pages: render of "page" failed: execute of template failed at <partial "picture" (dict "src" $image "ctx" .Page "alt" "Test image")>: error calling partial: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts\partials\picture.html:1:3": execute of template failed at <partial "hri/picture" .>: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts\partials\hri\picture.html:1:3": execute of template failed at <partial "hri/private/image" (merge . (dict "partial" "picture"))>: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts\partials\hri\private\image.html:31:21": execute of template failed at <partial "hri/private/params/image.html" $params>: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts\partials\hri\private\params\image.html:29:14": execute of template failed at <partial "hri/private/params/image-general" .>: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts\partials\hri\private\params\image-general.html:87:48": execute of template failed at <$page.fit>: can’t evaluate field fit in type string

When I try to place an image using a markdown render hook, it shows this:

ERROR Rebuild failed: "C:\Hugo\Metamere.Art\content\weblog\Old Envelope History\index.md:1:1": "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts_default_markup\render-image.html:18:15": execute of template failed at <partial "hri/private/params/render-hook" .>: error calling partial: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts\partials\hri\private\params\render-hook.html:24:26": execute of template failed at <partial "hri/private/params/render-hook-general.html" $params>: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts\partials\hri\private\params\render-hook-general.html:11:68": execute of template failed at <$page.render_hook>: can’t evaluate field render_hook in type string

When I try to use a shortcode, it shows this:

ERROR Rebuild failed: "C:\Hugo\Metamere.Art\content\weblog\Old Envelope History\index.md:28:1": failed to render shortcode "picture": failed to process shortcode: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts\shortcodes\picture.html:1:4": execute of template failed at <partial "hri/private/shortcode" .>: error calling partial: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts\partials\hri\private\shortcode.html:17:15": execute of template failed at <partial "hri/private/params/shortcode" .>: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts\partials\hri\private\params\shortcode.html:6:25": execute of template failed at <partial "hri/private/params/shortcode-general" $params>: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts\partials\hri\private\params\shortcode-general.html:28:160": execute of template failed at <$page.Param>: can’t evaluate field Param in type string

Also, you say to call a shortcode like so: {{< picture src=image.jpg aspect_ratio=4:3 widths=400,900 alt="Test Image" >}}, but don't you need quotes around all of the parameters? Shouldn't it be like this? {{< picture src="image.jpg" aspect_ratio="4:3" widths="400,900" alt="Test Image" >}} Though I get the same exact error, so I really don't know.

Maybe it's something wrong with the install? But I tried everything I could find on that. I really hope you can help me get started with this.

Thanks in advance,
Ben

[sean-au]

Hi Ben, Thanks for providing feedback, it's hard for me to anticipate every use case, whether it's an error with the docs or a bug. For shortcodes double quotes are only needed for parameter values if there are spaces. Could you commit your project to git and send me the link? My username is sean-au if it's private. Regards Sean

…

On Tue, 31 Oct 2023, 6:53 am Metamere, ***@***.***> wrote: Hi Sean, I started out using the basic hugo image module, but it doesn't have as much flexibility built into it as yours does. I'd like to be able to use each of the various methods you provided for responsive images though partials, shortcodes, and render hooks. Each one that I try throws errors, ones that seem to be internal to your code, though I'm somewhat new to hugo, just working on my first site for the last month, so I can't be sure if I'm doing something wrong in how I'm calling them. Unfortunately, your test site only shows things called in one way through a loop of parameters, so I can't use it as a reference to see if I need to do things differently or not. I just upgraded to hugo extended amd64 v0.120.0 and am using the current version of this module. I'm working with a weblog post page bundle, attempting to get the header image and content images to work properly like I had them working with the previous image module. When I try to use a partial, I get an error like so: ERROR Rebuild failed: render: failed to render pages: render of "page" failed: execute of template failed at <partial "picture" (dict "src" $image "ctx" .Page "alt" "Test image")>: error calling partial: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\ ***@***.***\layouts\partials\picture.html:1:3": execute of template failed at <partial "hri/picture" .>: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\ ***@***.***\layouts\partials\hri\picture.html:1:3": execute of template failed at <partial "hri/private/image" (merge . (dict "partial" "picture"))>: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\ ***@***.***\layouts\partials\hri\private\image.html:31:21": execute of template failed at <partial "hri/private/params/image.html" $params>: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\ ***@***.***\layouts\partials\hri\private\params\image.html:29:14": execute of template failed at <partial "hri/private/params/image-general" .>: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\ ***@***.***\layouts\partials\hri\private\params\image-general.html:87:48": execute of template failed at <$page.fit>: can’t evaluate field fit in type string When I try to place an image using a markdown render hook, it shows this: ERROR Rebuild failed: "C:\Hugo\Metamere.Art\content\weblog\Old Envelope History\index.md:1:1": "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\ ***@***.***\layouts_default_markup\render-image.html:18:15": execute of template failed at <partial "hri/private/params/render-hook" .>: error calling partial: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\ ***@***.***\layouts\partials\hri\private\params\render-hook.html:24:26": execute of template failed at <partial "hri/private/params/render-hook-general.html" $params>: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\ ***@***.***\layouts\partials\hri\private\params\render-hook-general.html:11:68": execute of template failed at <$page.render_hook>: can’t evaluate field render_hook in type string When I try to use a shortcode, it shows this: ERROR Rebuild failed: "C:\Hugo\Metamere.Art\content\weblog\Old Envelope History\index.md:28:1": failed to render shortcode "picture": failed to process shortcode: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\ ***@***.***\layouts\shortcodes\picture.html:1:4": execute of template failed at <partial "hri/private/shortcode" .>: error calling partial: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\ ***@***.***\layouts\partials\hri\private\shortcode.html:17:15": execute of template failed at <partial "hri/private/params/shortcode" .>: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\ ***@***.***\layouts\partials\hri\private\params\shortcode.html:6:25": execute of template failed at <partial "hri/private/params/shortcode-general" $params>: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\ ***@***.***\layouts\partials\hri\private\params\shortcode-general.html:28:160": execute of template failed at <$page.Param>: can’t evaluate field Param in type string Also, you say to call a shortcode like so: {{< picture src=image.jpg aspect_ratio=4:3 widths=400,900 alt="Test Image" >}}, but don't you need quotes around all of the parameters? Shouldn't it be like this? {{< picture src="image.jpg" aspect_ratio="4:3" widths="400,900" alt="Test Image" >}} Though I get the same exact error, so I really don't know. Maybe it's something wrong with the install? But I tried everything I could find on that. I really hope you can help me get started with this. Thanks in advance, Ben — Reply to this email directly, view it on GitHub <#61>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ARTWGAYODIXD5Y6AMDUKWW3YCAAS7AVCNFSM6AAAAAA6WSMLDWVHI2DSMVQWIX3LMV43ERDJONRXK43TNFXW4OZVG44TKMZUGI> . You are receiving this because you are subscribed to this thread.Message ID: ***@***.***>

[Metamere]

Cool, thanks for the tip and for offering to look into things. I just pushed the changes and sent you a collaborator invitation. You can see the tests I was doing in the weblog single.html and the "Old Envelope History" weblog post, with the image module tests being commented out at the moment.

[sean-au]

Thanks, I should have some time later today, I'll let you know how I go

[Metamere]

Sweet, thanks. Getting images set up properly is one of the major stumbling blocks to building my personal site, so I really hope I can get your module working. I'm on US Central time, so I'll have to wait to see what you've found until tomorrow morning, 13 hours from now or so.

[sean-au]

Hi Ben,

Without digging too deep I got this error message:

ERROR Hugo Responsive Images: Page resource image /weblog/post-3//images/image-placeholder.png not found

There may be a slash / that needs to be removed from the start of the image path that you have provided.

Can you look at this (saves me digging through your project. and let me know?

[Metamere]

Looks like I missed a bunch of the images in the frontmatter of pages. I'll need to figure out how to set those up differently, since I had some called from the assets folder, some from a page bundle folder. I commented those things out for now so hopefully that helps us narrow in on the issues.

[sean-au]

Great I'll look at it again I. A few hours

…

On Tue, 31 Oct 2023, 11:47 am Metamere, ***@***.***> wrote: Looks like I missed a bunch of the images in the frontmatter of pages. I'll need to figure out how to set those up differently, since I had some called from the assets folder, some from a page bundle folder. I commented those things out for now so hopefully that helps us narrow in on the issues. — Reply to this email directly, view it on GitHub <#61 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ARTWGAZ3SMAUDMF2KR7SCILYCBDCTAVCNFSM6AAAAAA6WSMLDWVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM3TIMRZG4YDE> . You are receiving this because you commented.Message ID: <future-wd/hugo-responsive-images/repo-discussions/61/comments/7429702@ github.com>

[Metamere]

Oh, good news! That made it so that the render hook and shortcode images loaded fine now.
Still no dice on the partial though.

[sean-au]

Great. Do the partials work?

…

On Tue, 31 Oct 2023, 11:49 am Metamere, ***@***.***> wrote: Oh, good news! That made it so that the render hook and shortcode images loaded fine now. — Reply to this email directly, view it on GitHub <#61 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ARTWGA4PVGH3WBH5U2VJ2ITYCBDJVAVCNFSM6AAAAAA6WSMLDWVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM3TIMRZG4YTO> . You are receiving this because you commented.Message ID: <future-wd/hugo-responsive-images/repo-discussions/61/comments/7429717@ github.com>

[Metamere]

Nope...I pushed it with the changes, so you can see what the error is showing.

[sean-au]

Great thanks I'll get to it later today

…

On Tue, 31 Oct 2023, 11:52 am Metamere, ***@***.***> wrote: Nope...I pushed it with the changes, so you can see what the error is showing. — Reply to this email directly, view it on GitHub <#61 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ARTWGA3MEISI5Z4CDFKZRK3YCBDWNAVCNFSM6AAAAAA6WSMLDWVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM3TIMRZG4ZTO> . You are receiving this because you commented.Message ID: <future-wd/hugo-responsive-images/repo-discussions/61/comments/7429737@ github.com>

[Metamere]

When I went back to test things some more, it went back to not working for even the render hook or shortcode. I don't know what made those work temporarily. I'm not getting any errors unless I turn on something that calls upon your module. Any ideas on things I can try?

[Metamere]

For some reason, it still throws the same render hook error for your module even if I set

[image]
renderHook = false

That seems suspect.

[Metamere]

I tried uninstalling the module, then downloading and transferring files into my project directly, but it still has the same error. So it was definitely not just installed incorrectly. I don't know what else to try.

[sean-au]

Sorry work is hectic at the moment. I should have some time in the next few days!

…

On Wed, 1 Nov 2023, 9:57 am Metamere, ***@***.***> wrote: I tried uninstalling the module, then downloading and transferring files into my project directly, but it still has the same error. So it was definitely not just installed incorrectly. I don't know what else to try. — Reply to this email directly, view it on GitHub <#61 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ARTWGA5O5TOB2QRIV6QIBJLYCF66LAVCNFSM6AAAAAA6WSMLDWVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM3TINBQGM3DK> . You are receiving this because you commented.Message ID: <future-wd/hugo-responsive-images/repo-discussions/61/comments/7440365@ github.com>

[Metamere]

Alright. Though since I hadn't heard from you, I had to move on to try to get something working. I was able to figure out how to get some basic responsive image stuff started with my own render-image.html. I might be better off with stuff that's customizable and simpler like that, but we'll see how things go.

[sean-au]

The short answer is on content\weblog\Old Envelope History\index.md line 7 image: `"images/seal-detail.png"` is not compatible with the module, you need to comment it out, as the image param is used to configure the module via page parameters. I'll have figure out a way to stop this error as the module is looking for a dict when it sees this.

…

On Thu, Nov 2, 2023 at 3:27 PM Metamere ***@***.***> wrote: Alright. Though since I hadn't heard from you, I had to move on to try to get something working. I was able to figure out how to get some basic responsive image stuff started with my own render-image.html. I might be better off with stuff that's customizable and simpler like that, but we'll see how things go. — Reply to this email directly, view it on GitHub <#61 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ARTWGAYRBNN2ZW7SZDMLVZ3YCMOJZAVCNFSM6AAAAAA6WSMLDWVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM3TINJSGI4TQ> . You are receiving this because you commented.Message ID: <future-wd/hugo-responsive-images/repo-discussions/61/comments/7452298@ github.com>

[Metamere]

That makes sense. I must have had that line commented out entirely rather than just being an empty string to make it fail the check I was doing. I renamed those parameters all to frontispiece_image, and it went back to allowing your render hook to work. You may want to set it up to look for something more specific like that to avoid potential conflicts (or else work somehow work around any potential conflicts like you mentioned). Thanks.

[Metamere]

I was able to get the frontispiece image working using your partials! Thanks for taking the time to help me get started with your module. I have some things I would appreciate some clarification on if possible. Is there a way to have the picture partial generate only a single format for the responsive images that is not the original format? When I started with a jpg and set it to just [webp] (or - webp) or even [webp, tiff], it wouldn't display the image at all. It only worked if I included original in there to have it also generate jpgs.

One thing I want to be able to do is to assign an image in a post as the highlight image, to be featured in the frontispiece and weblog card, as well as in the body of the post. The way I had it working last night with the default hugo image module and my custom render hook, it was creating a set of images for each place, so 12 total instead of just 4, even though they had essentially the same names. How would you use your module to make that setup as efficient as possible? My idea for now is to use a fixed width image for two places, and only have the contents be responsive, but I don't know how to prevent it from duplicating things even then, and it seems like there could be a better way. Thanks again.

[sean-au]

Yes I am trying to figure out the best way of namespacing the config. I also need to throw and error if a string is assigned to the image config at any of the places it can be defined (page, image meta or config file) unfortunately coding in modules is very hacky since they are still Hugo templates with very limited language features. For image conversion formats that's easy to control with the formats config item. Just set it to original, or jpeg or whatever you need. If you just want original you can set that in the site config so the whole site only uses original images. But remember that the browser only loads the most economical image. The bottleneck is building the site, and possibly uploading to FTP if that's the way you go

…

On Fri, 3 Nov 2023, 7:39 am Metamere, ***@***.***> wrote: I was able to get the frontispiece image working using your partials! Thanks for taking the time to help me get started with your module. I have some things I would appreciate some clarification on if possible. Is there a way to have the picture partial generate only a single format for the responsive images that is not the original format? When I started with a jpg and set it to just [webp] (or - webp) or even [webp, tiff], it wouldn't display the image at all. It only worked if I included original in there to have it also generate jpgs. One thing I want to be able to do is to assign an image in a post as the highlight image, to be featured in the frontispiece and weblog card, as well as in the body of the post. The way I had it working last night with the default hugo image module and my custom render hook, it was creating a set of images for each place, so 12 total instead of just 4, even though they had essentially the same names. How would you use your module to make that setup as efficient as possible? My idea for now is to use a fixed width image for two places, and only have the contents be responsive, but I don't know how to prevent it from duplicating things even then, and it seems like there could be a better way. Thanks again. — Reply to this email directly, view it on GitHub <#61 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ARTWGA5PU3WYU6CIQQ4IFZDYCQAI5AVCNFSM6AAAAAA6WSMLDWVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM3TINRQHE2DE> . You are receiving this because you commented.Message ID: <future-wd/hugo-responsive-images/repo-discussions/61/comments/7460942@ github.com>

[Metamere]

Ah, cool. Yeah, learning go is interesting. I wish it wasn't quite so funky, but oh well.

As I was saying, It doesn't seem to let me set it to generate only webp from any initial file format except for webp. I can set it to just original, or original+webp, but not just webp. I think that might be a bug then.

Good tip on how loading images work. That makes sense. It turns out there isn't a site storage limit I need to worry about with Netlify, just a bandwidth limit of 100GB for the free tier. So Having jpg and webp isn't as big of a concern in that case I guess, and could be a benefit. But I'll probably be rebuilding and reuploading stuff a bunch in the early stages, so I may just keep it with one format until I get things settled in place a bit more.

[sean-au]

I'll check into the format but issue that you mentioned. One option is checking in your generated images (the resources folder). That will increase git size and upload size but decrease build. You will have to clean the resources folder out of your git history when you have finished building the site. If you need a custom render hook you can copy and paste the file out of my module into your project and modify the code.

…

On Fri, 3 Nov 2023, 12:54 pm Metamere, ***@***.***> wrote: Ah, cool. Yeah, learning go is interesting. I wish it wasn't quite so funky, but oh well. As I was saying, It doesn't seem to let me set it to generate *only* webp from any initial file format except for webp. I can set it to just original, or original+webp, but not *just* webp. I think that might be a bug then. Good tip on how loading images work. That makes sense. It turns out there isn't a site storage limit I need to worry about with Netlify, just a bandwidth limit of 100GB for the free tier. So Having jpg and webp isn't as big of a concern in that case I guess, and could be a benefit. But I'll probably be rebuilding and reuploading stuff a bunch in the early stages, so I may just keep it with one format until I get things settled in place a bit more. — Reply to this email directly, view it on GitHub <#61 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ARTWGAZDODPVQBEUJR3DT5LYCRFGTAVCNFSM6AAAAAA6WSMLDWVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM3TINRSGU4TQ> . You are receiving this because you commented.Message ID: <future-wd/hugo-responsive-images/repo-discussions/61/comments/7462598@ github.com>

[Metamere]

Thanks. I may try working with a custom render hook variation like you suggested. I want to add a link with parameters to be used by Dimbox.js, which I've integrated to allow for magnifying the images, downloading, or cycling through them. I tried making a shortcode that calls your partial, but I seem to have run into an issue. It doesn't seem to like the parameters, even though they should work, unless there's something different about the context for shortcodes? I notice you do a lot of stuff with processing the parameters for your shortcode setups. Is all that necessary, or just the way you chose to do things?

it says:
Error: error building site: "C:\Hugo\Metamere.Art\content\weblog\Old Envelope History\index.md:21:1": failed to render shortcode "picture_pw": failed to process shortcode: "C:\Hugo\Metamere.Art\layouts\shortcodes\picture_pw.html:24:6": execute of template failed: template: shortcodes/picture_pw.html:24:6: executing "shortcodes/picture_pw.html" at <partial "picture" (dict "ctx" . "src" $img "alt" $alt "class" "rounded")>: error calling partial: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts\partials\picture.html:1:3": execute of template failed: template: partials/picture.html:1:3: executing "partials/picture.html" at <partial "hri/picture" .>: error calling partial: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts\partials\hri\picture.html:1:3": execute of template failed: template: partials/hri/picture.html:1:3: executing "partials/hri/picture.html" at <partial "hri/private/image" (merge . (dict "partial" "picture"))>: error calling partial: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts\partials\hri\private\image.html:23:17": execute of template failed: template: partials/hri/private/image.html:23:17: executing "partials/hri/private/image.html" at <partial "hri/private/params/common.html" $params>: error calling partial: "C:\Users\metam\AppData\Local\hugo_cache\modules\filecache\modules\pkg\mod\github.com\future-wd\[email protected]\layouts\partials\hri\private\params\common.html:81:34": execute of template failed: template: partials/hri/private/params/common.html:81:34: executing "partials/hri/private/params/common.html" at <$ctx.Param>: can't evaluate field Param in type *hugolib.ShortcodeWithPage

Any ideas?

[sean-au]

Most of the processing is for data manipulating and sanitization, also throwing errors. I would copy and paste the image or picture partial into your project and go from there. I think I pass the whole context through from there and then do all the work in smaller modules

…

On Fri, 3 Nov 2023, 1:19 pm Metamere, ***@***.***> wrote: Thanks. I may try working with a custom render hook variation like you suggested. I want to add a link with parameters to be used by Dimbox.js, which I've integrated to allow for magnifying the images, downloading, or cycling through them. I tried making a shortcode that calls your partial, but I seem to have run into an issue. It doesn't seem to like the parameters, even though they should work, unless there's something different about the context for shortcodes? I notice you do a lot of stuff with processing the parameters for your shortcode setups. Is all that necessary, or just the way you chose to do things? — Reply to this email directly, view it on GitHub <#61 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ARTWGA4M5KKLFKEGFPFNIBDYCRIDVAVCNFSM6AAAAAA6WSMLDWVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM3TINRSG4ZDC> . You are receiving this because you commented.Message ID: <future-wd/hugo-responsive-images/repo-discussions/61/comments/7462721@ github.com>

[Metamere]

I managed to get it to work! I had to figure out a few things along the way. I had to import your hugo-common-imaging module due to the dependency, then I had to figure out how to make it so that dimbox wouldn't show every one of the generated responsive images (it was cycling through 9 images rather than just 3 on my test blog post). I was able to add to the filter so it ignored any elements that had an innerHtml that was not blank. So that's good at least.

But I still haven't figured out a way to call your partials in any shortcodes though. Is it possible? I can't figure out which shortcode of yours I would need to modify if I wanted to, say, make a variant that displays a pair of images side by side. Would it be the layouts\partials\hri\private\print\shortcode.html? I'm afraid this is going to be another thing that will take me way too long to figure out on my own, so would you please show me a basic example of how to create a new custom shortcode that uses one of your responsive image partials?

[sean-au]

I am not sure why hugo isn't resolving the image modules dependencies for you. I ran the following successfully (based on the modules readme) `$ hugo mod init github.com/user/project` to initialise as a hugo module project ` # config.yaml module: imports: - path: github.com/future-wd/hugo-responsive-images` added to config `$ hugo mod get -u` to pull modules in (including module dependencies) `$ hugo mod vendor` purely to see what repos are being used as modules, you can view them in `./_vendor' and delete afterwards

…

On Sat, Nov 4, 2023 at 11:35 AM Metamere ***@***.***> wrote: I managed to get it to work! I had to figure out a few things along the way. I had to import your hugo-common-imaging module due to the dependency, then I had to figure out how to make it so that dimbox wouldn't show every one of the generated responsive images (it was cycling through 9 images rather than just 3 on my test blog post). I was able to add to the filter so it ignored any elements that had an innerHtml that was not blank. So that's good at least. But I still haven't figured out a way to call your partials in any shortcodes though. Is it possible? I can't figure out which shortcode of yours I would need to modify if I wanted to, say, make a variant that displays a pair of images side by side. Would it be the layouts\partials\hri\private\print\shortcode.html? I'm afraid this is going to be another thing that will take me way too long to figure out on my own, so would you please show me a basic example of how to create a new custom shortcode that uses one of your responsive image partials? — Reply to this email directly, view it on GitHub <#61 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ARTWGAYHNXGDCZEP5AYYYMLYCWETRAVCNFSM6AAAAAA6WSMLDWVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM3TINZRHEYDA> . You are receiving this because you commented.Message ID: <future-wd/hugo-responsive-images/repo-discussions/61/comments/7471900@ github.com>

[Metamere]

Oh, sorry I wasn't clearer. It resolves the dependency just fine when I import the responsive image module. But when I manually copied everything over like you suggested in order to experiment with customizing things, I also uninstalled the module, so they no longer had access to the other module. It was just a minor confusion on my part (remember I'm still new to a lot of this), so no worries.

[sean-au]

The issue with creating a custom shortcode, is the module is currently set up to call a partial, based on the shortcodes file name. I am currently developing a feature, which enables to you use whatever shortcode file name you wish, and manually specify which partial you wish to use. I should have that done today.

…

On Sat, Nov 4, 2023 at 11:35 AM Metamere ***@***.***> wrote: I managed to get it to work! I had to figure out a few things along the way. I had to import your hugo-common-imaging module due to the dependency, then I had to figure out how to make it so that dimbox wouldn't show every one of the generated responsive images (it was cycling through 9 images rather than just 3 on my test blog post). I was able to add to the filter so it ignored any elements that had an innerHtml that was not blank. So that's good at least. But I still haven't figured out a way to call your partials in any shortcodes though. Is it possible? I can't figure out which shortcode of yours I would need to modify if I wanted to, say, make a variant that displays a pair of images side by side. Would it be the layouts\partials\hri\private\print\shortcode.html? I'm afraid this is going to be another thing that will take me way too long to figure out on my own, so would you please show me a basic example of how to create a new custom shortcode that uses one of your responsive image partials? — Reply to this email directly, view it on GitHub <#61 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ARTWGAYHNXGDCZEP5AYYYMLYCWETRAVCNFSM6AAAAAA6WSMLDWVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM3TINZRHEYDA> . You are receiving this because you commented.Message ID: <future-wd/hugo-responsive-images/repo-discussions/61/comments/7471900@ github.com>

[sean-au]

OK so I have made it work.

I have added the info to the end of the readme doc. You will have to update the module with hugo mod get -u.

You will also see an example in the test site. You can clone the repo from github and then you will see a npm script for the ./test-site directory called dev. The example is the 6th heading in the content/tests/render-short/index.md file

[sean-au]

If you want to have a go at messing with the module itself, I would run hugo mod vendor you can then mess with the _vendor directory and delete it when you done. If you clone the github repo there is also a test site that you can run as mentioned above, and you can mess with the module in the base dir and its automatically updated in the test site. If you want to push a PR, you can fork the repo and push a PR to my main branch

[Metamere]

Thanks for all that, though it might take me a little while to fully understand it, and I'm not sure it does what I was hoping for. At first look, I don't see how that would let me call the picture partial twice, each time with different parameters, within my image-pair shortcode. It looks like it's a way to call a specific partial at the end of a custom shortcode. I don't know if that would allow me to apply the link with the dimbox data around the responsive image like I did with the render hook, but it maybe it can?

[sean-au]

@Metamere did you work out how to create your own shortcode and call the partial twice?

[Metamere]

No, I've been unable to get that working yet.

[sean-au]

Firstly, I just pushed an update, so that the following occurs: - error thrown if only specify webp format as that's bad for compatibility, and will not increase load times in browsers if you specify an additional format. Also theres not really any point in having an <img> tag inside a <picture> tag, if webl is the <img> format - if 'original' is not one of the formats specified, the leftmost format will be used for the "img" tag's format I can see what you need, and I have put that on my TODO list. I think it's possible, and it's a great use case

…

On Sat, Nov 4, 2023 at 1:45 PM Metamere ***@***.***> wrote: Thanks for all that, though it might take me a little while to fully understand it, and I'm not sure it does what I was hoping for. At first look, I don't see how that would let me call the picture partial twice, each time with different parameters, within my image-pair shortcode. It looks like it's a way to call a specific partial at the end of a custom shortcode. I don't know if that would allow me to apply the link with the dimbox data around the responsive image like I did with the render hook, but it maybe it can? — Reply to this email directly, view it on GitHub <#61 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ARTWGA5XZRMVR7NMMVCTXBLYCWT4BAVCNFSM6AAAAAA6WSMLDWVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM3TINZSGE4TC> . You are receiving this because you commented.Message ID: <future-wd/hugo-responsive-images/repo-discussions/61/comments/7472191@ github.com>

[sean-au]

Have a go at getting it working in a page template file, using partials. Let me know if you get stuck, or if you need any customizations to my module e.g. passing data-property="..." through to the generated image. If you can get it to work, then you can create your own custom shortcode - happy to help.

…

On Sun, Nov 19, 2023 at 10:58 AM Metamere ***@***.***> wrote: No, I've been unable to get that working yet. — Reply to this email directly, view it on GitHub <#61 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ARTWGA4ZEDN7DCLFQNUQUOTYFFDTTAVCNFSM6AAAAAA6WSMLDWVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM3TMMBYHAZDC> . You are receiving this because you commented.Message ID: <future-wd/hugo-responsive-images/repo-discussions/61/comments/7608821@ github.com>