Articles in Series "WordPress"

Not Being Tracked by Functions In WordPress Core

Install the plugin “Disable Google Fonts” to disable the loading of “OpenSans” from Google when using WP admin. The font brings no advantages over the standard appearance of WP admin.

Note: “Disable Google Fonts” is abandoned, and WordPress core apparently stopped loading fonts from Google.

Install the plugin “Disable Emojis” to disable the loading of an external SVG. 😀

Support For Multiple Languages in WordPress

Introduction

Foreign visitors have pointed out to me that they sometimes read my blog using translation functions in their their webbrowsing software, most notably “Google Translate” which is directly built into Google Chrome. That translation function does a good job, but sometimes produces oddities, for example it attempts to translate my lastname, which is also a valid German vocable.

That problem was quickly addressed by adding the class="notranslate" plus the HTML5 language attribute translate="no" to a <span> surrounding my name. But this incident contrasted a deeper problem that has been troubeling me for a while now.

Read More »

Adding Custom Format Buttons To tinyMCE in WordPress 4

Introduction

In my technical articles I sometimes use inline fragments typed in a monospace font to highlight code or filenames that appear within floating paragraph text. Back in the days I did this with the <tt> element, nowadays I use <span class="tt"> and a CSS style like

.tt { font-family: monospace; }

I wanted to extend the tinyMCE in WordPress with a toggle button that behaves like the Bold or Italic buttons and surrounds selected text with such a <span class="tt"> element or, when pressed while an already surrounded text is selected, removes that surrounding again. Also, when the cursor is inside such an element, the button should switch to an “active” state that indicates that the character format can be deselected.

Read More »

WordPress-Plugin to Embed Gitlab Project Information

For my personal use, i wrote a small WordPress plugin that allows me to embed a link to a Gitlab repository, a list of commits and a link to the releases of that project in a WP post.

Example (linebreaks added to shortcode for readability):

[​gitlab-show-project
    url="https://example.test/gitlab"
    project_id=99
    max=3
    author="none"
    releases="latest"​]

Read More »

Removing the Builtin Inline CSS from WordPress

Should you – as i did – wonder why WordPress renders a bucket of inline CSS into the HTML output (such as --wp--preset--font-size--normal in <html> or  --wp--preset--color--white in <body>): This is done to accomodate frontend editing with Gutenberg. If you – as i do – are not using Gutenberg frontend editing, then the following PHP code can be included in the functions.php of a custom theme or the php file of a custom plugin. Sorry, Gutenberg folks – no means no. 🙂

Read More »

WordPress Plugin to embed Gitea Repositories

I ported the WordPress plugin providing shortcodes for embedding Gitlab projects into posts and pages to a Gitea version.

Below is a usage example, displaying the latest 3 commits and the latest release (if any) from repository “linuxfoo-gitea” on my Gitea instance:

[gitea-show-project url="https://tk-sls.de/git" project_owner=tk-sls.de project_repo=linuxfoo-gitea max=3 releases=latest]
Project information not readable.

Read More »

Disabling external Emojis in the WordPress Admin GUI

In a previous article i mentioned that the “Disable Emojis” plugin removes requests to external servers for downloading Emoji graphics on a WordPress site. This works in the frontend (the part the user/customer visits). In the backend (the part the admin visits) there are hardcoded references to external emoji graphics., for example here:

https://github.com/WordPress/WordPress/blob/3d3e104908f875a0df3d5f7692feeb8874780b2a/wp-admin/about.php#L146

There also does not appear to be a suitable administrative filter that could be used to patch the unwanted HTML image references out of the effective HTML sent to the browser:

https://developer.wordpress.org/apis/hooks/filter-reference/#administrative-filters

However, the user browser suppresses the loading of such external graphics if the Content-Security-Policy (CSP) header sent by the webserver includes this statement:

img-src 'self' data:;

Now, user browsers will refuse to load any images that are not from the same site or are provided as “data” attributes (i.e. inline):