Dark and light mode blog images with MarsEdit

As dark mode is more popular than ever now that the iPhone supports it, I've been working out how to get the browser to render a dark image in dark mode and a light image in light mode. It turns out that the way to do this simply is to use the <picture> element like this: <picture> <source srcset="/wp-content/uploads/2019/11/example-image-dark.png" media="(prefers-color-scheme: dark)" /> <source srcset="/wp-content/uploads/2019/11/example-image-light.png" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" /> <img src="/wp-content/uploads/2019/11/example-image-light.png" alt="Description of example image… continue reading.

Posted on 4 December 2019 in Computing, MarsEdit, Software, WordPress

Embedding Notist slides

This site uses WordPress under the hood as I find the flexibility that a good CMS provides quite useful. For the talks section, I use a custom post type so that I can set additional properties on the post and customise the display. With my usual lack of imagination, my custom post type is called talk. When Notist was released, I've been uploading the PDFs for my presentations there so that I have a nicely… continue reading.

Posted on 30 October 2019 in PHP, WordPress

Displaying exif information in WordPress posts

After discovering that WordPress modifies img tags when rendering a page, it crossed my mind that I could display exif information underneath each image on my new photography blog. The basic process is applicable to any manipulation of the content that you would want to do before it is displayed. To do this, we add a new filter to the the_content hook: add_filter('the_content', function ($content) { // manipulate $content return $content; }); As with all… continue reading.

Posted on 14 August 2019 in PHP, WordPress

Images and WordPress

My new WordPress project has multiple photographs per post and as I wanted them to work in an efficient manner for multiple screen resolutions. The secret to this is the srcset and sizes attributes on the img tag. It turns out that WordPress will create multiple sized thumbnails when you upload an image. It will also add the srcset and sizes attributes into your img tags for you if your image tag has a class… continue reading.

Posted on 7 August 2019 in MarsEdit, PHP, WordPress

Developing WordPress sites with Docker

I recently set up a new WordPress based website and local Docker-based development environment. This post documents what I did, so that I can do it again next time! As I'm not in the WordPress world, many things are strange to me and I'm indebted to Jenny Wong for pointing me in the right direction on numerous occasions and being very patient with my questions! Thanks Jenny! Project organisation There's always ancillary files and directories… continue reading.

Posted on 1 August 2019 in PHP, WordPress

Shorter Link: A rev=canonical WordPress plugin

Hot on the heels of my No DiggBar, I've created another extension for WordPress! Shorter Links provides a <link> tag in the <head> section of your page with a shorter url and appropriate tags for use with the new revCanonical system. Further details can be found at laughingmeme.org, shiflett.org or benramsey.com. The link created looks like this: By default, the shorter url is simply {your domain}/{post id}, but the plugin also creates a custom field… continue reading.

Posted on 11 April 2009 in WordPress

Digg bar blocker for WordPress

The DiggBar is a URL shortening service that puts your website within a frame on digg.com. As a result, the user sees Digg's URL, rather than your URL in their address bar, no matter which page they navigate to on your site. I don't particularly like this, so I've written a small plugin for WordPress that removes it. Go to the No DiggBar page to download it. Tip of the hat to John Gruber for… continue reading.

Posted on 10 April 2009 in WordPress

Fixing — in WordPress

One thing that I've noticed is that whenever I used — in a post, such as this one, WordPress converted the — to &emdash; which whilst very pretty doesn't work so well for people trying to understand command line switches to ./configure! Today, I finally got around to poking into the WP source code to work out what was happening and I tracked it down to the wptexturize function in the wp-includes/functions-formatting.php file. Once I… continue reading.

Posted on 21 March 2009 in WordPress

post2cat doesn't exist after upgrading WordPress

Note to help anyone else who has the same problem! If you are a "little behind" the times when you upgrade you WordPress installation, you may see errors like this: WordPress database error: [Table 'xxx.wp_post2cat' doesn't exist] SELECT cat_ID AS ID, MAX(post_modified) AS last_mod FROM `wp_posts` p LEFT JOIN `wp_post2cat` pc ON p.ID = pc.post_id LEFT JOIN `wp_categories` c ON pc.category_id = c.cat_ID WHERE post_status = 'publish' GROUP BY cat_ This is because the tables… continue reading.

Posted on 10 November 2007 in WordPress

WordPress 2.0 Rewrite Rules

We recently upgraded my wife's blog from WordPress 1.5 to 2.0 and it broke the mod_rewrite rules used to support the legacy Movable Type urls. When she migrated from Movable Type to WordPress, we moved to /{year}/{month}/{day}/{slug} type urls from the default Movable Type rule of /archives/{id}.html. We read the manual at the time and put the following into the .htaccess file: RewriteRule archives/0*(d+).html /index.php?p=$1 RewriteRule index.rdf /index.php?feed=rdf RewriteRule index.rss /index.php?feed=rss RewriteRule index.xml /index.php?feed=rss2 and… continue reading.

Posted on 18 January 2006 in WordPress

Category: WordPress