Test post please ignore

April 1, 2018
test

This test post tries out the new Hugo page resource functionality, mostly regarding images.

This is a caption

Some good information in this blog post.

Basically:

  • Create folder in content (page bundle)
  • Put index.md and image/imagesstuff.jpg in there
  • Create a shortcode in layouts/shortcodes/blah.html which uses the $image.resize functionality.
  • Use the shortcode in your markdown

Done!

The image above was very high resolution, and resized to 512px. This way I can put max resolution stuff on the blog and have it served at smaller resolutions to the clients! Neat!

Here is the code for the shortcode:

{{ $img := $.Page.Resources.GetMatch (.Get 0)}}                                                         
{{ $image := $img.Resize "512x" }}                                                                      
<figure style="margin:auto; width: {{ add $image.Width 3 }}px; padding: 3px; background-color: #cccc">  
    <img src="{{ $image.RelPermalink }}" width="{{ $image.Width }}" height="{{ $image.Height }}">       
    {{ if ne (.Get 1) "" }}                                                                             
    <figcaption style="text-align: center;">                                                            
    <small>                                                                                             
    {{ (.Get 1) }}                                                                                      
    </small>                                                                                            
    </figcaption>                                                                                       
    {{ end }}                                                                                           
</figure>