obsidian-community / web-clipper-templates

Community collection of templates for the official Obsidian web clipper.
MIT License
102 stars 9 forks source link

add reddit post image #4

Open Nitero opened 1 month ago

esodesod commented 1 month ago

Hi! Thank you for the PR. I actually played around with the (preview) image today myself (not pushed the update yet), but I put the image into the body, e.g. under the post text, combined with the image filter, which renders nicely, e.g. something like {{selector:#post-image?src|image}}.

I'm planning on updating that (basically the same as here, just in the body + embedded image), but curious; what is the reason for putting the link it in the properties directly, rather than the body?

PS: While doing some initial testing earlier today, I also found that the "zoomable-img" is better quality (which I personally prefer to use, is possible, though it both pros & cons). I might aim to extract the zoomable-img part, instead. Also (just FYI) images seems to sometimes be in a "gallery-carousel", e.g. multiple images within #shreddit-media-lightbox. Have not tried to extract these yet, but just as an FYI, if you want to give it a go :-).

esodesod commented 1 month ago

Quick update: For the the post image in note body (under post title), I'll add {{selector:zoomable-img > img?src|image}}. It both seems to be a better quality image, and does not contain the additional url parameters

e.g. from https://www.reddit.com/r/ObsidianMD/comments/1g5yxxw/help_is_there_anyway_to_emulate_this_setup_on/

{{selector:#post-image?src|image}} results in https://preview.redd.it/help-is-there-anyway-to-emulate-this-setup-on-obisidian-v0-037da14l9dvd1.png?width=640&crop=smart&auto=webp&s=e14fd17984e7419345268d79c537c376dadcbe2b, which is lower quality, e.g.

But {{selector:zoomable-img > img?src|image}} results in https://i.redd.it/037da14l9dvd1.png, which is higher quality, e.g.:

Nitero commented 1 month ago

what is the reason for putting the link it in the properties directly, rather than the body?

so that I can show it in a dataview query

sigrunixia commented 3 weeks ago

@esodesod We safe to merge? We can always update things after the fact if we need guides.

esodesod commented 3 weeks ago

I've already added the "higher quality image" as part of body, in https://github.com/obsidian-community/web-clipper-templates/commit/60def90881929d201ecebaeba1a3e0ee6572b25e, but that's just my personal preference. I guess it does not hurt to have both and image/cover/poster as well (in front matter/properties), but maybe we should use the same image? (and not two different sources for the same image.. unless we want one "high quality" and one "low quality" image)

@Nitero what do you think, any objections changing to the zoomable-img (higher quality)? Then we can merge, or do you prefer using the #post-image (lower quality, and includes some stuff in the URL which I don't know what is)?

@sigrunixia Guess it will come down to a personal preferences for some templates, e.g. slightly modified versions of same template. I see reasons for choosing both the low quality image, e.g. less diskspace consumed (though I'm not using it myself), and the high quality image (which I personally prefer, mainly due to further processing with OCR, etc. resulting in better results; which might not be the need for others). Maybe we should simply add a second template for this one?

Nitero commented 3 weeks ago

@esodesod I haven't really started using the web clipper yet so I'd say just go ahead with what you think makes sense

I think I would prefer a low res version because I just use it as small thumbnails... having multiple versions sounds like a good idea but might be annoying to maintain? maybe both images can be in the same template and everyone can just delete the ones they don't need?