Production Site different than Dev site?

Figured it out but I’d still love to know why it happened. The project post images were wrapped in a <p> tag (not by me) but the localhost images did not. I’m referring to the source code.

Heres what was entered into the production admin panel, which was exactly the same as the local admin aside from the image urls. When I inspected these, all three images were wrapped in a <p> tag on the product site, which threw off the CSS. Why wouldn’t it be the same as the dev site?

<div>
<div class="single-project-content__images">

<img src="https://www.sdigitaldesign.com/wp-content/uploads/2020/10/tbb2-300x188.png" alt="Travel Blogger Website" width="300" height="188" class="alignnone size-medium wp-image-116" />
<img src="https://www.sdigitaldesign.com/wp-content/uploads/2020/10/tbb3-300x188.png" alt="Travel Blogger Website" width="300" height="188" class="alignnone size-medium wp-image-117" />
<img src="https://www.sdigitaldesign.com/wp-content/uploads/2020/10/tbb7-300x188.png" alt="Travel Blogger Website" width="300" height="188" class="alignnone size-medium wp-image-118" />

</div>

Lorem, ipsum dolor sit amet consectetur adipisicing elit. Odio mollitia, aut perferendis dolor repellendus et asperiores quisquam minus nostrum atque, fugiat tenetur ipsum repellat eaque tempora excepturi laboriosam recusandae fugit doloremque cupiditate, rem porro iusto! Deleniti in praesentium qui aliquid itaque, ipsa dolore eos adipisci quo dolores et nulla provident inventore maiores voluptas impedit rem architecto minus, possimus quos blanditiis!

</div>

Content is passed through wpautop(), which is added as a filter callback. That explains how the p tags got there. WP does this by default. I’ve no idea why it wouldn’t do so on your local version. Some people intentionally remove the callback because they find it annoying. I don’t think you’ve done that or you’d have known about the auto p bit already. But apparently it’s not working for some reason.

BTW, it’s impractical to remove this “feature” once there’s a body of existing content, as older pages will display differently than new pages. It’s something to do from the start or not at all.

Thank you for the information. You’re correct that I didn’t remove callback.

I don’t know if it’s just me but I’m finding that learning WordPress, beyond the basics, of more difficult than anything I’ve taught myself so far (HTML, CSS, Javascript, React, Node). It feels as though you cant learn the traditional way (videos & books). You just have to start trying building something and learn from each problem that arises. Perhaps I haven’t come across the right course yet?

Perhaps. Everyone learns differently. I personally prefer the learn by doing approach. Tutorials are good for overviews so we can learn what’s possible. For me at least, it takes struggling through a real world project for things to really sink in. Tutorials and lessons just don’t sink in like working on a real project does.

It may seem like a scattered, random, inefficient way to learn. I see it more as learning what I really need to know without being overwhelmed by aspects that I don’t really need to know. When something comes up which I’ve yet to learn about, I’ll figure it out then. It’s not so much what you know as much as knowing where to go to learn what you need to know. I love reference materials ??

Yes, WP is particularly difficult to grasp from the onset. It’s not just a structured scripting language like PHP or JavaScript, it’s a full CMS app written by hundreds of different people. Apps are always more complicated than whatever language they are based upon. Keep at it and you’ll start to get it. You don’t need to know everything there is to know about it. Focus on what you need to get your project done.