Page 87 of 427

Dynamic Elements, Static Elements, Event Handlers and Their Complexities

February 16, 2018 / Tom

Working with stacked elements on a page, some that are anchors, and others that are elements with event handlers can sometimes cause weird behavior.

Ultimately, it all has to do with event propagation, but if you’ve not had to deal with that (or event bubbling or anything like that), it can be a bit of a challenge.

And here’s an example: What if you have an image that is wrapped in an anchor. What happens when you a dynamic element that’s placed via JavaScript after the page loads that loads another dynamic element? On top of that, you want to stop the page from redirecting when the dynamic element is clicked but still direct when the image is clicked?

It might sound simple – and in some cases it is – but if you have a transparent element overlaying the entire, original image it can become a whole other challenge.

This is where understanding event targets come into play. But before going into how to solve it, I’ll try to distill everything down into a simpler explanation and diagram out how it’s rendered in the DOM.

An IDE for WordPress Development (Regardless of Experience)

February 15, 2018 / Tom / 0 Comments

In the previous article, I walked through the process of setting up a local development environment using a package manager. Specifically, I talked about using Homebrew to install Valet and Composer.

The former offers the Nginx web server, a MySQL database server, while Homebrew allows you to install PHP. Composer gives you the ability to deal with PHP dependencies. If you’ve not read the post, I highly recommend it as this post is predicated on that entire environment.

Specifically, I’m going to be talking about IDEs. It’s a hot topic, I guess, but if you don’t have a preference then I’m going to walk you through the process of picking one that I think is best (at lest to start with), configuring it, and using it in the context of the environment established last week.

Modify Image Containers on the Server-Side in WordPress

February 13, 2018 / Tom

Whenever you’re building custom solutions for other people, you may find yourself having to deal with nuanced cases of how WordPress is rendering the content.

This usually comes down to the theme, at least one plugin, or the combination of both. And if you need to work with images individually, then it can be a bit of a challenge. The problem with even trying to write a post like this is that it’s hard even to describe a situation in which you may need something like this.

Even still, I’m going to do the best I can. That is, I want to share how to modify image containers on the server-side before rendering them on the client-side and do so using PHP’s DOMDocument library.

Sound like a lot? Hopefully, I can break this down easily enough.

Quick Tip: Check User’s Browser With JavaScript

February 9, 2018 / Tom

You’d think in 2018 we’d have a standard way to do browser detection or that the majority of browsers would handle standard idiosyncracies around CSS properly.

But here we are, and it’s still not happening.

This means that when it comes to working with JavaScript, we still may have to do a bit of browser sniffing to determine which browser it is with which we’re working.

Don’t get me wrong: It’s not as bad as it used to be, but there are times in which I’ve recently encountered errors with Chrome and Firefox, specifically.

A WordPress Development Environment (Using a Package Manager)

February 7, 2018 / Tom

At this point, I’ve written about as much of the OOP Fundamentals that I believe are necessary to begin looking at more in-depth topics (such as design patterns and how to apply these topics in WordPress development).

But when planning the content, I kept coming back to a few other things that I think are also necessary to cover eventually. These are things such as Composer, Yarn, build tools, and so on.

Above that, though, I kept asking myself:

If I’m going to be writing about this material at length, should I assume we’re all using the same environment?

And that’s a tough question to answer because some of the people reading this have been writing code for quite some time. That is, they (or you) have your tools, your setup, and how you like to organize your projects.

On the other hand, there are those (or you), who are looking for a different way or looking to start from the ground-up. And to that end, I think it’s important to cover two things:

How to Setup a Local Development Environment
What IDE, Add-Ons, and Tools are going to be used

For some, it’s not the most exciting topics and it’s certainly putting a pause on the more advanced aspect of object-oriented programming. Since those of you who pay to read this material have access to the comments, I have to assume that – at some point – comments will come through asking about how to achieve certain things.

And to that end, I’m going to assume that we’re all working off of the same playing field. If not, there’s only so much that I can do to provide help beyond actual programming questions.

So before going any further into the depths of object-oriented programming, I’m going to spend a few posts covering the above topics in detail to make sure that we’re all on the same page.

If you’re comfortable with your tools and your setup, then please bear with me. If you’re looking for a definitive way to setup your environment, then the following posts are for you.

And with all of that said, let’s get started with talking about how to cleanly set up a local development environment that’s easy to maintain.

[restrict paid=”true”]

Tom McFarlin

Dynamic Elements, Static Elements, Event Handlers and Their Complexities

An IDE for WordPress Development (Regardless of Experience)

Modify Image Containers on the Server-Side in WordPress

Quick Tip: Check User’s Browser With JavaScript

A WordPress Development Environment (Using a Package Manager)