Video Walkthrough link on Dropbox. I don't know how else to explain this other than through a demonstration.

Source Page: White Butte, ND State Highpoint

Thank you for the detailed video! I see the problem and will have to track it down. I am not sure exactly where in the code the erroneous changes might be being made. It is obvious that when the HTML is submitted it is being changed. This is either happening in the editor's javascript code or on the backend of our PHP code. My guess is that it is in the javascript code because I don't recall modifying the image code in that way. But I will have to poke around and see what I can figure out.

Is there any progress or an ETA to report?

Unfortunately, no. I am hoping that there might be a way to globally fix this with all images on all pages with a global CSS or Javascript change. I need to spend some time researching that. This is not my area of expertise however and, right now, I lack funds to hire someone to help again. I have been fixing other things on the site (lots of pages have broken formatting) and it is also the busy season with our other business (FlytrapStore) so I haven't had a ton of time to spend working on this particular issue.

I do have it as a high priority though to (hopefully) make all of the images on all pages "responsive" by changing width to max-width and setting width to 100% (or something along those lines).

I found a built-in CSS class within bootstrap (the responsive framework we're using) to make images responsive by default. The class is "img-responsive".

I just edited your White Butte page, removing from the images all specification of width, height, etc. and putting in class="img-responsive" and it appears to work now.

Please take a look and let me know what you think.

I believe this is the default functionality we want, so I will likely roll in a change to all pages to allow for responsive images like this.

NOTE: There is still an issue with the editor inserting width and height on the wrapping <figure> element for images when the page is edited. I will try to figure out why and where this is happening and prevent it from doing so if it doesn't break anything else.

OK, I scraped together some funds from our tax return and was able to get the programmer to help get this fixed!

Please test and let me know your results. I believe that all images inserted with the new editor will now be responsive by default and will behave as described in the video walkthrough you put together, adventureharder. Thanks again for making that video.

Glad to help. The page functions much better. I cleaned up some extraneous CSS code that was injected from somewhere. It's possible that was leftover from previous edits. I'll report back if I find any other oddities.

Thank you for the fix!

OK, great!

I pulled up the White Butte page today and all the images were broken again. The page was loading correctly on April 19th, 2019 when I made my last post here in this forum thread. I haven't made any edits to the page since then.

There was no rhyme or reason to the new code. All 5 images had 5 separate, random iterations of <figcaption> and <img> HTML. Unfortunately, I can't provide any more details on changes in the code.

Furthermore, the very first Facebook image URL will not resolve. It's loading fine on Facebook. The other 4 images are pulled from the same Facebook gallery and they are resolving correctly. I double, triple, quadruple checked the code for the href and img URLs. It was correct ... /shrug. I dunno why that image won't load.

Edited To Add: The broken image URL is resolving correctly here in the forums from the link above. Same URL. Again, I don't know why it won't load on the Peak page. It's the only image which won't display.

adventureharder wrote:Furthermore, the very first Facebook image URL will not resolve.

That is because it is a link to a page, not to the actual image. I've altered the HTML to link directly to the image stored on Facebook. It appears to work now.

However, I'd suggest uploading the images directly to SummitPost to avoid any complications with images stored off the site.

Matt Miller wrote: That is because it is a link to a page, not to the actual image. I've altered the HTML to link directly to the image stored on Facebook. It appears to work now.

... this is why I shouldn't edit late at night in my sleep. Sorry for the bother; nothing to see here lol

Haha, no problem!

Matt Miller wrote:... However, I'd suggest uploading the images directly to SummitPost to avoid any complications with images stored off the site.

/necrothread ... I give up linking to Facebook. I don't understand how they randomize their gibberish image URLs; however, they keep breaking, I keep fixing them, and they keep breaking.

What is the best/most appropriate method to attach/embed/link an image internally here on the site to avoid broken image URLs?