posted on
categories wordpress

Manchester WordPress User Group March

Running in a bit late, I caught Mike opening up discussing upcoming WordPress events.

Manchester WordPress User Group

WordPress Events

WordPress Europe October https://2013.europe.wordcamp.org/

WordPress Sheffield http://wpsheffield.com/

A Manchester WordPress event is being planned for June and possibly there will be a contributor day the day after.

Also, more Contributor Days in Manchester may be on the way :)

In the meantime you can check out https://make.wordpress.org to help contribute.

If you're interested in contributing to the code, codeacademy is a great site to help you learn code and is worth checking out.

Mike Little

PHP Events

PHP North East https://phpne.org.uk/

PHP North West https://conference.phpnw.org.uk/phpnw14/

discuss.wpuk.org https://discuss.wpuk.org/2014/03/18/wpuk-unconference-2014-proposed-venue/

WordPress 3.9

WordPress 3.9 is now in Beta 1

It's possible to download and try this out now, some of the new features include more theme customisation options and a gallery preview in the edit view.

Theme Customise Widgets:

  • themes > customize - make changes and preview without going live, now it's possible to also preview widgets.

Gallery Previews:

  • These now show up in the editor so you have a better idea of how the gallery will look when published.

It's also possible to drag images directly into the editor, although this didn't seem to work when Mike demoed it, the joys of living life in Beta.

Media now supports video and audio playlists for HTML5 supported formats e.g. mp3, ogv, webm. Mike demoed this and looked great!

Philip Valentino On WordPress Optimisation

Philip Valentino

You can follow Philip on Twitter @philipvalentino.

Philip wearing a rather awesome t-shirt gave a great talk on WordPress Optimisation. It was a good overview for beginners and covered a wide range of topics. I'm sure if anyone didn't know much about optimisation, they'll now have plenty to be getting on with.

PDF download of Philip's slides are available here: https://mwug.info/2014/03/march-2014-meeting-notes/

Philip opens by giving a bad example of a current live site and shows how frustrating it can be especially on 3G waiting for a site to load.

Next up, a funny analogy relating cars to website speed.

We're lucky that today that there's lot of stats and research available regarding speed. For example how it can affect bounce rate.

In 2010 Google mentioned that speed will not only give your users a better experience but will help with rankings.

So many variables, from humans, applications (HAND - Humans Applications Networks Devices).

Crockford added that he used to think the browser was the most hostile programming environment ever devised, but then he found out about mobile programming.

Doug Crockford

https://mobilehtml5.org/

India Internet traffic by type desktop vs mobile

https://www.cnet.com/news/mobile-internet-traffic-gaining-fast-on-desktop-internet-traffic/

Mobile Email stats: https://www.emailmonday.com/mobile-email-usage-statistics

So… if more and more people are viewing on mobile, how can you make your site accessible?

One way is to use a responsive theme. If you're choosing a WordPress theme you can quickly preview your prospective theme with https://www.responsinator.com/ and get a quick overview of how it will behave at different viewport widths.

80-90% of the end-user response time is spent on the frontend. Start there.

Steve Souders

https://flippinawesome.org/2014/03/10/is-jquery-too-big-for-mobile/

https://httparchive.org/trends.php

Some handy sites for testing and getting stats regarding your site's performance.

PageSpeed Insights: https://developers.google.com/speed/pagespeed/insights/

Pingdom: https://www.pingdom.com/

Web Page Test: https://www.webpagetest.org/

Bandwidth: Downloading jQuery 2.1.0, or 28.56KB takes 229ms to download on the worst mobile networks (1Mbps). 46ms to download on average mobile networks (5Mbps). 19ms to download on awesome mobile networks (12Mbps).

Latency:

On average mobile networks take about 400 milliseconds before stuff starts arriving in your devices browser.

Further details: https://moz.com/blog/15-tips-to-speed-up-your-website

Some quick wins: Image optimisation - Image Optim / https://wordpress.org/plugins/wp-smushit/

Yoast WordPress SEO Plugin enables you to easily edit the .htaccess file via an input box, then you can add in what you require, such as enabling gzip and caching for example

Here's a handy link for more on the .htaccess file: https://davidwalsh.name/html5-boilerplate-htaccess

After you've done some optimisation, it's important to keep testing and measuring your performance increases and then look for more and keep going.

WordPress Plugin P3 Profiler can also help identify possible performance boosts.

Finally - examples of just how cheap mobile devices are becoming, and their potential to reach the remaining 5 billion people without them.

Mobile devices: https://www.pcadvisor.co.uk/reviews/mobile-phone/3504131/firefox-smartphone-hands-on-review/

Tablet devices: https://www.theglobeandmail.com/technology/canadian-makers-of-worlds-lowest-cost-tablet-aim-for-20-device/article17461367/

Google Analytics, look at what devices are hitting your site and write code accordingly, e.g. if you previously had code for IE8 and now no one is viewing your site with IE8, you can remove this code to help performance.

Mike WordPress Technical News

Back to some more WordPress 3.9 Beta 1 news.

https://wordpress.org/news/

"The load process in multisite got rewritten. If you notice any issues with your network, see #27003."

"We now use the MySQL Improved (mysqli) database extension"

"Library updates, in particular Backbone 1.1 and Underscore 1.6 (#26799). Also Masonry 3 (#25351), PHPMailer (#25560), Plupload (#25663), and TinyMCE (#24067)."

TinyMCE has had a major update and is now in version 4.0. There's an upgrade guide over at https://www.tinymce.com/wiki.php/Tutorial:Migration_guide_from_3.x.

Tom J Nowell On Setting Up Vagrant

Tom J Nowell

You can follow Tom on Twitter @Tarendai.

Next up is Tom talking about how to get started with Vagrant and some of the benefits it brings.

Tom's slides are available here: https://mwug.info/2014/03/march-2014-meeting-notes/

Tom goes over some of the various ways he's previously updated a site.

  1. Working live on the server. (eeeek, nooo!!)

  2. Working in Dreamweaver which would then FTP the code to the server.

  3. Then Lamp, Mamp, Xampp setting up Apache and MySQL locally mimicking the live server, then manually FTPing or taking it a step further and using ssh.

Using Lamp, Mamp, Xampp can however cause issues. For example if you're on Mac using OS X and you're then going to work with someone who is using a Windows machine there's potentially going to be discrepancies. Also if someone doesn't already a development environment set up, it can take a while to get set up and passing large VB disk images around.

Enter Vagrant.

Setup Vagrant

Vagrant

https://www.vagrantup.com/

  1. Install Virtual Box
  1. Download / Install Vagrant
  1. Run the following terminal commands:

$ vagrant plugin install vagrant-hostsupdater (for sorting out your hosts file)

$ vagrant plugin install vagrant-vbguest

  1. Grab VVV - Varying Vagrant Vagrants https://github.com/Varying-Vagrant-Vagrants/VVV

I added this to /Applications/Vagrant, but I'm not sure if there's a place where it should live.

1
git clone [email protected]:Varying-Vagrant-Vagrants/VVV.git

VVV is now your web environment.

  1. Go to the VVV (should this be www???) folder in the terminal:
1
cd /Applications/Vagrant/VVV-master/www

Then run:

1
$ vagrant up --provision

You should now have a server starting up for the first time:

1
2
3
4
5
6
7
8
9
10
$ cd /Applications/Vagrant/VVV-master
/Applications/Vagrant/VVV-master
$ vagrant up --provision
Bringing machine 'default' up with 'virtualbox' provider...
==> default: Box 'precise32' could not be found. Attempting to find and install...
    default: Box Provider: virtualbox
    default: Box Version: >= 0
==> default: Adding box 'precise32' (v0) for provider: virtualbox
    default: Downloading: https://files.vagrantup.com/precise32.box
    default: Progress: 9% (Rate: 475k/s, Estimated time remaining: 0:09:22)
  1. Some useful Terminal commands:

vagrant up vagrant halt vagrant destroy vagrant ssh vagrant status

  1. Now you should be able to open up a browser and access:
1
https://vvv/

This should bring up a screen showing you what vagrant goodies you have installed.

1
2
3
4
5
6
7
8
9
10
11
Home
Repository
phpMyAdmin
phpMemcachedAdmin
Opcache Status
Webgrind
PHP Info
https://local.wordpress.dev for WordPress stable (/www/wordpress-default)
https://local.wordpress-trunk.dev for WordPress trunk (/www/wordpress-trunk)
https://src.wordpress-develop.dev for trunk WordPress development files (/www/wordpress-developer/src)
https://build.wordpress-develop.dev for a Grunt build of those development files (/www/wordpress-developer/build)
  1. To set up a new site

Add a folder in WWW folder.

Add a vvv-nginx.conf file (https://github.com/Varying-Vagrant-Vagrants/VVV/blob/master/config/nginx-config/sites/local-nginx-example.conf-sample).

Add a vvv-hosts file with your hosts

1
2
tomjn.com
www.tomjn.com

(you can also update your permissions so you don't have to keep adding your password)

  1. After you've done that
1
2
vagrant halt
vagrant up --provision

[I added a vvv-hosts and nginx.conf file in a subfolder, but after restarting https://test.dev went to https://vvv/]

  1. What about sites that already in Mamp / Xampp?
1
vvv-init.sh

This file gets ran when vagrant provisions itself.

Lives with vvv-nginx.conf and vvv-hosts.

(p.s. nginx is pronounced Engine X - https://nginx.org/en/)

An example vvv-init.sh may contain things such as:

1
2
3
wp core download
wp core install --url="etc...
wp plugin install wpseo

Errors!

Oh noes… I got an error

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$ vagrant up --provision
Bringing machine 'default' up with 'virtualbox' provider...
==> default: Clearing any previously set network interfaces...
There was an error while executing `VBoxManage`, a CLI used by Vagrant
for controlling VirtualBox. The command and stderr is shown below.

Command: ["hostonlyif", "create"]

Stderr: 0%...
Progress state: NS_ERROR_FAILURE
VBoxManage: error: Failed to create the host-only adapter
VBoxManage: error: VBoxNetAdpCtl: Error while adding new interface: failed to open /dev/vboxnetctl: No such file or directory

VBoxManage: error: Details: code NS_ERROR_FAILURE (0x80004005), component HostNetworkInterface, interface IHostNetworkInterface
VBoxManage: error: Context: "int handleCreate(HandlerArg*, int, int*)" at line 68 of file VBoxManageHostonly.cpp

Fortunately I found an easy fix running the following command.

1
$ sudo /Library/StartupItems/VirtualBox/VirtualBox restart

And I'm now all up and running and looking forward to seeing what I can do with it.

After the meetup I also spoke to Jenny who mentioned a stylesheet analysis tool that looks interesting:

https://github.com/katiefenn/parker

EdgeConf

This weekend I've just got back from @edgeconf more on that soon :smile:

Browse by category: