I built a custom Kirbytag to be used in the panel, to call galleries of images (the images are stored as files in a subpage of the current page; the kirbytag relies on calling that subpage name, and elsewhere in code I pull its images for the gallery in the current page).
I am now adding in HTML for responsive images, using the scrset method.
For reference, I were doing this srcset method in regular HTML, not in a custom Kirbytag, I’d code it like this:
<img sizes=“(max-width: 817px) 100vw,
1108px”
srcset=“img-390.png 390w,
img-650.png 650w,
img-816.png 816w,
img-1108.png 1108w”
src=“img-650.png”>
But in the custom kirbytags, we use the $html method, so this is how I wrote it into my gallery kirbytag (with alt, classes, id, which were there before and still working perfectly after adding responsive img code). $galleryname refers to the subpage that holds the gallery img files, and $slide refers to each img (created by a foreach loop):
$html .= '<img sizes="(max-width: 817px) 100vw,
1108px”
srcset="' . thisUrl() . '/' . $galleryname . '/' . $slide->name() . '-390.' . $slide->extension() . ' 390w,
' . thisUrl() . '/' . $galleryname . '/' . $slide->name() . '-650.' . $slide->extension() . ' 650w,
' . thisUrl() . '/' . $galleryname . '/' . $slide->name() . '-816.' . $slide->extension() . ' 816w,
' . thisUrl() . '/' . $galleryname . '/' . $slide->name() . '-1108.' . $slide->extension() . ' 1108w”
src="' . $slide->url() . '"
alt="' . $slide->alt() . '" class="contentimage" id="galleryimage">';
The problem is that somehow the various srcsets are not being recongizable as URLs. The string of characters is perfectly what would be needed for the URL to pull that image, but when I inspect in the browser, all the / are gone, and not just the ones I add in the code above, the ones in thisURL also. So escaping the /s I add not only did not do a thing, but if it had, it would not have been enough to fix this problem. The src attribute is still working fine.
Another thing: the srcset sizes after the first one are not even attempting to create a URL, as this screenshot of the browser’s inspector shows:
When I tried thisUrl()->html() or thisUrl()->kirbytext() I got a breaking error: “Call to a member function html() on string”.
Wrapping like html(thisUrl))... did not throw a breaking error but the /s remained missing, identical to the screenshot above.
Wrapping kirbytext(thisURL))... resulted in the gallery images being replaced by the code for the tag I listed above, starting with the first
srcset URL…but all /s at least are appearing:
The only experience I have with PHP is building this site, so I don’t know what else to try to fix this. Any ideas would be very very helpful and appreciated! Thanks!!!