Blog

Website Conversion: LiveEdit to WordPress CMS

Pilates studio website

Kristi Galante owns and operates a pilates and yoga studio in Gig Harbor. Her old website was powered by the LiveEdit Platform – a CMS that offers integration with many third party services, including MindBodyOnline, a popular studio service.

Challenges

When we opened the studio in October 2014, we anticipated high client interaction with the website (registration for classes, payments, etc.). We found that potential clients are attracted to the studio by the design of the website, but prefer to do most of their scheduling and transactions in person. LiveEdit offered integration with MindBody, but client logins were often problematic, and we saw little need to continue paying for the API at LiveEdit when the MindBody consumer mode works well for the small number of clients who continue to schedule and pay online. Plus, MindBody has continue development of their mobile app, and more clients are booking through their mobile devices.

From the beginning the template-based design at LiveEdit was cumbersome. Design elements were not flexible, and it was not easy to simply go in and change calls-to-action or pictures. Mobile responsiveness was not satisfactory, and we grew increasingly frustrated with LiveEdit’s technical support. The service was no longer worth the monthly fee, and we decided to upgrade our hosting plan with A2 to handle both of our websites.

The old site suffered from some performance problems. Overall page size was 1.3 Mb, below the 2016 industry median page size of 1.9 Mb, but well above Google’s recommended benchmark of 500 Kb. Additionally, performance testing via Google PageSpeed Insights, Pingdom, and WebPageTest showed the site loading in the bottom 65% tier of sites.

Performance Benchmarks New WordPress Site Old LiveEdit Site
Google Mobile Speed:  69 50
Google Desktop Speed  88 57
Pingdom  88
faster than 82% of tested sites
76
slower than 64% of tested sites
WebPageTest Speed Index  1,416 6,076
YSlow  80 69
Web Page Size 387 Kb 1.3 Mb
Web Server Requests  25 48

Average web page size in 2017 = ~2.1 Mb
WebPageTest median Speed Index = 4,493; top 10% = < 1,388

Contributing to the performance lag were images not optimized for the web, slow server response, and the lack of header expirations.

Now we have a design that is portable, flexible, easy to update, and cost-efficient to maintain.

Fostering Content Management for Clients Through Open Source Solutions

Ladies Musical Club website

Graphic Design: David Owen Hastings
WordPress Web Development: Scott Marlow

To celebrate its 125th anniversary, Ladies Musical Club of Seattle worked with us to redesign their static ‘fixed width’ website into a mobile responsive Content Management System (powered by WordPress – the most popular open source CMS in the world).

The new site features rich, custom photography and videography; and a public concert event calendar. Volunteers can now add and edit content, including events.

So exciting! A huge thanks to you and David for the beautiful layout, design, your knowledge and patience while guiding us through! … There is more work ahead, more to learn, but let’s take a big breath and delight in this huge milestone!  Wow, just wow!
Claudia McCormick-Kester, Vice President of Communications

The new site also loads among the top 10% of tested sites.

More site features are planned for the future.

Attending OrcaCon 2019: An Inclusive Tabletop Games Convention

This weekend, I joined hundreds of gaming enthusiasts at the 4th annual OrcaCon tabletop games convention in Bellevue, Washington.

The convention features industry panels, game demonstrations, an open play library, game tournaments, and gaming workshops. I spent most of the 2 days at demo tables and the open play library.

My 5 favorite game titles included:

  1. Clank! (deck building strategy game)
  2. Forbidden Island (cooperative family game)
  3. Rivals for Catan (2-player strategy card game)
  4. Salem 1692 (party game)
  5. Word Slam (party game)

Wizards of the Coast distributed free starter packs for Magic: The Gathering, so I experienced this 1993 classic for the first time. And I won a raffle prize of the 2018-released Between Two Castles of Mad King Ludwig, a tile-building game for up to 7 players that I look forward to play-testing with my game group.

The event organizers did an excellent job of making the venue inclusive for everyone. The event was ADA-accessible, with LGBTQ+ pronoun-friendly name badges, and even color-coded safety pins to identify attendees’ introversion to extroversion levels. Maybe next year, the event website will be upgraded to be mobile-friendly too!

New Year’s Web Resolutions

It’s January. Time to review last year’s progress and set some marketing goals. Here are 5 ways to kick start your online marketing in the New Year.

  1. Analytics
    Review your year-to-date Google Analytics; compare results to previous years. In particular, pay attention to unique vs. repeat visitors, most popular pages, bounce rates, referral URLs, and most popular search engine queries (via Google Search Console).
  2. Budgeting
    Review your marketing budget (often 8-15% of revenue, dependent on industry) and expenses. Identify new marketing opportunities. Measure AdWords and any other online advertising performance; make adjustments as needed.
  3. Competitive Research
    Identify your current competitors. Is your site still relevant in its field? Are you keeping up with industry trends?
  4. Security
    Confirm User Roles are still valid and that there are less than 3-4 site Administrators.
    Remove backup and other vulnerable files from your hosting server.
    Confirm your web hosting plan operates under the fastest, most secure version of PHP 7.2 recommended by WordPress.
    Note: many sites still run under PHP 5.6, which may no longer receive critical security updates after January 2019.
  5. Usability
    Routinely test the usability of your site. Ask for feedback on your site’s general first impression (e.g. the ‘5 second homepage test’). Is your site still credible? Can visitors find the information they are looking for? Are visitor expectations being met?

WordPress 5.0 is a big deal!

Why? Because it includes a new interface for writing and editing your Posts and Pages. After more than two years of development, this new “block editor” (codenamed “Gutenberg”) is now available when you upgrade to WordPress 5.0.

So you can picture these changes, take 5 minutes now to experiment with this demo version or watch this introductory video:

1. Upgrade Now. (But Turn off the Editor.)

Keeping WordPress up-to-date is a crucial habit for maintaining a healthy site. Upgrading to WordPress 5.0 is just as important as any other update for the new security patches and bug fixes.

Luckily, you can choose to update WordPress but continuing using the old editor with the Classic Editor plugin. (After installing, be sure to go to Settings > Writing and disable the Block Editor for all users.) If you have an existing site with lots of content, I would recommend you use this plugin until WordPress 5.1 is released before considering the new editor. Many plugins and themes are still working toward full support, and a bit more time will likely make your transition smoother.

Even with the Classic Editor, it’s worth being cautious about this update, so consider doing a full round of testing to understand how your site works with the new editor before doing this.

Once you’re ready to try out the new editor, it’s time to…

2. Develop Your Block X-Ray Vision

In the new WordPress editor, everything is a “block.”

Paragraph? That’s a block. List? A block. Quote? Also a block? Columns!? Blocks in blocks!

When you’re working on a blog post or page, you’ll do well do think in blocks. Based on the stated future plans for WordPress, blocks will only get more important in the coming years.

Wordpress 50 block vision
Learn to see the blocks that your page is built of.

3. Customize the Editor to Your Liking

Buried in the top-right corner, the three-vertical-dots button hides three critical options to make the editor more friendly for writing:

  • “Top Toolbar”
  • “Spotlight Mode”
  • “Fullscreen Mode”

I’ll admit, I’m preferential to just the first of the three, but you should try out and explore all three. This article from WP Tavern walks you through these options in more detail.

4. You Don’t Have to Go All In

There’s nothing wrong with only dipping a toe into the editor at first. Luckily, our friend “Classic Editor” makes this easy to do! Beyond the ability to disable the new block editor completely, you can also provide editors the option to choose which editor to use.

Once you’ve tested your site (see #1) and know there are no major issues, consider using the block editor for new blog posts and pages, while still using the classic editor for day-to-day content maintenance.

One final “half-way in” option is to use the new block editor but only with a single “Classic” block. What’s the Classic Block? More or less, it’s a way to use the old editor inside the new one. When creating a new post, instead of creating a paragraph, add a “Classic” block and then do all your work in it. The Classic block is a perfect way to start using just a few blocks at a time. For instance, you could have two classic blocks sandwiching the new Gallery block and a button block.

5. Master the “Slash Inserter” Shortcut

As you try out the block editor, this is the first “power user” tip to know.

The normal way to add a new block is to click one of two “+” buttons in the interface and then select the block you want. (Again, go try out the editor demo right now to see what this means in practice.)

But what could easily be 4 clicks and a distraction only requires a few keystrokes! When you want to quickly add a new block, here’s what to do:

  1. Put your cursor in an empty paragraph block
  2. Type /
  3. Now continue typing the name of the block. For instance, “/gall” for “Gallery” or “/but” for “Button”
  4. When the block you want is highlighted, hit RETURN and your new block is ready to go!

We’re all still learning about WordPress 5.0 and the best way to use its new features! There will almost surely be hiccups along the way, but you can start learning about, trying out, and starting to use the new block editor on your website today!

About the author & Nonprofit WP

Mark Root-Wiley builds websites for nonprofits in Seattle, WA. He created Nonprofit WP to be the go-to resource for nonprofits building and maintaining their own WordPress websites. Check out NonprofitWP.org for tips on planning websites, recommended themes & plugins, blogging best practices, and more!

5 Places to Find Free WordPress Support

So, you’re thinking of launching your own WordPress website? Or maybe you have an existing WordPress site and you need help. Here are 5 WordPress support resources:

  1. WordPress.org
    Well, duh. Go straight to the source – get answers from Automattic and other open source contributors.
  2. WordPress.tv
    Are you a visual learner? Browse thousands of videos on beginner to advanced topics.
  3. WordPress Meetups
    Join over .5 million members who belong to 1,459 local Meetups. Find WordPress Meetups in your area.
  4. WordPress For Dummies
    Lisa Sabin-Wilson’s 8th edition since 2007. For WordPress Authors to Administrators, you can read chapters related to CMS topics that interest you.
  5. Friends and Neighbors
    Powering 32% of all websites, you may find helpful resources right around your corner!

Limitations

If your website is hosted on WordPress.com or you purchased a third-party commercial Theme, some support resources may not apply to you.