The real image is that one: https://lh3.googleusercontent.com/oCfMX3EK4iIDOVg10tsuOsJkp5uixzYgoHSil5wZToOTOAGkQpeqO4GEqoYAAUO5Tsimp93ZrgPEMrtjBdm2iwCnSlwAuWbXPcXPFPZvC2VxGu7t4GaJnbvjF16E3u0GHwAo9IAbEiasaML3Aj6Ku9sBfUp57QK6ptGv0IgzYLeaqHgOzVJ0xqhxXhnpQbSYQ-c2fitj4te1FbQq77KiwkqlfgQMgOSk5PGVDukrgMQs_NX5Vnt_tMeqWha7TO2HqnKweSHhgD3ZXKkLXLTNKO-v31hqZMmDXeWsiYrJ_HKx7GbVINYC9JSAzkTGwlSn1eFxqMK2v-O8xe5sAKFYNyoeZzj-G0tYbltr35WL6yT7w-c__SHJS_IORAbzPLJrbVh93VYYGSPCcbG-VEiKJPQC8w1ZWsK_iIdYbM9PEbMaqtDm7BzB6h85embfx7okD-c7OTc6OUYWsoFhrxvHud-qIsiiydW6lWODSa4foVDrTsbYdnuT5pMPBBvy9RCUq4jSyu3zitiVaH79kLU8gno8qx1f2xanwPCbtObiJW2-GmidLUB9ZgiiTzWPPzSV9hQ81QXDVeobu9dXiEyk3tBHctEY8CVekif6vnnsS3TUScQLZfVGU7H7nqV2FrPtok2dL_pDWO9HoRcYE46kpkmtWIyiW3G551VwBLdnzew=w1186-h1580-no
Rob: I’m not sure you really want to use Markdown for images. I love Markdown. Use it every day. But one of its weak points is images. This is mainly related to it being developed in 2003 when people were not thinking about responsive images.
If you know the size of each image, and if you know for sure that it will fit into the max width of your content container, then you could be okay. But most people don’t know this. Neither do I many times.
The alternative approach is to use a wee bit of HTML code. I don’t memorize HTML, but instead I use Typinator (or TextExpander or similar shortcut software) to put in this generic code:
I know this doesn’t answer your primary question, but your example is one spot where Markdown does not work great. That width at 100% bit is really important as it will auto-fit a larger image into the available content container. And of course you can set at something less than 100%.
As @instacks indicated it’s always possible to get a URL from Google Photos. It’s long, it’s ugly, buy copy/paste solves that pretty easily. An alternative that would probably be a little better is Flickr. But in this case only a little. The advantage is Flickr automatically creates multiple sizes of an image: so this might be helpful in some cases.
If the hobby page is for you, I still think the easiest method (with the shortest URL) will be to directly upload to your server area in a folder named “myimages” or similar. If this is for a client, then I completely understand why you don’t want to go that route.
Amazon S3 is great but I can’t imagine using it for only a few images. Much more hassle than benefit. If you have a ton of images, or want to warehouse really big stuff (video, audio, etc.) then it may make sense. I use it all the time for course websites where students are playing media content from it, or downloading from it. I rarely get charged more than $0.18 a month! Absolute steal in terms of pricing.
… but in this case it seems not needed and adds complexity.
I’m disappointed that Markdown can’t handle images more elegantly but will probably pursue your suggestion @Mathew. I’ve got QuickKeys here and could probably use that for the repetitive code.
I’ve got the images to behave how I want using a combination of LiteBox and a bit of code from Jonathan (or someone else here who had a similar request) so once I’ve got this sorted I’ll be good to go.
@instacks Yep, that will definitely work. But there are definitely times when I don’t want the image to take up 100% of the width. So by using the generic HTML I can specify a width. I haven’t tried it out (as I don’t have time this morning) but will the specific HTML override the CSS? If CSS specifies width at 100% and then I insert something like:
@robbeattie : If you use the CSS advice by instacks then you likely don’t need to do the “width” part of the code. You don’t need to specify it, so you could simply use:
<img src="fullURLhere" alt="textdescription" />
Or, with the CSS provided, you could use the Markdown approach.
About your original question: I generally find it easier to get URL link from images I’ve warehoused myself. I just use Transmit (or any other good FTP app), right click, and copy URL of image when posted to server. At least for me that’s much much quicker than going to Flickr, Google Photos, etc. to find the full URL.