As part of my recent investigations in the new Gutenberg editor for WordPress I came across a cheeky little error that had me stumped for a while.
Now, I saw this issue whilst running on a local VVV setup, that I’d created solely for this Gutenberg investigations, and as such it was running on an nginx server. I had also not tweaked the default permalinks settings.
Some digging later I pulled out this github issue, and that lead me to the solution workaround here.
To get it working, all you have to do is set a more fancy permalink structure, such as http://local.wordpress.dev/sample-post/.
It seems the issue is to do with PUT request support in the default nginx config, and the way the WordPress REST API works out-of-the-box. If you want more info, follow that trac ticket above.
I hope to be writing more on my Adventures in Gutenberg, especially my work on adding support for it to the Widgets on Pages plugin.
After another favourable month in the meetup calendar, I was again available to get along to the WordPress London meetup, and boy was it a stonker.
The meet was held again at City University, who have been incredible venue sponsors of the meetup for ages, and who’ve agreed to keep up the sponsorship deal until the end of January 2018… bloomin’ good folk they are.
And speaking of sponsors, I should also mentioned that Gary and Dan announced that WP Engine have just agreed to a 12 months sponsorship renewal… so huge thanks to them also, and of course to SiteGround who sponsored the June event too.
The meetup was taking on a new format this month, and the first change was the expanded section on announcements within the WordPress community. I’ll just bullet the key notes here;
WordPress London 2017 are after some support in formatting and posting up the transcripts from the talks. If you’re interested then you can find out more by tweeting me.
The Role of Page Builders for Developers – Doug Belchamber
This first talk came from Doug, who works for Smarter Digital, and focused on his history with Page Builders, and how his opinion has changed over time, right up to the 2nd-gen page builders of today.
He told us how they’ve evolved, from the times of using shortcodes, and widgets, and then ACF. From these building-blocks came, what Doug refers to as, 1st gen page builders. These 1st gen incarnations had a few weak spots. They weren’t great at showing how content was going to be rendered on the front-end, their performance was questionable, and then if you disabled them you were left with what Doug refers to as shortcode hell. These thoughts and anecdotes appeared to ring true with many attendees… there were a lot of burnt fingers.
He then talked about Beaver Builder, one of a current raft of plugins that he classes as 2nd gen page builders. This part was thoroughly enlightening… he talked through how he uses it in his workflow, as a developer, and how you can create modules for it, configure it dramatically via its powerful API, and handle user access.
Now, I can certainly see myself as one of these devs who instantly feels a bit nauseous when page builders are mentioned, but Doug has done them proud with this talk… go watch it now.
This next slot was incredible… Dan and Gary made a real steal in getting hold of this chap to talk through the updates to WordPress that dropped in version 4.8.
OK, I’m kidding… it was me doing a brief lightning talk as part of the new format of the meetup. I don’t want to big myself up too much, but if you want to know about the new Widgets then checkout the slides, or video of the talk.
WP_Model – Anthony Budd
Next up was Anthony, talking through his pseudo ORM for WordPress, WP_Model, and open source project designed to provide a better method for handling posts using a simple OOP style syntax.
I made so many notes on this, as it was truly fascinating. WP_Model can be thought of as cake, or Laravel, if you’re familiar with such things. Anthony started the project to abstract the way he had to deal with multiple tables in the WordPress database when building apps with WordPress as a Backend. He was having to use wp_post and wp_postmeta tables, but with WP_Model he was able to create an abstraction of the data. He had several goals for his project, they included;
Easily added to existing project
Calls to go through wp core
Anthony also mentioned some generic benefits of re-using WordPress as the backend for your project. Things like its popularity and community, and from those the vast repository of plugins.
There were loads of great examples in Anthony’s talk, so I strongly suggest you check out the following links;
And for what reason did I start going along to these again? Well I have just recently released freemium WordPress plugin, called Turbo Widgets. This is an update to the five star rated Widgets on Pages plugin that I wrote and submitted to the WordPress plugin repo many years ago now. With this now out in the wild I felt that it would be good to get involved in the community again, and make sure that I’m up-to-date with the best practices, technology and, of course, gossip.
On my way into town I did the usual “search for the event hashtag to see of anyone is about for a cheeky half beforehand”… and loandbehold this popped up in the results… result!
Anyone coming to #wpldn tonight? I'm already in the Blacksmith and Toffeemaker @wpldn
I knew of Jenny from her move to HumanMade and her stunning work in the WordPress community; she was lead organiser of the amazing London WordCamp 2016, so who was I to turn down an invite like that. I had a cracking pint with her and mostly chatted about the recent WordCamp. If you ever get the chance to chat to her then you’ll find her passion something to cherish.
Onto the event, and the food and beer that was provided thanks to the evening’s sponsors, SiteGround, WP Engine and Beaver Builder. Some quick, and nice, chats were had and then the talks began.
Why we built our SaaS startup on WordPress and why you should too – Elliot Taylor
Elliot shared what he’d learnt from taking on his SaaS offering YoGrow. He spoke of the journey from it being a plugin in the WordPress repo right through to it’s current state as a SaaS offering. He first spoke of the downsides of the public repo, and how it’s very hard to get a real valuable insight into the usage of the plugins. He said it was very hard to have a conversation with users, and to find out what features they like etc.
Failure is a guaranteed part of building a product
He also ran through some reasons to use WordPress as the platform for your SaaS project, and other tips that he’d picked up on his way to his current position. I haven’t found a link to his slides, yet, but he’s what I’d jotted down in my notes.
Failure is a guaranteed part of building a product – It’s better to fail on small iterations
Don’t try to do to much, don’t focus on the solution, and focus on the problem.
If you can, market whilst you’re building.
Set some KPIs, even if they’re just guesses they’ll keep you focused.
I also asked Elliot if he was ever concerned about uptime when he pivoted to a SaaS from a product. This worry is one that is right at the front of my mind when I ever think about setting up service businesses. Elliot was pretty dismissive of this, and said that there were top-notch WordPress hosting companies that took this worry off his shoulders, two potentials are actually sponsors of the meetup too.
Docker Deep Dive for WordPress Admins – Mark Sta Ana
Mark was next up, and gave us a technical talk on how a WordPress dev/admin could use Docker in their workflow and deployment. He started out explaining that he first started reading about Docker following a hack on one of his sites that quickly spread to his others. By using Docker, Mark is now able to sandbox all of his sites, so that any compromise is now limited in risk.
He then gave us demos of Docker in action. He showed us how to get a WordPress site setup, and how the various parts all fit together. To be honest I couldn’t do his talk justice, technically, so I’ll just link to his slides.
In my local WordPress dev workflow I currently use Vagrant through the wonderful VVV, whether I’ll switch to Docker for that I’m unsure, but perhaps if I ever take of my own production hosting then maybe I’ll give it another look.
I was so pleased to be at another local WordPress meetup, I honestly missed it, and the members, so much.
Dan appears to be doing a great job organising the meetups, and the wpldn.uk project (more about that in another post, to come) and deserves a huge thank-you, from at least me, on such a good night. Thanks also to the speakers and let’s not forget the sponsors.
The next meet has already been pencilled in for the 26th May (though check meetup for updates, as it may change), so mark it in your diary… and I hope to see you there.
I recently attended WordCamp London 2016. It was a true blast and an absolute success and really deserves its own blog post, maybe I’ll get round to writing one soon. There is a small thing I need to share sooner though, as it’s been a HUGE help to me in my dev life.
To add conditions to breakpoints the process is straightforward. Simply right click on the break point and you get the option to edit it. From here you can then add the conditions.
Now when my code runs the breakpoint shall only be triggered once the conditions are met. In my case (see this Codepen) I wanted to only trigger my breakpoint when the el.name was the string “Flop”.
I learnt of this during an extremely enlightening talk by the wonderful, passionate Katie Fenn that covered loads of gems of information on how to make the most of the Chrome dev tools. Her slides can be found here.
In my experience of building and maintaining WordPress web sites it is quite a common to want to put some related blocks of information into your main post’s or page’s content, inline. For example you might want to add a tag cloud or a list of related posts. This type of information is already available via WordPress widgets and of so you could add it to your sidebar (if you theme and template supported one). But what if you want to add the tag cloud into the middle of the post… like this;
So this is possible today using my 5* rated Widgets on Pages plugin. With the plugin installed you can create a new Widgets on Pages sidebar, add your Tag Cloud widget to it, copy the generated shortcode and then paste that into your content. But now it’s even easier…
Introducing Turbo Widgets
I’ve recently created a new plugin for WordPress, called Turbo Widgets. And with this, WordPress widgets can be added to posts and pages using the nice WYSIWYG editor… click, click, click, BOOM!
There’s a free version of the plugin available on the WordPress.org plugin repository that has this nice GUI for adding widgets and there’s also a premium version that supports the ability edit the widgets too, again using the TinyMCE WYSIWYG editor.
And Turbo Sidebars?
As well as this, the premium version also supports Turbo Sidebars. These are custom content areas that can hold standard WordPress content (text, images, etc) as well as widgets added through the Turbo Widgets features. These content areas can then also be added to posts and pages via shortcodes (soon through the WYSIWYG too) . You can also use template tags to add these Turbo Widgets to your themes templates, say for example adding related posts to the bottom of each blog page.
It had been quite a long time since I last attended a WordPress London meet-up, so I was very excited about going along again and getting a good fix of WordPress geekery (as well as chatting to folk and drinking beer of course). The event was held at Shoreditch Works Village Hall for the first time and it provided ample space and the required tech. The venue and pizza was sponsored by the following kind orgs;
Joel gave a passionate and honest account of his move from permanent employee, through contractor and freelancer and onto running his own agency. He covered some of the key mistakes that folk (including him) make when starting out in alone, and some notes on avoiding them (the second time perhaps). They include;
Undervaluing Yourself : On a personal level right through to pricing
Clients from Hell : Educate the good ones, they’ve probably not bought a website before. Fire the bad ones.
Business is Personal : If you’re a freelancer, BE a freelance; don’t pretend to be an agency if you’re not. If you do you won’t be authentic, and this will show.
Joel also did some shameless pimping of his The Business of Web Design conference, which I have to say has a nice looking line-up of speakers. I’d probably be going if we weren’t due a baby the week before.
He also asked for freelancers of all sorts to get in touch with him. Looks like business is good.
I have seen one or two of Dave’s talks before at various WordPress (un)conferences and after seeing his take on Baz Luhrmann’s “Everybody’s Free To Wear Sunscreen” I wasn’t sure what to expect next. He didn’t disappoint by starting the talk with some kind of body convulsions which, I think in popular culture, could be described as dance moves.
He then proceeded to talk us through some basics behind running a WordPress migration with as few hiccups as possible. He discussed various migration types (server to server, multisite to singlesite, domain swapping) and their various pitfalls. He also talked through a few tools which can make life easier. These included MySQL Workbench and his company’s Search/Replace plugin.
In true Coveney style he then plumped for a live demo of a site migration (server to server and domain swap)… the audience, of course, new the perils of live demos and were all waiting for the inevitable.
Don’t work with computers – Dave Coveney
And of course the inevitable happened. So much so infact that Dave’s new database that he was using in the demo ended up being named fuckit. He rode out all that the live demo-gods could throw at him with it finally succeeding. His parting words of advice were “Don’t work with computers”.
Stiofan O’Conner and Tim Clark – GeoDirectory
Stiofan and Tim talked to us about GeoTheme and the move to a new GeoDirectory plugin that will be appearing on WordPress.org very soon.
They briefed us on the history and the direction they think the plugin is headed. How they want it to become and extendible product with multiple revenue streams. The plugin looks like it’ll be very powerful and is well worth looking at if you’re interested in building up any kind of location-based directory.
The standard post-meetup beers were had in a hipster-filled pub just around the corner, and I had some lovely chats with old friends and new from the WordPress community. I heard from a couple of the guys and gals that there was a lot of work out there for a WordPress freelance dev… this is certainly good news with my resignation notice period winding down.
It was 1054 days ago that I first wanted to place a WordPress widget into a post I was writing. Whether it was for a client site or personal one I can’t remember… the important thing is that out of the solution I came up with emerged the Widgets On Pages WordPress plugin.
The plugin has undergone very little change since it’s 0.0.1 check-in to the WordPress.org plugin repository but since then it’s had very favourable reviews and been included in several blog posts and conference talks. But more importantly, for today at least, it’s now been downloaded over 100,000 times!
It has a current rating of 4.7/5 and at the time of writing sits as the 105th most highest rated plugin on the WordPress.org repository. 105th might not seem too good but it should be noted there are over 23,800 plugins in the repo.
At the August Meet-up of the London based wp-hooked I talked on the topic of WordPress Widgets, and in particular the admin area for them (slides can be found here). The talk came from the view of a user (read not developer) of WordPress who wants to take advantage of all the wonderful chunks of code that already exist in the WordPress widgets ecosystem. This ecosystem is a constantly growing one with Widgets being developed and released on the WordPress.org repository all the time. For website users (e.g. site owners, authors, etc) to actually make use of these great blocks of logic it’s not a friendly place sadly. The legacy idea of Sidebars is one that still has a place but it’s the use of Widgets outside of these well-trodden widget areas that things start to get tricky.
Let’s CMS it ALL
Users are wanting the freedom to add widgets into posts and pages as inline content; they want to easily add widgets to footer areas for things such as recent post lists, location maps and recent tweets. All these things are available as widgets but for users are heavily theme-reliant when it comes to how many widget areas are available to them and where those areas are on their site. In my talk (it could hardly be called a presentation) I suggested several plugins that can help users on their way to achieving these things;
During the talk several other plugins were discussed;
Dynamic Widgets – Control which widgets to display in the sidebars for pages
Widget Logic – Control which widgets to display in the sidebars for pages
Multi Edit – Not really widgety but adds extra content blocks to posts and pages admin screens
Page Layout – Page Layout allows to define a page layout using widgets
Carrington Build – A premium build tool which gives an advanced admin “layout” UI which enables users to add “content modules” to pages which could be widgets.
Although all these plugins seem to add some great support to users when it comes to having control of their sites’ layouts and in particular the use of widgets they all seem to be a bit lacking. As a group we discussed what the solution would look like if we were designing from the ground up… especially now that we knew there was a demand to have this extra level of control and advanced use cases… something that the WordPress guys wouldn’t have known about when initially thinking about widgets. We came up with the following points which would hopefully spur on some further thought and potentially create a great solution;
Users want to add widgets to posts and pages on the fly.
Do widgets need to belong to sidebars? My personal thinking here is that CPT could be used to replace sidebars altogether.
Perhaps Widget attributes could be stored in post meta data if that Widget instance belonged to a particular post.
Having a drag and drop, minimal interface via the editor would be good… we would want to avoid the use of shortcodes. Perhaps in a similar way to the method used for images?
Users want to easily add widget areas to existing themes
Users want to be able to control the layout of widgets within their posts and pages.
And so there we have it… we have essentially a loose spec for a killer plugin or modification to core.
And what of wp-hooked?
For my part I really enjoyed the opportunity to vent some frustrations I’d been having personally as well as seeing over and over again in the WordPress.org support forums. It was great to have some expert feedback from like-minded WordPress folk. Once again, of course, thanks go to Emily and Ross for organising and chairing and of course the Dachis Group for hosting us. I’m already looking forward to the Sept ’12 event… what can I say, beer, WordPress and friendly geeks are excellent bed-fellows.
Last night I noticed that the Lanyrd event info that was meant to be listed in my blog sidebar was no longer working. I was, at the time, using the My Lanyrd Widget which was up to a time working well… but then I noticed it had just stopped working.
I had a quick browse on the Lanyrd site and noticed that had some official JS and code which could be used to display a badge on your site showing pretty much the same info as the above mentioned widget had been doing.
The plugin has settings for the maximum number of events to show as well as the format and of course the Lanyrd username of the info to use.
The plugin pulls the info from Lanyrd every time the page is loaded, which is obviously not ideal. I had toyed with the idea of using the ics feed which Lanyrd provides and then using transient storage inside WordPress to temporarily cache the data. I decided to not use this for the time as the route I’ve taken pulls only the data needed and also supports richer data. My view on this may change in time… we will just have to see how this performs.
This latest WordPress 1 Minute Wonder installation covers a couple of quick alternative steps that can be taken to dramatically increase your site performance… and yes I’ll be honest and say that actually to cover all 3 steps here it takes more like 10 minutes.
Using the PageSpeed tool (in Chrome) it was possible to see that I had several un-optimised images on my site. I processed these with the free optipng tool and instantly saw an increase in 6 PageSpeed points and 2 YSlow points. Not bad for something which anyone can do.
Step 2 – W3-Total-Cache Plugin
Now there is some stigma around having lots of plugins on your WordPress site and the detrimental affect it can have on performance… now whether you back this line of thought or not* sometimes plugins can really benefit your site in this context. Now please be sure to backup your DB (or entire site) before using any plugins which might modify you’re .htaccess and potentially other files in your installation.
For my investigation I installed the W3-Total-Cache plugin and configured it just to cache and minify my HTML, JS and CSS. The results were staggering… I saw an overall increase of 11 Google PageSpeeed points and 12 YSlow points
Step 3 – .htaccess Tweaks
Another step, this time plugin-free, should immediately give some good results. Simply by adding the following lines to one of my site’s .htaccess file I saw a further 4 point increase in my PageSpeed score and a 1 point increase in Yahoo’s YSLow rating.
ExpiresByType image/gif A2592000
ExpiresByType image/png A2592000
ExpiresByType image/jpg A2592000
ExpiresByType image/jpeg A2592000
ExpiresByType image/ico A2592000
ExpiresByType text/css A2592000
This is defining a 1 month expiry for all content covered by the files types listed above. Note if you do this there’ll be implications if you want to modify any of the files, like CSS, and have the changes to affect immediately.
So in total by carrying out the above steps I saw the following performance increase. Of course the results will vary site by site but I believe that with Search Engines using site performance as a factor when ranking your site that 10 minutes spent here will be of value.
Google PageSpeed Increase = 21
Yahoo YSlow Increase = 15
[jbox color=”blue” vgradient=”#fdfeff|#bae3ff” title=”Found this useful?”]If you’ve used this technique on your site for performance reasons and have some results then please leave them in the comments.[/jbox]