If you upload an image on the Starter or Essential plan, you can see the compressed version. This is served compressed to ensure the best page load speed when loading this image into your page.

Pro: image resolution settings

On the Pro plan, you can choose the level of image resolution.


If you are familiar with Photoshop's Save for Web feature, the Starter & Essential images could be compared to saving for web at 80%. The Pro plan can be compared to saving as a standard jpeg at Maximum quality, if you so choose.

The Pro images focus on quality over file size. They are most beneficial and noticeable to users on high definition/retina displays.

Pro: Custom Elements

If you're on the Pro plan, you can also make a Custom Element to host your own images:

https://help.getshogun.com/tutorial-videos/advanced/creating-custom-elements-with-liquid-css-and-js

  1. Open the Custom Element Editor
  2. Add this code: <img src="{{ image_url }}" alt="{{ alt_text }}" />
  3. You'll notice that when you paste that into the template editor in shogun, a menu appears on the right letting you configure the variables
  4. Change them so that they get entered on the Sidebar rather than inline
  5. Save your page

Then you can go into the editor and your custom element can be seen from the sidebar.

Did this answer your question?