Fred tutorials?

Aaah, yes. It’s right there in your cookbook. Brilliant. Thank you!

Just so you see how I’m using it…

This is the main Fred element for the blog listing.

<!-- start blog list -->
<div class="container">
  <ul class="list-group">
  [[!pdoPage?
    &parents=`[[*id]]`
    &limit=`5`
    &tpl=`listRowTpl`
    &includeTVs=`thumb`
  ]]
  </ul>

  [[!+page.nav]]

</div>
<!-- end blog list -->

It uses this Option Set (note to self: no quote marks around true and false values!)

{
  "remote": true
}

The chunk listRowTpl looks like this.

<li class="list-group-item mx-5 my-3 bg-light">
  <img src="[[+tv.thumb:pthumb=`w=300&h=200&zc=1`]]" alt="[[+pagetitle]]" class="rounded float-left mr-5 p-1 border border-secondary">
  <h3><a href="[[~[[+id]]]]" class="list-group-item-action active stretched-link">[[+pagetitle]]</a></h3>
  <h5>[[+longtitle]]</h5>
  <p text-left>[[+introtext]]</p>
</li>

The results (for now, eventually this will be up on my sottwell.com site) https://c0364.paas1.ams.modxcloud.com/quilting/

1 Like

There is one drawback to using the TinyMCE image editing feature to resize images. TinyMCE converts the resized image to Base64 code, and that is what gets saved. That means that Fred is stuffing huge amounts of Base64 code into its JSON string in the Resource’s properties field. After two or three smallish images, Fred’s saving and loading becomes noticeably sluggish.

Well, the properties field is a “mediumtext” which can hold ~16MB, so it shouldn’t be a serious problem.