Posts relating to
Dev Tricks

Have you ever needed to convert the string immediately before br tags, wrapping it in span tags? Me too, oddly. I’m sure there’s a regex way to do this but at the time of writing my brain wasn’t willing to entertain the idea, so here’s a very simple way to achieve it using simple string and array […]

Cross-browser support for scrollbar styling and visibility is a challenge. It’s as simple as that. This article provides a solution that addresses the issue of hiding the scrollbars, using scrollbar-width, ::-webkit-scrollbar and -ms-overflow-style. What are Scrollbars? Scrollbars are bars that appear down the right-hand side and across the bottom of the browser (or an element […]

Being a developer I’m often looking for little ways to improve website performance, such as how fast a website loads and the user’s browsing experience. There’s a little known trick that helps with the latter, simply by not inheriting the overheads of pages you click through to. What you probably didn’t know about opening links […]

This simple article provides a CLI command to compress a directory whilst excluding specific sub-directories and files. We do a lot of custom development using modern development tools. From time-to-time we need to compress certain directories for deployment to production. In such cases, it is very common that some files and sub-directories need to be […]

This article describes how to resolve the issue with IntelliJ not providing autocomplete for imported SASS and JS resources. The same fix can be applied to PHPStorm. IntelliJ is an awesome IDE, but recently it stopped recognising imported SASS and JS resources. This didn’t stop them from compiling, but was very annoying, as it flagged […]

On a client site, we wanted to restrict menu items to Custom Links, only. Thus remove all other menu types. The main drive behind this was to improve the user experience and reduce confusion, as the menu is only for Social Links. With a brief search yielding very little I set about coding a solution, […]

Recently, I had an odd scenario where wrapping long text needed either word-wrap, overflow-wrap or word-break to achieve the same overflow pattern across different browsers. To arrive at a suitable solution I opted to use @supports to maintain control of the declarations. What is @supports? @supports is a feature query, whose associated block of statments […]

There are many use-cases where scripts and stylesheets only need to be loaded on certain pages. One such example would be to only load the JavaScript and CSS stylesheets for Contact Form 7 (a lightweight contact form plugin) on the contact page. This article will demonstrate how to conditionally load the JS and CSS for […]

Processing styling rules based on certain criteria, such as viewport width, is achieved using the @media conditional group rules. As of October 2018, all modern browsers support nested @media queries. What’s a @media query? Here’s a simple example of a media query to make the text 10% bigger on devices with a screen (viewport) wider than 768px […]

The WordPress RSS feed is great. We use with third-party services, such as MailChimp. One key datum that isn’t included in the feeds by default is the featured image for posts (and pages). This article will address that with a simple ‘action‘ hook that adds the featured image to the item’s feed. /** * Filter: […]