Topic List Previews

(Angus McLeod) #1

GitHub-Mark-32px Repository: get the code here

sandbox Example: see it in action here

:heart: Donate: support it here

:man_technologist: Maintainers: @merefield and @angus


Topic List Previews allows you to:

  • Add images, excerpts, buttons and topic stats to topic list items; and

  • Change the layout and style of topic list items

  • Add ‘Featured’ topics above topic lists and topics.

These settings can be applied to all or selected topic lists on a site-wide or category-specific basis.

This flexible feature-set allows you create a variety of different topic list styles, including

Reddit Style

Relevant settings
  • topic list thumbnail
  • topic list excerpt
  • topic list action

Pinterest (Masonry) Style aka 'tiles’

Relevant settings
  • topic list tiles
  • topic list thumbnail
  • topic list excerpt
  • topic list action
  • topic list thumbnail width
  • topic list thumbnail height

Featured Topics

Relevant settings
  • topic list featured images tag
  • topic list featured images count
  • topic list featured width
  • topic list featured height
  • topic list featured title
  • topic list featured excerpt
  • topic list featured order

Examples in the Wild :seedling:

Support :heart:

You can donate to support the development of this plugin. Select “Topic list Previews” as the “Cause”. If you have an account on my sandbox, you will appear as a project “Backer” in the Topic List Previews category description on my sandbox. All donations are split equally between current maintainers.

Contributors :raised_hands:

Many folks have contributed to the development of this plugin through both feedback and direct development work. In particular

What plugins do you recommend?
Topic list custom view
Move tag to a column
2018: The Year in Review support
Changing sidekiq job urgency
News Plugin :newspaper:
The topic list doesn't need a category column
How to move the category into a column in 'Latest'
News Plugin :newspaper:
Facebook-like Feed?
Broken images move to tombstone
Migrating from FB Groups to Discourse - help with features/functions
Forum with Pins/thumbnails instead along with topic title
How do I show a topic description in category view?
Display images with topics list
In-post links to topics - no longer update to the initial posts title
Auto-quoting early posts and why its so needed for big communities
Retort - a reaction-style plugin for Discourse
How can I save a topic for offline access/archive purpose?
Latest view broken on tablet
Possible to create a news site with pics and videos
(Chris Beach) #2

Hi @Angus and @merefield - thanks for this awesome plugin.

One observation - lately I’ve seen a lot of errors in my logs along these lines:

TypeError: undefined is not an object (evaluating 'e.layout')
Line: 14
Column: 21951

I believe this originates in the TLP plugin as this is where I found e.layout in the referenced javascript.

(Angus McLeod) #3


hm, could you show me a screenshot / or line reference?

@merefield It might not be the culprit, but looking at the Masonry code, we’ll need to put a check around masonryObserver so that it only triggers applyMasonry when tilesStyle is enabled.

(Chris Beach) #4

Hi Angus,

It’s line 14 in the following file:

The e.layout reference appears to be within “masonry” code, and although I can’t say for sure that it’s TLP related (thee code is minified and quite hard to interpret), it does seem to be right next to other TLP code


OK let me deal with these separately (if they are indeed separate issues!):

Apologies, currently some of the masonry code is running on routes without a tile grid. This will generate a javascript error but is probably otherwise harmless because the grid element is missing, so there is no work. I’ll fix this on next release. Not sure how that slipped through! (Well I do, only happens on non-tiles routes when you scroll down far enough to pull in more records).

However, that error is this one:

TypeError: msnry is undefined[Learn More] plugin-third-party.js:176:17
applyMasonry/< javascripts/discourse/initializers/preview-edits:176:17 t.emitEvent javascripts/discourse/lib/imagesloaded/imagesloaded:13:845 o.prototype.complete javascripts/discourse/lib/imagesloaded/imagesloaded:13:3635 o.prototype.check javascripts/discourse/lib/imagesloaded/imagesloaded:13:3174 <anonymous> self-hosted:972:17 

@ChrisBeach it might be worth me pushing a fix for that and then re-checking.

(Chris Beach) #6

Thanks @merefield. Depending on the browser and the situation, JavaScript errors can have quite serious consequences for Discourse.

A couple of people have complained of issues lately (unable to sign up, unable to post etc) and although I haven’t got to the bottom of their problems yet, I’m nervous when I see heaps of errors in the logs.


I’m not seeing “heaps of errors” though, just that one, at each pull of new records. Are you using Tiles?

(Chris Beach) #8

No, I’m not using tiles.

My error log page looks like this:

1 Like

It could be related Chris, I will address this bug and ask you to check again.

1 Like

@ChrisBeach bug fix merged, please let me know if this solves your probem

(Chris Beach) #11

Serious probs now “undefined method custom_thumbnail_height”

Forum is down :fearful:

1 Like
(Dan) #12

Same for me :confused:
What to do?

(Chris Beach) #13

(Chris Beach) #14

remove TLP plugin for now in your app.yml and ./launcher rebuild app – will mean a few mins more downtime but will hopefully rescue your forum. That’s what I’m scrambling to do

(Chris Beach) #15

Vital IMO that we have automated smoke tests on plugin CI (or during forum upgrade, prior to new version being put live) to avoid this happening again.

Edit: tried copying pasting link to previous discussion here but copy/paste not working on iPhone (even after refreshing browser)

Edit (from desktop): here’s the discussion:


My forum is now back up, after I removed the TLP plugin and rebuilt the forum. For your reference, this is the error that brought the forum down:


Thanks. There have been some other commits to TLP in last 24 hours … will have to discuss this issue with @angus asap. Sorry for your troubles.

1 Like
(Angus McLeod) #17

Completely my fault. Apologies! Fixed.

cc @merefield @RoldanLT

(Chris Beach) #18

Thanks @angus :+1:

Have scheduled an overnight rebuild and will let you know if there are any probs.

(Chris Beach) #19

All looks good now. Thanks @angus and @merefield for your swift turnaround on the fix :+1:

(MKhalifa) #20

i installed the plugin but i can’t get it to work i mean should i change some settings ?