[SOLVED] Floating shortcodes


#1

Hi everybody, I have a problem regarding shortcodes with both my solving approaches not working:
I would like to make my shortcode add an iframe, which can float besides other iframes, but adds a new line after/before every other content. For this purpose I would like to either:

  • check if the instance of inserted shortcode is the first or the last one, and add a clearfix accordingly. I haven’t been able to find a possibility yet to do so directly.
  • access the page content as a string to search it and figure out that way, if the current instance is the first or last time the shortcode is used (using for example a specific id as a shortcode parameter to identify the current one). Unfortunately I have not been able to access the content by .Page.Content even though .Page.Title for example works.

I hope this is understandable. I am also interested in other solving approaches. Thanks for any help!


#2

Ok, if anyone else should have this problem, I get it now:
.Page.Content does not work because it returns the pages RENDERED content, which can not be returned because the shortcode has not been executed yet (would be recursive i guess)
The .Ordinal shortcode variable, which returns which instance of the shortcode it is, would maybe be useful too. It just didn’t work because I didn’t have the newest version of Hugo installed
In earlier versions you can use .scratch to make yourself a counter
Also I guess the unrendered content could be returned by using readFile on .File.Path of .Page.File, but I have not tried it. Probably you could then look for your shortcode and verify if it is the first or last time used. But I realized that I may need to use multiple “blocks” of the shortcode, so the absolute last and first time are not even useful. And to find the first and last time in a block is probably a little tricky, because Hugo still inserts empty paragraphs between shortcodes if separated by line break.
…so there is actually a easier solution using css:

.shortcode~*:not(.shortcode) {
clear: both;
}
p:empty {
display: none;
}

By that every Element that follows a element with class shortcode and is not a shortcode element itself will clear the floats
Still, if you would do it in Hugo, support for old browser would be better and I would overall prefer it, but my golang template knowledge is really bad…if anyone does it, maybe share it here