WordPress Toronto North – Let’s Fix Your Site #9

This past Monday we held another “Let’s Fix Your Site” clinic at our North York meetup. The meetup is held on the 3rd Monday afternoon of every month at the North York Civic Centre. The exact time and room is announced on our Meetup page 3 weeks prior as per City scheduling requirements.

I lost count as several people came in after the meetup began, but we were pretty close to 20 people. Dan started with a lightning talk at the beginning designed to give the room some tips and tricks on a variety of topics. This month we chose Videos and Getty Images and Dan showed us how to embed YouTube videos and remove the “next video tiles” when your video finishes. Spoiler alert: &rel=0 at the end of the YouTube URL but you must have Jetpack installed. More details can be found in Dan’s slide deck here.  As for Getty Images, this is a very high quality FREE image bank but the images have restrictions in how they get posted on your site (they require their own plugin). Click here for Dan’s slide deck for more information on how to access and use Getty Images.

We talked about Gutenberg, the long-awaited new editor for WordPress and our experts agree that this upgrade, to be released with other upgrades in Version 5.0, will be the biggest revolution in WordPress since its inception 15 years ago. We really have no way to know how Gutenberg will interact with any of the existing themes and page builders so excitement is building for a Fall release.  *I just checked and the beta Gutenberg plugin was released 2 weeks ago at WordCamp Europe and WordPress.org is asking people to download it, try it and give their feedback in order to crowd-source the testing and work out the kinks. They have a demo online you can try out.  

We started our Let’s Fix Your Site clinic by referring to our Meetup page because we ask attendees to post their problem ahead of time in order to get priority for their issue in the meeting. Robert had a question about working on his site offline because he’d like to take advantage of his flight times and get some work done. The issue is that WordPress was not made to be used offline and there are many workarounds that people have developed, heard of and tried but after analysis, most of those tools and methods were to enable developers to work on the code offline not site content.  It was concluded that the appropriate way to change or add content offline is to develop it on a word processing program like Microsoft Word and then cut and paste in your work when you are back online. Apparently the current WordPress editor makes a mess of cutting and pasting from text documents, but Gutenberg supposedly will address this issue.

Amanta joined us to figure out why the site she built for her client looks so bad on Internet Explorer, the browser her client uses. In order to try to remedy the issue, Amanta had to drastically reduce the size of her images, rendering them grainy on Chrome. This brought about a discussion on browsers and compatibility.  

Firstly it was debunked that the browser is somehow to blame. Browsers are in competition with each other and so they add functionality and release it to the marketplace at different times and with browser-specific code. This is similar to how car manufacturers make cars that use the same chassis but each uses their own parts and incorporate features unique to that manufacturer.  

Most browser compatibility issues reside in the theme.  Themes are just pieces of code that runs inside of WordPress, and this makes themes reliant on browser compatibility. Developers (that’s all of us!) should check that the theme you choose supports whatever browsers you want to be supported.  Developers charging for their work usually state explicitly in their contracts and support documentation the browser compatibility of their work. Dan offered up his terms as an example: His sites will work on the newest version of a set of popular browsers plus on one previous browser version. This limits the liability shouldered by the developer in dealing with clients who are using old browsers.

Amanta chose a child-theme of the Layers theme and therefore her incompatibility resides in that theme, not in her work, but she’s either stuck with the crappy image resolution in Chrome, has to test for Chrome, change to a compatible theme (a lot of work since she’s finished with the site) or find a fix. We encouraged her to get in touch with the theme author and see if a fix or workaround has been developed for her theme to be visible in Internet Explorer.  If it’s not the first time someone has brought this issue to the attention of the Layers Theme developers, they might have already developed a fix however if not, she is at the mercy of the Theme Authors as to when they’ll get around to a fix. Here’s a link to Layers’ online support for “Troubleshooting Common Browser Compatibility Issues”.

Browser Market Share Worldwide: Chrome – 55%; Safari – 14.76%; UC Browser – 7.99%; Firefox – 6.1%; Internet  Explorer – 3.88%; Opera – 3.8%

Click the link above to see the browser popularity charts (broken down by desktop vs. mobile vs. tablet. 

When we use themes and plugins, we are inheriting a lot of previously written code from mainly unknown sources and including it in our own development. Because of so many unknowns, we can never be sure of what issues may be hiding in the code. In many cases hosting providers have determined for their clients that there are poorly designed or insecure themes and plugins, and the hosts have banned them from their service (if these banned tools are found in anyone’s site, they are removed by the host). This is a safety measure taken by the hosts to prevent poorly written or non-supported code from providing a entry point for malicious attacks.  

Daniel came with Amanta and a friend and had a very technical question that we weren’t able to fully address at the Meetup:

Currently I am building a WordPress application using the bitnami WordPress stack and utilizing a purchased theme that has a lot of the functionality I need. My site works fine however, I am encountering a quite cumbersome bug that breaks my site when the page is hard refreshed or viewed on a mobile browser. It appears the issue is due to “jQuery.colorbox(…)” not being a function which is worrying as the site has a large dependance on jQuery.colorbox.

We hope that someone from WP Toronto will read this question and offer a suggestion to Daniel.

Mindy does hair and makeup and and her site is www.beautybliss.ca She requested a review of her homepage by the group and we obliged by offering our suggestions.  At the last meetup we had switched the page that presents 1st from Home to her Portfolio page.

She now has a defunct Home page that she was wondering what to do with.  The group suggested she take the content and add it to the Portfolio page and delete the Home page and then rename Portfolio to Home however Mindy had her site developed for her so she will either have to deal with the existing code or choose a new theme and start again. It was suggested that you draw out your site layout on paper before developing it online. Mindy has her initial architecture drawings so she will revisit them and see if her site still reflects her original vision.

Don’t worry Mindy, we’ll be here for you if you choose to start fresh! The best part of WordPress is that you own it all and you make all of the decisions about it. This complete responsibility for your site is why WPToronto (and the 272960 WordPress members across 605 Meetups in 90 countries!) gather to bring the best of the collected, crowd-sourced advice to users of this amazing, open-source technology.

For our final fix, we looked at Lothar’s site, featuring his artwork. He could not figure out why he had no Home page. This began the discussion of Posts versus Pages and how to have static pages for your website while also incorporating a blog (without your blog being featured on your homepage).  Because WordPress was built first and foremost as a blogging platform, most themes default to a blogging style layout with features that promote new blog posts to the 1st page of the site. Many of us prefer a more traditional feel for our sites so we set the Homepage to ‘static’ and incorporate blog posts on their own page. This is done in the Customizer under Homepage Settings where you’ll see this:

You can choose what’s displayed on the homepage of your site. It can be posts in reverse chronological order (classic blog), or a fixed/static page. To set a static homepage, you first need to create two Pages. One will become the homepage, and the other will be where your posts are displayed.

Your homepage displays:
 ⃝     Your latest posts

 ⃝     A static page

In Lothar’s case, because he had not yet published a page at all, the theme did not offer him the opportunity to even see this option. This is the reason that every WordPress site comes with two dummy pages. The trick is not to erase the two sample pages before you’ve created new ones or your theme may not be offering the option to set a static home page. Also note, if all of your pages are unpublished, WordPress will not allow you to set a home page.

We closed out with an artist’s rendition of our new signs that we hope to order ASAP. We are asking for a small donation from our attendees. If you are getting value from our effort in bringing you this monthly site clinic and especially if we saved you big bucks by solving your problem for free, please consider donating.  This month we collected zero dollars:-(

Val came at the wrong time (be advised that our hours often change month to month due to booking restrictions so check the Meetup page close to the actual date of the meeting). I know Val had a question about the option to add the sign in using your Facebook or Gmail feature for visitors to sign into your site. I just did a quick web search and linked the above phrases to Facebook Sign-in and Google Sign-in Developer instructions but I’m not sure if they’re the answer he was looking for. Remember Val to post your question on our upcoming Meetup’s page.

We’ll be tackling another round of your questions, issues and be providing fixes next month July 16. Hope to see you there.  Enjoy Summer!