Tag Archives: themes

July 2014 Slides: Drag-and-Drop Themes Part 2: Make, Ultimatum, Headway

Things change rapidly in the WordPress world. The content in this post is more than a year old and may no longer represent best practices.

Our first foray into drag-and-drop themes, in August 2013, looked at CyberChimps, PageLines, SiteOrigin, iThemes Builder, and Themify. This time around, we examined four new themes and two plugins.

This session’s themes were Elegant ThemesDivi, Make from Theme Foundry, Ultimatum, and Headway. The plugins are Pixgridder Pro (bundled with Shortcodelic on CodeCanyon for $20) and Visual Composer ($25 for a single site license on CodeCanyon). The plugins can be used with (almost) any theme to give you the option of adding blocks to individual pages, but they don’t create an overall theme design (header, footer, sidebar).

I tested three themes and found Make the quickest to get started with and the most intuitive, as many of the style options are integrated with the WordPress customizer. The free version allows you three sections per page and four types of sections, but that actually gives you quite a bit of versatility. The pro version lets you add widget areas to a page, use Typekit fonts, and include e-commerce layouts for WooCommerce and Easy Digital Downloads.

Ultimatum is a theme builder, not a site builder. When you start, you have nothing. You chose a base template–in this case, Bootstrap responsive–and create a default layout, building up the elements of your header, footer, and sidebars.

Although nearly anything is possible, and you can create an infinite number of layouts and apply them to whichever pages, posts, categories, custom post types, etc., you want, Ultimatum is not at all intuitive–you won’t get anywhere without the documentation. (The docs are fairly extensive, at least.) If you’re willing to stick it out through the learning curve, you could do a lot; for that much work, I’ll stick with Genesis. A visual theme builder should make my life easier.

I’d heard about Headway for years but not tried it. This is the most drag-and-drop of the site builder/theme builder tools I’ve tried so far, because you actually draw elements on a grid. (You can specify whether the grid should be automatically responsive or you want to create wrappers at different sizes.)

It’s like wireframing and building your site at the same time. The “blocks” that Headway uses are built up of the normal elements of WordPress content, so it helps to have some content to work with. I imported content from a site that needs redesigning; you could import sample content and do as well.

Though you will want to read the “before you start” file and take the tour of the Headway Visual Editor, it’s pretty easy to navigate and get a basic first layout created and styled. Refinements will probably take longer. I can see why some people prefer this for client work, especially if they come from design backgrounds.

None of the three had quite the glitz factor of Divi, which Pieter Hartsook demonstrated. The modules for building pages in Divi are similar to those in Ultimatum, but there are more of them built in, and the fancy slider effects are also built in, without needing added plugins. (All of that stuff gets stored in the post table as shortcodes.)

The really nice thing for the total beginner, though, is the number of pre-made layouts: if you want to start with a template for a portfolio site, or a company site, or a store, just select that layout. Seems like a  great way to get a site set up in a hurry if you have a low-budget job or a friend in need and they don’t need a super-custom design.

May 2014 Meetup Notes: Hosting, Updates, SEO, Authorship, and More

Things change rapidly in the WordPress world. The content in this post is more than a year old and may no longer represent best practices.

Here are some notes from the Q&A session of the May 2014 East Bay WordPress Meetup, and also a few from the presentations on Google Webmaster Tools and the WordPress SEO by Yoast plugin.

Go Daddy WordPress Hosting

For years, no one–including Pieter Hartsook–has had a good word to say about Go Daddy when it comes to WordPress hosting. But Go Daddy recently introduced managed WordPress hosting, and it actually works. (Pieter tested it, and unlike Go Daddy’s regular hosting, it’s fast.) What’s more, right now it’s on sale for $1/month.

No one at Go Daddy knows how long the sale will last, so if you’re interested in trying it out, you should probably head over there now. And yes, if by some mischance you have Go Daddy’s ordinary shared hosting, you can switch to this new service. Since you could hardly do worse than the regular shared hosting at Go Daddy (unless you were moving to 1 and 1), you should definitely move any WordPress accounts you have on Go Daddy over to the new Managed WordPress hosting service.

Atahualpa Update Issues

Diana Thompson has a strange issue with WordPress and Atahualpa. She just took over a client project with an outdated version of both WordPress and Atahualpa. She’s duplicated the site locally (same WP version, same theme version, same plugins, same content), but for some reason gets “You do not have permission to access this page” errors when trying to edit posts and pages.

Suggestions included checking to see that the PHP and MySQL versions were the same on both the local and live installations (since it is possible to edit posts and pages in the live install), but, since the local installation is expendable, to just see what happens after upgrading both WordPress and Atahualpa.

Video Embeds Aren’t Working

Lisa Bigeleisen has a client for whom YouTube embeds fail to work, either when using oEmbeds or when copying the embed code. Though the site is still running WordPress 3.6, YouTube oEmbeds have been part of WordPress for several versions now, and ought to work.

The consensus in the group was that something–either a plugin or something in the theme’s functions.php file–was causing a conflict with the native embed function of WordPress. (I have seen this happen before. Sometimes using the shortcode helps, and sometimes it doesn’t.)

Italics Not Working

Anthony Bello has a site where italics are not showing up in posts, even when the <em> tag showed up in the HTML editor. Everyone suspected there was an issue with the CSS, and so Pieter Hartsook’s inspection of the theme’s stylesheet after the meetup proved.

Ultimate Tiny MCE Breaks in 3.9

Bob Hemstock complained that Ultimate TinyMCE, a plugin he relied on, no longer worked in WordPress 3.9. He had especially relied on it for inserting tables.

Pieter Hartsook explained that if you wanted to regain the functionality provided by Ultimate TinyMCE, you should install the WP Edit plugin instead. WP Edit will import your settings from Ultimate TinyMCE.

How to Search Anonymously

If you don’t want to see local search results, or other results that are tailored to what Google knows about you, go to megaproxy.com, click the “try it free” button, and enter “www.google.com” in the URL box.

If you are going to need this service often (e.g. to check SEO for clients), you might want to get a paid account.

Keeping Up with the Changing SEO Landscape

What worked yesterday may not work today. How do you find out what search engine optimization techniques are going to be successful?

How to Ask Google to Re-Index Your Site

We mentioned that doing this was possible with Google Webmaster Tools, but not specifically how. The section of Webmaster Tools that you want is “Fetch as Google,” in the “Crawl” section.

To submit your entire site for indexing, leave the URL box blank. Once the home page has been fetched, click the submit button and check the radio button that says “URL and all linked pages.”

instructions to fetch site as Google

Google Authorship with Yoast SEO

There are instructions in the Webmaster Tools slides about how to use All in One Webmaster to verify Google Authorship, but you can also use WordPress SEO by Yoast to do this. I found a nice tutorial on it this morning.

March 2014 Notes: One-Page Themes

Things change rapidly in the WordPress world. The content in this post is more than a year old and may no longer represent best practices.

Q & A

This time is open for people to ask questions about any aspect of WordPress that they’re having difficulties with, or share recent discoveries.

iThemes Builder/Drag-and-Drop Page Layout/Theme Frameworks

Pixgridder output

Amy Lenzo, the resident expert in iThemes Builder, explained that while you can use the click-and-add functions of the layout editor to order elements vertically, and the style manager to control CSS, you can’t arrange elements horizontally on a page using a drag-and-drop interface. Pieter Hartsook recommended the Pixgridder plugin (free or pro) for creating in-page content and arranging it in rows and columns.

This also brought us back to the question “What’s a Theme Framework?” WP Beginner has a pretty good article on this subject, which addresses the pros and cons of using frameworks for theme development. (And like many members of the East Bay WordPress Meetup, they favor the Genesis Theme Framework from StudioPress, though they recommend Headway for beginners.)

Accessibility

WebAIM Logo

One of the new members asked about accessibility and mobile bandwidth issues. While most WordPress themes these days are responsive, many are image-heavy, and not everyone takes time to size images before uploading them. (There’s no point in making your full-size images larger than the width of your desktop content area, which in most cases isn’t more than 1200 px. Resize those 10-megapixel photos with Lightroom before you upload them.) It’s also helpful to use a Content Delivery Network for your your images, the most basic of these being Jetpack’s Photon.

Accessibility for screen readers or those who have visual disabilities is a complex issue. Some types of businesses (e.g. hospitals) are required to maintain websites that meet certain accessibility standards under Section 508, and if you are building for such a client, you need to be aware of them. Visit WebAIM for a checklist of HTML and script guidelines. ALT tags on images are just the beginning.

WordPress.org does have an Accessibility Team, and you can join it if you want to help make WordPress more accessible.

Business Directories

Connections Plugin Logo

There are not really any truly satisfactory business directory plugins out there of a kind that allow members to maintain their own entries, but if you want to maintain a fairly simple, Rolodex-like business directory on a site, you can take a look at the Connections plugin (free with some paid add-ons available).

Sallie’s company recently built a custom member profile add-on for the BAIPA site, tied in with S2 Member, that allows members to edit their own profiles (a custom post type) after they have paid for membership and contains custom profile fields relevant to the organization, but because it was customized for the client, it wouldn’t be suitable for wider distribution without further development, and is best suited to be customized for different specific uses. (But if you have a client organization with a budget that needs such a thing, come talk to us.)

One-Page Themes

Someone asked about building single-page sites in WordPress. This occasioned a need for further clarification: one page as in literally one page, e.g. a “squeeze” page or “coming soon” page, or a one-page site as in the modern trend for infinite scroll? Though you can construct a basic “coming soon” or “squeeze” page in plain HTML more quickly (assuming you know HTML), if you are planning to create a WordPress site later, you might wish to start as you mean to go on, and just put the squeeze page up in front of the real site that you’re building. And if what you want is a scrolling portfolio page that’s pulling your blog posts, etc. in from your database, that’s possible in WordPress, too.

Landing/Squeeze/Coming Soon Pages

Ultimate Coming Soon Page plugin screenshot

  •  Just Landed WordPress Landing Page–$55 from Themeforest. The usual six gazillion theme options you expect on anything from Themeforest, plus mailing list and e-commerce integration. Responsive.
  • Ultimate Coming Soon Page–free plugin from WordPress Repository; pro version from SeedProd $29 personal, $49 developer. Works with any theme. Visible only to non-logged-in users. Pro version integrates with mailing list providers for email capture and Gravity Forms for capturing any other info.
  • Easy Maintenance Mode–free plugin from WordPress Repository. Use as a coming soon page or while performing maintenance. Visible only to non-logged-in users.
  • WordPress Landing Pages–free plugin from WordPress Repository. Haven’t tried it.

But whatever you do, don’t use the monstrosity known as Authority Pro.

One-page Themes

Arcade Theme Screenshot

More Lists of One-Page Themes for WordPress

Inclusion of these lists is not meant as endorsement of these themes. They are other people’s choices and you should check them in the usual fashion before using them. If they’re in the WordPress Theme Repository, they have passed basic tests for security and met (very) minimal standards. If they come from a reputable theme shop, like Elegant Themes, Graph Paper Press, or StudioPress, you can trust them. (And I haven’t found glaring problems with Themify, though the builder engine is a bit of a resource hog.) Themeforest is a crap shoot: some authors are good, some are not. See how they are handling support calls and whether you find any complaints about them if you search Google.

Also note that many links in these articles are affiliate links.

April 2013 Slides: Building a Responsive Theme

Things change rapidly in the WordPress world. The content in this post is more than a year old and may no longer represent best practices.

You can download my presentation and the Albedo Wireframes from the April 2013 meetup.

Download the PDF file .

WordPress Responsive Themes.key
Slides from the presentation.
Responsive Theme Wireframes – Albedo
Wireframes showing how the Albedo theme changes based on the screen width.

April 2012 Meetup Notes: Configurable WordPress Themes

Things change rapidly in the WordPress world. The content in this post is more than a year old and may no longer represent best practices.

General Q&A

Q: When do you set up W3 Total Cache?

A: After you have finished setting up your site. Note that correctly configuring Total Cache can take an hour per site. Super Cache and Quick Cache are easier to use but not quite as sophisticated.

To find out what’s slowing down your site:

Plugin Performance Profiler

YSlow

Suffusion Theme Demo by Eve Lurie

See Eve’s slides for more details.

Visit Eve’s site.

Some points mentioned in the  demo:

Suffusion Markup and Hook Reference

Out of the box it looks gray and boring, but boy are there a lot of settings, and you can export your options, which is handy when you are migrating sites.

There’s a sidebar layout diagram; Eve recommends printing it out and referring back to it. There’s also a custom layout option using widgets (similar to StudioPress home pages).

You can hide and show headers and sidebars on a per-page basis. There’s a featured slider option for the header.

Google Fonts are built in.

Suffusion now has child theme support, and the developer has a child theme pack, which is also free

Weaver II Theme Demo by Pieter Hartsook

Weaver Theme Demo List post on the Hartsook Letter

10 Reasons to Switch to Weaver

Some points mentioned in the demo:

Weaver started as a child theme of Twenty Ten and became its own theme. There’s only one developer, who actively supports and updates the theme.

Two-column layout with widget.
Special video embed shortcode to style your YouTube videos to match the theme.
Per post styling features that also show up in excerpts.
You can insert custom widget areas wherever you want with Advanced Options.

There’s an active support forum to which Pieter contributes sometimes; the  developer responds to questions promptly.

18 pages of documentation

Slider Options for header, etc (including one with a menu; that will also go into the sidebar) using Meteor Slides. You  can set per-post header images.

The developer license is a one-time $50 fee

There’s a font CSS statement builder interface

There’s a long list of per-page options, including “allow raw HTML” for using iframes and other tricky code that WordPress sometimes messes with.

Weaver is responsive even when not in mobile mode. There’s a mobile emulator for smartphone, small tablet, large tablet. The menu converts to drop down in the mobile emulator.

 PageLines Demo by Kyle Stewart

PageLines Free in WordPress Theme Repository

Info about PageLines Framework

Developer license is $397, but if you contact Kyle he’ll provide a discount code for those who were at the Meetup. (Ask Sallie if you didn’t get his e-mail address.)

PageLines tagline: Drag & Drop Done Right

PageLines is “a design framework built on a development ecosystem.” They take the granularity out of the options–the small tweaks are left in CSS. The best way to do small tweaks to a site is through CSS. Their aim is to provide easy ways to update the way content appears on the site. You can drag to resize sidebars. So far only two sidebars are supported.

Yes, PageLines is responsive.

Sliders are AJAX. PageLines supports jQuery.

They’ve made color controls simpler and integrated LESS CSS.

Supersizing images (to use as page background) can be an issue in terms of mobile bandwidth–the display will look okay, but the load time might be a problem.

You can set up per-page backgrounds.

Takes design time down to 2-5 hours from 15-20. Of course, the CSS still takes up quite a bit of time; the idea is to speed up the first 90% of site design.

PageLines supports widgets and shortcodes. They have not taken away any core WP functions.

There’s a PageLines store which sells add-on sections, child themes, and plugins.