Topic List Previews (legacy)

That sounds really cool. I’ll try it out in the plugin.

The TC has the feature but you need to add the sidecar plugin for it to work. The TC is recommended if you have sidebars.

2 Likes

Testing out plugin locally. I’ve added it successfully to my local instance. When I go into a topic, and hit the pencil icon by the topic title, it shows 2 buttons that each say “select thumbnail”. When I hit either button, it says: "Select the desired preview thumbnail…for Topic: “[topic name]”.

But no images appear in the modal to select.

I do have a few images added to the topic, but they do not appear in the modal.

Error in console when I hit that pencil button: Error: Assertion Failed: The instance initializer 'preview-route-edits' has already been registered

and
ember:37774 Uncaught Error: Assertion Failed: Attempted to register a view with an id already in use: select-thumbnail-button

What does the plugin section of your app.yml look like? Are you using the correct plugin or have you doubled up the TC and the plugin? Be sure to be using the exact branch for the sidecar.

1 Like

I’ve gotten the plugin working locally. I think the issue was–like you referenced–I had started with the theme component, and then I had separately added the plugin. I had removed the theme component, but I had not restarted my server after that removal–so it seems like the TC and plugin were doubling up. Now, with just the plugin, its working without error.

So, when I edit a topic meta, I can see the button to “Select thumbnail”. It appears that images only appear in that modal to select if they are images added locally. If I add an image from the web to a topic, that image will not appear in the modal for selection. Is that correct?

I can understand why that would be the case, but the trouble is that if preview thumbnails require they have been added locally, that means that those images have to be saved on my server. With a new potential image for each topic, that could get expensive. My hope was there was a way of having people add links and having those web-linked images be the thumbnails on topic previews.

Is there any way around that? Or some way I could have topic list preview thumbnails without having to house those images on my server?

3 Likes

No way around it. This is native discourse behaviour. All images have to be uploaded. You can set things up to use an offsite upload location, but they still need to be uploaded, not remote from your infrastructure.

1 Like

Thanks. That makes sense. It does seem like in order for an image to be able to become a topic preview thumbnail, it has to actually appear in the topic. Is that right?

I could imagine users wanting to have a certain thumbnail for their topic, but not having it appear in the text of their topic.

that’s not supported

Got it. This is an extremely helpful plugin. Saved me a lot of time!

2 Likes

I have noticed 2 bugs in this plugin.

  1. if a topic has no UPLOADED images on my discourse forum itself but i do have linked images like images with SRC from other siites or CDNs, then that image is not detected by this plugin and it does not show the linked images in the topics feed. it only show images in topic feed if they are UPLOADED on my forum itself. It should also detect 1st post 1st linked image as the topic image and show it in topic feed. my forum is big but i don’t have images storage so i store user images on external image hosting CDNs and use an image link from those CDN to render and preview images on my forum.

  2. to solve the above problem, i also tried using a random image service to use e.g https://picsum.photos/ OR https://source.unsplash.com/random e.g each time some1 hits on these URLs it gives a random image. i set this URL in my default image thumnail but this plugin is showing the same image repeated multiple times, but it doesn’t show unique images for each topics as default image.

It looks like this then, see the Yoga girl pic is showing because a user uploaded it on our site, but all other topics also have LINKED IMAGES using CDNs but they r not previewing but only 1 same image is previewed from either https://source.unsplash.com/random or
https://picsum.photos/200

Even discourse itself is uploading its images on external CDN e.g https://d11a6trkgmumsb.cloudfront.net/original/3X/6/4/64dff560b7c63a2c11c20374ec3427e2ac558437.png

so this plugin must support reading and detecting topic remote images which r uploaded on external sites via image CDNs but are in 1st post and 1st picture in a topic.

Also, when i share the topics on social media, the open graph tags also don’t detect the image and it shows no picture, just site logo, even though the topic contains a real picture about the topic but its just a linked remote picture.

How can i solve these problems? Is there anyway for me to append a random number in a URL to make it hit on a unique URL each time request is made so that it always shows me unique images for each topic?
My problem can be easily solved if you guys enable the feature to auto detect linked images/ images with SRC from external CDNs from 1st post and 1st image to show as topic image and show it on homepage.

Can anyone help me?

1 Like

What do you mean by this? Are you hosting all your images on a single S3 provider and accessing them via the specified CDN?

Are you using a service listed here? Using Object Storage for Uploads (S3 & Clones)

Otherwise your question is somewhat out of scope of this plugin. Topic List Previews just leverages the core discourse architecture to deliver thumbnails. The images used to create thumbnails must be uploaded locally or on the allocated offsite storage specified in site settings. Other sources are not supported. The process to create thumbnails is a core discourse process and it will only act on these sources.

The default fallback image can be anywhere public, of course, but that’s the only exception.

The Topics public og tag should reflect the selected thumbnail. This is not a plugin feature, this is also core discourse.

1 Like

Hey robert,

Many Thanks for your quick reply.

Yes that is good, images must be still detected by discourse core like your plugin does even if they are hosted on external public sites. This is exactly what i want discourse core to support, where can i request this feature?

Basically all my topic images are loaded from other external public sites like imgur, https://pixabay.com/ and other free sites which allow us to use images for free. Im not using any object storage,

So i never upload the images on my own discourse server, to save my storage costs.

I use 3rd party free image hosting sites to show my images, let me explain you.

You can see e.g on my this topic https://howtodiscuss.com/t/how-many-carbs-on-keto/28069

e.g

that first image is actually loaded from imgur. You can see its source.

Whose actual image URL is https://i.imgur.com/04HZ5py.jpg

Similarly, on this topic https://howtodiscuss.com/t/how-to-do-handstand-yoga/28055

the image is actually hosted on this URL , u can see its source on my topic

So in all these cases i m facing 2 problems,

  1. These external images are not detected and shown as topic thumbnails in the topic preview plugin as u can see on my homepage right now https://howtodiscuss.com/ even though all my topics have images. but it doesn’t detect these images.

  2. Also, whenever i share my topics on social media sites like Facebook, Twitter, Linkedin or skype or anywhere, the meta OG tag doesn’t take my external img src and hence it falls back and always shows my site logo in the topic share link instead of the actual topic image that should be shown in social preview.

E.g see here on a facebook post, you can see that topic has indeed a topic picture but it still shows my site logo as fallback always :frowning:

You can put my URLs here to see the problem Social Share Preview of howtodiscuss.com - Social Share Preview – Check social media link previews

the topics have the images externally on public sites but it still always fallsback to my site logo. i do not want this behaviour.

My other friend is using Discourse and this topic list preview plugin also facing same problems @Bcat

How can i solve this? May be i can add a force meta OG tag on my topics HTML with the img src of the external CDN remote image? How do i do that? so that Social media sites and this topic list preview plugin can detect and show my topics images on my homepage.

Can you tell me how can i modify or overwrite the topic OG public tag for my each topic so that it must take those public images as topic thumbnails.?

1 Like

To get thumbnails generated you must use local uploads or the native S3 integration functionality in Discourse. No other source is supported (except for the fallback image, which is very superficial and will not affect your og tag.).

You could discuss this with Discourse team here or start a #feature Topic.

2 Likes

@merefield It’s update time! :tada: Are there any known issues?

2 Likes

No issues I’ve come across Bart. How’s that staging server build coming on? :wink:

2 Likes

After last update we got a blank index page. Something is wrong with the unofficial plugin topic list previews. So we deactivate it and all is ok. anyone same problem or solution, thanks.

2 Likes

Thanks for the report. I fixed Locations plugin with similar issue yday. I’ll take a look.

1 Like

Can you please rebuild and confirm the fix?:

https://github.com/paviliondev/discourse-topic-previews/commit/2e927e0714c10bcacb075fdd719347f5b50bc21e

2 Likes

FYI not to confuse matters, but I’ve also applied this fix to the TC: https://github.com/merefield/discourse-topic-list-previews-theme/commit/b8f1a7841769678a3ef9ec5e34264991de292544

3 Likes

FYI to anyone about to upgrade that uses the TC with the helper plugin, be sure to update the TC before upgrading. When I updated core/plugins I was left with a blank screen and this error

I was able to get in with safe mode and update the TC and all is well now!

2 Likes