Origin 2.0 – Where Great WordPress Themes Begin

Origin is our WordPress starter theme. It’s the framework we use to develop new WordPress themes. Additionally, it’s the perfect foundation for any web designer to begin developing a WordPress website. As a result, it’s our most consistently updated theme.

Origin WordPress Starter Theme

When a new feature is available for WordPress, the Origin Theme is the first to get it. As a theme partner of WordPress.com, Origin is continually updated to meet their rigorous code standards. There is no higher standard for a WordPress theme.

Origin strikes the perfect balance of design and functionality for a WordPress starter theme. The code is thoroughly commented. It uses simple and clear naming conventions. As a result, even novice web developers can easily customize the theme. All options are located within the WordPress customizer, making it a great foundation for extending the capabilities of the customizer. Additionally, third-party scripts are kept to a minimum in order to reduce the potential for conflicts. No code within the theme has been minimized or obfuscated.

In preparation for Gutenberg and the release of WordPress 5.0, Origin has undergone several significant updates. We have combed through every line of code, inspected every style, and made improvements anywhere there was an opportunity.

Gutenberg Support for Blocks

As Gutenberg evolves, we have been continually using, experimenting, and developing custom blocks for the new content editor. As a result, we have added functions and styles to optimize the display of blocks within the Origin Theme.

For instance, we have added the wide alignment function for blocks:

/*
* Enable support for wide alignment class for Gutenberg blocks.
*/
add_theme_support( 'align-wide' );

This code can be added to your theme functions.php file, and provides the option for full width blocks. Full width blocks are useful if you intend to use Gutenberg as a WordPress page builder.

Additionally, several styles have been added to the theme for the display of Gutenberg blocks.

Organic Customizer Widgets

Organic Customizer Widgets is a simple WordPress page builder. It’s a free plugin that provides a variety of custom widgets for use within the WordPress customizer to create dynamic pages. Using the plugin, you can easily add page sections to display content slideshows, client testimonials, pricing tables, team member profiles, and much more!

We have added new theme styles and scripts to ensure the customizer widgets work beautifully within the the Origin Theme. Additionally, we have added each widget to the theme demo.

Origin Theme Customizer Widgets
The Organic Hero Widget within the WordPress Customizer.

For more information on using the Organic Customizer Widgets, please refer to the documentation available here.

Logo Resizer

WordPress Theme Logo Resizer

Historically, resizing a logo for your website within WordPress has been a crude process. It involved adding custom CSS, and making additional changes to ensure that your logo displayed consistently across different browsers, resolutions and mobile devices. The new logo resizer solves those problems.

Now, changing the size of your logo within the WordPress customizer is simple. Using the sliding scale, drag the range option to watch your logo scale in real-time.

Responsive Framework Simplification

Our themes have long used a customized responsive grid based off the Foundation framework.

With the latest update to the Origin Theme, we re-evaluated that grid. While the core code stayed the same, we removed several styles that were unnecessary. The result is a minimal responsive framework that is simple to understand, modify and expand upon.

WooCommerce Integration Overhaul

Perhaps the biggest update to the Origin Theme is the vastly improved WooCommerce integration.

WordPress Theme WooCommerce Integration
The WooCommerce shop page within the Origin Theme demo.

Since Automattic acquired WooCommerce in 2015, the most popular e-commerce solution for WordPress has undergone significant updates. WooCommerce has been undergoing these rigorous changes in preparation for its debut on WordPress.com. The result will provide WordPress.com users with the ability to create online stores for the first time. We have been working closely with Automattic to prepare our WordPress.com themes for the release of WooCommerce on their platform. Meanwhile, we have been implementing those updates into the Origin Theme.

The Origin Theme integrates WooCommerce seamlessly as reviewed by the developers of the plugin. As a result, it’s a model example of how WooCommerce should be integrated into self-hosted WordPress themes.

One Click Demo Integration

With the latest Origin Theme update we decided to tackle the issue of demo content installation.

Setting up a WordPress theme to appear exactly as the demo has long been a pain point for users and developers alike. Simply importing an XML content file only partially gets the job done. You will still be left with setting up general WordPress settings, theme options, custom menus, widgets, and more.

The One Click Demo Import plugin is widely recognized as the best solution to resolve this problem. In addition to importing content, the plugin also imports WordPress settings, customizer options, and widgets.

One Click Demo Import Plugin

The plugin is absolutely perfect for our themes since we utilize the customizer for theme options, and the Organic Customizer Widgets plugin as a page builder. Adding support for One Click Demo Import was a no-brainer. As a result, it’s easier than ever to setup the Origin Theme exactly like the demo.

Font Pairing Option

Providing too many font options is risky business. Less design savvy users often find the urge to use the Papyrus font on their website irresistible.

In the past, we have limited font options within our themes in an attempt to mitigate the damage some fonts impose on the legibility and professionalism of a website. With the latest update to the Origin Theme, we have tried to find a happy medium.

WordPress Starter Theme Font Options
Select from hand-picked font pairings.

The new font pairing option provides users with the ability to choose from a list of hand-picked Google Font pairings for their website. The option displays a single heading font and a single body font. Each pairing has been picked for design and legibility. As a result, users will not be intimidated by an overwhelming number of available fonts, and each option is guaranteed to look great with the theme.

Accessibility Additions

An accessible WordPress theme allows people with disabilities to navigate and read your website more easily.

Making a theme accessible requires a number changes outlined within the accessibility development guidelines.

Despite web accessibility being highly encouraged by the WordPress foundation, less than 1% of themes are actually accessible. With the latest version of the Origin Theme, accessibility has been re-evaluated and vastly improved. We have implemented the following changes:

Accessible Sub Menus

Menus for the theme have been re-developed to use only CSS, and no javascript. Additionally, sub menus can now be accessed by keyboard tabbing.

Screen Reader Text

The screen reader text class has been applied where needed, so that text that is intended to be hidden from the screen is still accessible for screen readers.

Text Link Underlining

Previous theme versions used only color to differentiate text links. Since this can make it difficult for color blind users to identify links within the content, the theme now features underlined text links.

HTML5 Markup Improvements

The HTML5 markup for the theme has undergone several updates in an effort to improve accessibility. HTML tags have been updated as needed. Additionally, ARIA landmark roles have been applied to HTML elements to assist with identifying sections within the website.

The Origin Theme already had some accessibility features, such as alt and title attributes, contrasting text and images, and readability. However, we hope these latest updates will vastly improve the theme for disabled users.

Cutting The Fat

While there have been several additions to the Origin Theme updates, there have also been some subtractions.

As WordPress and the web evolves, some features, styles, and scripts become obsolete. In order to stay current, we make a continual effort to prune the Origin Theme of unnecessary code. As a result, the following features have been removed:

No More Portfolio and Testimonial Page Templates

With the upcoming release of Gutenberg, there is less of a need for several page templates. We kept the essential “Full Width” and “Landing” page templates. However, the “Portfolio” and “Testimonial” templates have been phased out of the Origin Theme.

No More Extra Sidebars

The theme now features only a single sidebar widget area in addition to the widget areas for the header and footer. We felt the extra sidebars were an unnecessary feature for a WordPress starter theme.

No More Jetpack Custom Post Types

Providing support for Jetpack custom post types (CPT’s) was a good idea in theory. However, it was an unnecessary and under utilized feature of the theme. As a result, we have removed support for the CPT’s within the latest version of the Origin Theme.

No More Starter Content

For new WordPress users, the first impression of installing and activating a WordPress theme is often anti-climactic. It’s a problem that WordPress and the developer community has been trying to solve for years. Often, after a new user views a beautiful theme demo, they are left utterly disappointed to discover that the content, images and settings from the demo ceased to exist upon the fresh installation of WordPress and a new theme.

Starter content was an attempt to resolve this problem. However, the solution was never fully realized and took hold. So, we removed the starter content functions in favor of supporting the One Click Demo Import plugin.

Try Origin As Your WordPress Starter Theme

Origin is a great WordPress starter theme for developers. Also, it’s an excellent website solution for new users! The simplicity and ease of use make it the perfect theme foundation to use with a variety of plugins and page builders.

Give the theme a try for your next WordPress project, and please let us know of any additional improvements we can make in the comments below.

Posted by

David Morgan is the co-founder, designer, and developer of Organic Themes. He founded the company with Jeff Milone in 2009 on the Hawaiian island of Maui. David enjoys surfing, swimming, golfing and creating new web applications and products. Personal Site: http://dav.idmorgan.com