Plugin Featured Image


(Emanuelet) #1

Hi everybody,
I’m developing a plugin to set a featured image for the topic.

Basically what I’m doing at the moment is replicating the upload image modal and store the url in a “featured_image” field that I inject in the Topic model.

Now, I’ve been able to make it work with the Upload via Web, but not with the From my device as that of course involves the asynchronous upload of the image. I tried in different ways to hook up to the process by subscribing to the MessageBus or to the topic_created event but had no success. What I’m trying to do is retrieve the upload url and store it in the db as a custom field.

Can someone give me some insights on how to achieve this?

Very appreciated,


(fearlessfrog) #2

Couldn’t you just use the default ‘Assets for Site Design’ default topic as the ‘holder’ and uploader of the images, and then your plug-in just uses those URLs as part of its settings? It would save having to bother about uploading yourself?

(Emanuelet) #3

Hi fearlessfrog,
thanks for your response.

If you talking about contributors that should do the process that you suggest, that doesn’t work for me as I need to add this functionality for normal users.

Basically the idea is to inject another option (similar to how the ReplyGif plugin does)

(fearlessfrog) #4

Understood, I thought it was perhaps an admin action.

(Emanuelet) #5

Ok, so I’ve been able to hook up into the file upload by basically parsing with a regexp the params object.

Trying to get the post update working now

(Stephen) #6

How would this work for new users, who have no upload rights? Will they be able to specify an image?

(Tobias Eigen) #7

I love this! Especially if featured image is featured in digests.

(Emanuelet) #8

Hi steve,
if they don’t have upload rights nothing will be set, as I’m hooking on the standard upload. I’m haven’t tested tho if the button will show or not in that case.

The plugin is still very early stage anyway. I will hopefully been able to publish it pretty soon

(Emanuelet) #9

@tobiaseigen I can give you a preview of what I’ve been able to achieve so far

(@SenpaiMass) #10

This looks really good. As discourse being the next gen forum. it would be nice to have a hover image when pointed on a topic instead of the image being shown next to the topic. This would allow a cleaner front page and a win-win scenario. Also a default image set by the administration if a feature image is not set by the user could be a nice possible option.

Ps- just a suggestion :smile:

(Emanuelet) #11

@Alankrit_Choudh it sure will for the stock discourse. For my use case, I’m building this plugin so we don’t have to fork discourse to apply the customizations that we want. As I said before anyway, I will going to publish it on github and of course anybody that wants to contribute at that point is more than welcome

(Emanuelet) #12

Ok, so got back to work on the plugin.

Even if now is currently broken (I guess because of the change in the plugin api by @eviltrout ), I made the repo public.


(Erlend Sogge Heggen) #13

@angus worked on a similar plugin and has some great notes on that here:

(Emanuelet) #14

the plugin is been updated to work with the new API. Tested and working with Discourse 1.6 beta 2. Now the plugin will use the first image added to the topic as featured image.

(Erlend Sogge Heggen) #15

Cool! If the plugin is stable now you should make a new topic for it with a proper writeup of its features, post it without a category and PM me to move it to #plugin.

I’m also curious to know how your plugin works compared to Topic List Preview. If they’re basically doing the same thing then a collaborative effort between the two of you would be preferable further down the line.

(Pad Pors) #16

just a fast test to compare the output of these two plugins:

  • there are posts for which the topic-list-preview work and posts that it doesn’t, the featured image plugin work for all (in the attached image, all the posts should have 2 images, but they don’t).

  • this plugin doesn’t need sidekiq to run on local host, the other one (topic-preview) needs.

  • little bit different styles for the image.

  • the topic-preview plugin doesn’t call for the preview images for the “suggested topics” at the end of topic-pages, but this plugin calls.

Featured Image Plugin
(Emanuelet) #17

@Pad_Pors explained better than I could.
I will just add that the plugin works without settings or actions by the user and in the topic page it will put the featured image also above the title.

(Emanuelet) #18

will do tomorrow morning. Cheers

(Angus McLeod) #19

@emanuelet @Pad_Pors @erlend_sh Interesting! I just got back from a short holiday, so just digesting this now.

Here’s are some more ways the plugins differ

Image sizes in topic list

We are both saving the thumbnail to a topic_custom_field. However, I have also

  1. Optimized the the thumbnails into two different sizes: 100x100 and 200x200 (for retina displays);

  2. Saved the thumbnails into a custom JSON object (this was surprisingly difficult); and

  3. Serialized the new topic_custom_field to the topic list.

These changes caused the issues that some have had with my plugin, partly because there are some type issues with JSON custom fields in Discourse.

Without similar logic your plugin is rendering the images full size in the topic list using the existing image_url field. This puts a significant strain on resources when used at scale. If the topic list has a number of topics with featured images, all of those full-sized featured images are being loaded when the topic list is rendered.

This is one of the key issues to address with this kind of plugin.

Use of existing Discourse logic

You have created a few new ways of handling things. While there’s nothing wrong with creating new logic, there will definitely be some issues down the line (and currently) with maintaining it. For example, for the url handling logic you’ve added. Whenever possible it is better to use the existing Discourse logic that has already been battle-tested. Note that the hard-coded SiteSetting.s3_upload_bucket + "" will not work for most people.

New upload button in the composer

I’m a little confused as to what the thinking is here? The new upload button you’ve added seems to do the same thing as the existing upload button. Could you explain what it’s for a bit more?

Featured image appears above topic and does not appear in first post

This is an interesting feature. I can imagine that some people will not want it however. Might be best to add this as a setting, rather than by default.

Appearance of featured image cannot be set on a per-category basis

This ‘per category’ setting was a feature asked for by a number of people, so I changed the functionality to be set on a per-category basis.

@emanuelet All that said, well done! I learnt some new things reading your code.

So what should we do from here… if you’re up for it, we should combine efforts rather than work separately on the same feature. First, I’ll let you digest and respond to my thoughts. Maybe I’ve missed some things. Then we can talk about how to go about collaborating.