Use an Image From a URL With Timber

Most of the time when creating a WordPress website based on Timber I am working with local images that were added through the WordPress media library or uploaded using an ACF image field. You use these with the help of the get_image() function of Timber.

But sometimes it can come in handy to work with images from an URL source – be it from another site or even your own server.

Here is how to do that with the get_external_image() function:

$context = Timber::context();

// Lets say you have an external image that you want to use in your theme

$context['cover_image'] = Timber::get_external_image($url);

Timber::render('single.twig', $context);

Then in your twig file you can use the typical filters and properties:

<img src="{{ cover_image.src }}" class="cover-image" />

Helpful documentation for further information: Timber\externalImage and work with external images.

How to Fix: Cannot create a new Simulator on Xcode running on macOS Sonoma

I use the Xcode Simulator for testing and debugging the website I create on iOS since I don’t have an iPhone. It is basically the full iOS running inside a window on your Mac.

Since upgrading to macOS Sonoma I was not able to launch or create a new Simulator however. When trying to create a new Simulator I wasn’t able to click into the “OS Version” field – it just wouldn’t do anything:

How to Fix Not Being Able to Pick an OS Version

When I opened the main Xcode app and selected the “iOS” tab on top, it showed the notice “iOS 17.0 Not installed”. So just click on “GET” and download the new OS, which might take a little while:

After having downloaded the iOS version and reopening the Simulator app I could pick the “OS version” again and was able to use my old Simulators and also create a new Simulator device without a problem:

So here is this website running inside a virtual iPhone 15’s Safari. You can use almost all features of Safari and see the whole browser ui which is handy for better testing of responsive websites:

Bonus Tip: Add more OS versions inside XCode / Simulator

I also learned along the way that inside Xcode’s settings you can head over to the “Platforms” tab to see all installed Platforms and download new ones:

Order your Google Chrome profiles the way you want

I use profiles inside Google Chrome a lot. The helpful function makes it easy to separate Google accounts or website logins and is also handy when wanting to remember 2FA (Two-Factor Authentication) codes in the browser for longer time.

There are several of these profiles that I only access maybe twice a year e.g. when accessing Google services with a specific account.

🫤 Chrome’s default: profiles are ordered randomly or chronologically

I have 20+ profiles set up. On opening Chrome it displays the “profile picker” window. By default these are ordered by an obscure method – maybe by date added or so. This means that the profiles I actually want to use most often (maybe 3-5 profiles) are harder to find and I might need to scroll down every time I want to use them.

From the interface there doesn’t seem to be a way to manually reorder these profiles.

✨ The solution: Nicely order your Google Chrome profiles

Turns out you can actually order your profiles in your preferred custom way:

1. Open Chrome so the profile picker window appears:

2. Edit your profile by clicking the three-dots menu and selecting “Edit”:

3. Change the name of your Chrome profile. You could either prefix it with an Emoji or with a number to order them precisely.

Clone All Files From a Single Git Branch Without Git History

When starting a new WordPress theme project I usually create a new Git repository for my custom theme to be stored in. Into that I want to clone the files of the starter theme I am using (Flynt), but without that project’s Git history (.git directory). Here are two ways to do that:

Use Git Commands to Clone Without History

I have my new repo locally at ~/code/new-theme and want to clone the next branch of the public https://github.com/flyntwp/flynt repo into that:

cd ~/code/new-theme
mkdir tempclonedir
cd tempclonedir
git clone --depth=1 --single-branch --branch next https://github.com/flyntwp/flynt . 
rm -rf .git
cd ..
mv tempclonedir/{.,}* .
rm -r tempclonedir

Of course you can combine these commands into a one-liner like so:

cd ~/code/new-theme && mkdir tempclonedir && cd tempclonedir && git clone --depth=1 --single-branch --branch next https://github.com/flyntwp/flynt .  && rm -rf .git && cd .. && mv tempclonedir/{.,}* . && rm -r tempclonedir

Using degit to Clone Single Git Branch

Alternatively you can use degit to make the same task easiert. It’s a Node.js package maintained by Rich Harris, the creator of Svelte.

First install degit globally:

npm install -g degit

Then to do the same as above run the following command:

cd ~/code/new-theme
degit https://github.com/flyntwp/flynt#next

Note: if you are cloning into a new git repo (that already has a hidden .git directory and therefore isn’t empty) you have to append the “–force” parameter.

Meeting the Swiss WordPress Community at WordCamp Switzerland 2023

I attended my first WordCamp today at this year’s edition of WordCamp Switzerland in Murten. The event was a one-day conference for people who are interested in the WordPress community. With about 220 participants, there were 16 talks ranging from legal issues like the new Swiss privacy law to SEO.

My badge of WordCamp Switzerland 2023

People were very open and I enjoyed talking to some of them – whether they were professionals earning their daily bread with WP based projects, enthusiastic hobbyists or people working for service providers like Cyon, the Swiss hosting company.

My favourite talks were:

  • WooCommerce, but faster! by Remkus de Vries in which he talked about the importance of putting the focus on the right aspects of your site, for example picking a good hosting service and external caching provider.
  • How to automate your maintenance by Nico Martin with an introduction to Playwright and how you can automate testing with it.
  • SEO WooCommerce: let’s get that traffic where Isaline Muelhauser shared practical insights in how she approched a project in her role as SEO strategist.

Was definitely interesting and I can recommend you to go – it’s nice to meet other people that share the same or might have other perspectives on the WordPress ecosystem.

Thanks to everyone who helped to organise the whole event quite smoothly. They also did a good job at including everyone speaking German, English and French 👏🏻