getRTImages - List and Sort Images from Rich Text Field

Use Case

You need to give the client control over the images in a slideshow. moreGallery is your premium choice but there’s no budget to buy Extras. The Gallery component is just too much for this requirement, as is MIGX. Child Resources are a possibility but you don’t want to mess up the tree.

Well here’s yet another option for an easy-to-manage slideshow in MODX.

getRTImages

Point this Snippet at a TV, and it will grab all the html img elements in the TV value, and return their attributes as placeholders so you can template the output via a Chunk. You use it like this:

[[getRTImages? &tv=`myTV` &tpl=`myTpl`]]

Let’s say [[*myTV]] had a bunch of images that your client uploaded via the Rich Text Editor (RTE), but it also had arbitrary markup added by the RTE, like this:

      

png

  • another png
  • jpg
gif

[[$myTplChunk]] contains this:

      [[+alt]]  

You would get this:

      another png      jpg      gif      png  

Notice that the values from the img element attributes are returned and output nicely based on your Chunk. They are also sorted by the data-index attribute. If there’s no value in that attribute, the item shows at the beginning of the list in the order it appeared in the original markup.

You can also set a limit property to limit the number of results, and you can set a custom indexAttr property if you want to use something other than data-index as your index attribute. You can also specify an outputSeparator: the default is PHP_EOL. And last but not least you can specify a Resource ID - the default is the one in which the Snippet is called.

*UPDATE: As of version 1.1.0 there are several sorting options for the results.

Additional Resources

What Does It All Mean?

This is a really quick and easy way to give clients access to slideshows. They don’t have to learn any other method of content uploading - they just use the RTE that they’re already accustomed to, and it displays the way you want. Install via Package Management or download here. That’s it! Don’t you love MODX?