Have been trying to understand how exactly to post images in a journal post
I read a few similar posts, like this which has this html code snippet <a href=“*picture URL* ”><img src=“*picture URL* ” width=“250px”></a>
or this code < img src=“[http://bonap.net/MapGallery/County/Euphorbia%20albomarginata.png ](http://bonap.net/MapGallery/County/Euphorbia%20albomarginata.png)”> (without space after “<”)
I can’t vouch for all the above code, but the BONAP images (or I guess any images referenced from a journal entry on a non https site) won’t load in Chrome because of the issues raised in the second link you provided (which is a Chrome issue). BONAP images do load under Firefox at least when I try this (angle brackets <>removed so it wouldn’t try to resolve):
img src =“http://bonap.net/MapGallery/County/Euphorbia%20albomarginata.png”
you have to make such links accessible to anyone, not just you.
BONAP serves this up only on http://, but iNaturalist.org tries to access it via https://. so that’s the problem in this specific case.
this is invalid code
if you want to to use a combination of markdown and html, then you could do this: [<img src="https://inaturalist-open-data.s3.amazonaws.com/photos/153231034/medium.jpeg">](https://inaturalist-open-data.s3.amazonaws.com/photos/153231034/medium.jpeg)
which is equivalent to this in all html: <a href="https://inaturalist-open-data.s3.amazonaws.com/photos/153231034/medium.jpeg"><img src="https://inaturalist-open-data.s3.amazonaws.com/photos/153231034/medium.jpeg"></a>
which is equivalent to this in all markdown: [](https://inaturalist-open-data.s3.amazonaws.com/photos/153231034/medium.jpeg)
what i’m saying about google drive and dropbox is that they are both file shares that have controlled access. typically if there is an asset within one of these that you want to share widely with the public, you will need to make a view-only version of the asset available via a specific link using the file permissions within google drive or dropbox.
you’re not trying to defeat the controls. you just need to use the system to grant the right access to your media asset. here’s a video someone made a while back that shows how to embed an image from google drive to another site: https://m.youtube.com/watch?v=Y1joksnUW04. it’s an old video. so the exact steps might be different nowadays, but the general process should still work (though i haven’t actually tried myself).
there should be a similar process for dropbox. you can search the net for exact instructions.
I’ve faced this challenge before. I never figured out how to make it work successfully with Google Photos, and have been using imgur.com for the past couple years when doing iNat journal posts. I don’t love it and feel uncomfortable posting my images on a site like that, where I don’t understand all the issues of access and permission and risks that the photo links may or may not work someday, but it seemed like a popular and free image hosting service that did what I wanted it to do. Maybe someone else on the forum has a better suggestion.
From imgur:
<img src="https://i.imgur.com/eB8PXaz.jpeg" alt="Test image" width="240" height="180">
From google:
<img src="https://lh3.googleusercontent.com/pw/AM-JKLVH9ml5i_upr5qsFt0dx_aivBOSHYgwFyAH_0N7BaP0uaMe3VN49pnaQU5I58TpX3tN32YE3y3pnhiBwHWeslJLBlhm4fy6XSzo0XmyfOxIPrmDf-soLiWAiYa6y7-gJwu4yXvRmb533XhJqE57j8Y=w842-h596-no" alt="Test image" width="240" height="180">
Be sure to link to the actual image file, not the google or imgur photo display page. To get to the image file from the display page, right click on the image and copy the image link.
