WORDPRESS ADVICE AND TUTORIALS

Hi, my name is Alex Mansfield. I've been building websites with WordPress for over a decade. This site documents many of the things I've learned over the years. If you're looking for something I haven't covered, feel free to send me a note with your questions!

Latest Posts

Styling links based on partial URLs with CSS

Sometimes you just want to style all the links pointing to a certain site, or containing a certain string in the URL. For example, styling all links to Wikipedia to stand out from regular links or hiding all links that include “registration” in the URL. It’s just a matter of using: href*= in the CSS …

Styling links based on partial URLs with CSS Read More »

Setting a Custom Post Type Archive as the Home Page

It took me quite a bit of research to figure out how to modify the home page query to use a custom post type archive. Here’s what it takes… 1. Set the home page to display a static page On the Settings > Reading page, make sure the “Your homepage displays” option is set to …

Setting a Custom Post Type Archive as the Home Page Read More »

Preventing Widows/Orphans with Vanilla Javascript

What is a Widow/Orphan? When referring to text on a website, a “widow” or an “orphan” refers to the final word of a heading or paragraph that wraps to its own line. Like this: To prevent this from happening, we can use the HTML entity for non-breaking spaces between the last two words: A non-breaking …

Preventing Widows/Orphans with Vanilla Javascript Read More »

Overcoming the “Cross-Origin Request Blocked” error in PHP

I was making an AJAX call and was getting a “Cross-Origin Request Blocked” error. It wasn’t clear where this error was originating, so I did a little research and here’s what I came up with. When the server determines that the script making the AJAX request is on a different domain, depending on the server …

Overcoming the “Cross-Origin Request Blocked” error in PHP Read More »

Resize Google reCAPTCHA with CSS

Google’s reCAPTCHA can easily overflow it’s parent at small screen sizes. Let’s fix that. Since the reCAPTCHA sits inside an iframe, we can’t target its individual elements with CSS. We can limit the iframe’s width, but that simply hides any part of the iframe that doesn’t fit within our new width. The code below reduces …

Resize Google reCAPTCHA with CSS Read More »

jQuery Code Wrapper for WordPress

When WordPress loads jQuery, it doesn’t provide access to the $ function. Since I’m typically wrapping my code in a .ready() function, here’s the code to get access to the $ function at the same time: This code is posted all over the internet, but it always takes me some time to find it each …

jQuery Code Wrapper for WordPress Read More »