The Basic Parts of a WordPress Theme

Language consists of words that are classified into different groupings depending on their function. The English language is divided into 8 parts commonly known as: nouns, pronouns, adjectives, verbs, adverbs, prepositions, conjunctions, and interjections. These words can be used in combination with one another to express a complete thought – a sentence. Other languages may have different classifications but generally, each language is comprised of several word classifications which when combined with each other express a specific thought.

We have been slowly laying the basic foundation to understanding WordPress these past few weeks. Last week, we learned common phrases that you hear in and around the WordPress community that you might not fully understand but have become familiar with because of common use. This week we shall be a bit more technical and try to introduce a little bit more of what goes on behind a WordPress theme, its basic parts, and how it is put together to function the way we normally see it.

A WordPress theme is quite similar to a sentence. It is a combination of several parts to express a visual representation of a design thought. Let’s take a look at these basic parts (not necessarily 8) to give us an idea of what they are and how they function.

A WordPress theme is comprised of as few or as many template files as you like. These templates are PHP (PHP: Hypertext Preprocessor) source files used to generate the pages requested by visitors and are output as HTML (Hypertext Markup Language). (source: codex.wordpress.org) Each of these template files can be configured to function according to a specific design.

WordPress Themes use a combination of template files, template tags, and CSS files to generate your WordPress site’s look. If you are currently a WordPress user (self-hosted or not) you can familiarize yourself by checking out the templates listed below in the backend admin panel of your site. You can look for them under Appearance>Theme>Editor. These may all seem Greek for now and and hard to understand but the goal for now is to simply observe how the codes are written in these templates. Just make sure you don’t edit them by mistake.

Below are the basic templates that you will find among the many other templates in your WordPress theme:

style.css

CSS (Cascading Style Sheets) is a language for defining the formatting used in a Web site. This includes things like colours, background images, typefaces (fonts), margins, and indentation.

The basic principle of CSS is to allow the designer to define a style (a list of formatting details like fonts, sizes, and colours) and then apply it to one or more portions of one or more HTML pages using a selector. To every CSS style definition there are two components: the selector, which defines which tags the style will be applied to, and the attributes, which specify what the style actually does.

CSS allows you to store style presentation information (like colors and layout) separate from your HTML structure. This allows precision control of your website layout and makes your pages faster and easier to update.

index.php

index.php is a universal template, it is what any page (home, archive, single post, etc) will use if no other template is available for it. The index file controls what the homepage looks like.

For the visual learners out there, a very helpful visual resource you can check out is this infographic Anatomy of a WordPress Theme made by Yoast. More on this next week!

eCommerce WordPress Themes 2013: Trends

eCommerce has been around since the late 1990s and has been a steadily growing phenomenon over the last few years. As the Internet continues to grow in coverage and in technology, so will the number of consumers who utilize eCommerce tools as their main means of purchasing goods and services over the Internet. In a recent marketing study commissioned by Google, it was found out that 80% of shoppers today do preliminary research online before they actually do their purchase. In light of the rising dominance of eCommerce, here are some trends to watch out for in the next 12 months:

1. Mobile

In a previous article we mentioned that 2013 is likely the year mobile devices will take over. An analysis of 35000 Shopify stores predicts that 1 out of 4 eShoppers this Christmas will do so from a mobile device and this will grow to 43% next year. With 5 Billion mobile phone subscribers expected to convert to smartphones and other handheld devices, developers need to pay attention to truly responsive design with the use of flexible images. Developer also need to put focus on eCommerce engine optimizations for 3G networks found in developing countries where the bulk of smartphone conversions are expected to happen.

2. Shopify

Providers specializing in eCommerce infrastructure are gaining headway. One of the leaders is Shopify, providing its users with easily customizable and highly functional hosted web stores. For a monthly fee starting from $29, one can enjoy estore services without much hassle. WordPress theme developers need to deliver powerful themes with great eCommerce functionalities that are easy to use and available to the WordPress market at a competitive price.

3. Social Media and Viral Marketing

We cannot neglect the way social media has shaped the way people interact and experience the web. Facebook, Twitter and Youtube have taken traditional word of mouth marketing to the next level enabling the emergence of the viral marketing phenomenon. With the continued popularity of Pinterest, Google+, and the recent premium ad services on Facebook, shoppers can easily share and appreciate product details as never before. Product features and price comparisons can be shared to thousands of consumers all in a matter of seconds. New WordPress eCommerce themes should be integrated with various social media tools as well as simple and easy to understand statistics and analytics tools that can provide usage information and statistical data as to how their businesses are doing in light of their social media efforts.

4. Google Shopping

Google has just completed converting Google shopping into a fully paid listing service of products and services. This means only stores who subscribe to Google’s pay per conversion scheme get in the list. WordPress eCommerce themes should be able to support various shopping and payment options while taking note of client demands to integrate the Google shopping system into their websites. Developers must be able to figure out how to generate price comparisons using regular Google search results and integrate these as they design and develop their WordPress themes.

eCommerce has a bright future ahead as the shopping experience becomes more and more digital. WordPress authors and developers have the unique opportunity to create the themes that addresses these developing trends that will make website owners choose WordPress as the eCommerce CMS of choice.

Free WordPress Themes 2013: Trends

Free WordPress themes have come a long way since Kubrick. Twenty Ten, Twenty Eleven, and the latest – Twenty Twelve – is the newest Kubrick as far as Free WordPress themes go. Twenty Twelve is the current default WordPress theme.

Let’s take a look at some of the features of this free default WordPress theme:

  • Front Page Template where you can add text, images, video
  • Responsive, Mobile-first Layout
  • Custom ”Open Sans” Font
  • Custom post formats: links, quotes, asides, statuses, images
  • Widgets and No-sidebar layout
  • Custom menu, custom header image, custom background color and image
  • Multi columns
  • Sidebar
  • Flexible width
  • Editor style
  • Flexible header
  • Featured images
  • Full width template
  • Post formats
  • Sticky post
  • Theme options
  • Infinite Scroll

Those are a lot of features coming from a free WordPress theme, don’t you think? And most of these features are what you also get from a lot of Premium WordPress themes. If we use Twenty Twelve as our standard, what then can we expect in 2013, as far as Free WordPress themes are concerned?

  • All of the features listed above will become standard features
  • More Premium-like features
  • eCommerce options
  • Typography options
  • Drag and drop options
  • Page-builder options
  • More Single Page Themes
  • Free themes for email, mobile, etc.
  • HTML5 and CSS3 and adhering to WordPress Coding standards

Many WordPress themes authors, providers and developers give away free themes as samples of their work. These samples, albeit free, are not necessarily inferior to Premium themes being sold in the marketplace. In truth, some of them are even better (or Best – shameless plug). The fact that these free samples are marketing tools to introduce these new authors to the market should be a weighty incentive for them to release high quality products that will catch the attention of WordPress professionals who are always on the lookout for something fresh.

WordPress Theme Marketplaces 2013: Trends

A good way to spot emerging trends in the WordPress themes market would be to look at the behaviour of theme marketplaces like Themeforest, Mojo Themes and other boutique WordPress marketplaces. Here are some of our observations of what is currently ongoing and our take on what is to be:

Themeforest – The WordPress Marketplace Giant

With about 2500 themes in its inventory, Themeforest is probably the largest theme marketplace there is. Collis Ta’eed, founder of Envato which runs Themeforest, observed that the main trends on theme sales for 2012 have been: responsive, e-commerce and app themes (themes that have app like functionalities).

These trends are indeed reflective of trends observed by developers in the industry. With mobile platforms taking their place as the new mainstream it is just fitting to find responsive themes becoming more of a necessity rather than a trend.

The introduction of Jigoshop and WooCommerce plugins are making people realize the viability of turning WordPress themes into robust e-commerce solutions.

Specialized app themes will remain and will continue to flourish because of the specific niches they service. These niche WordPress app themes will continue to evolve as the themes market matures.

Mojo-themes and other WordPress Boutique shops

A look at the top 10 sellers on Mojo Themes similarly shows 4/10 themes are already responsive indicating that the trend towards mobile friendly themes is indeed a phenomenon. Their top selling theme is an e-commerce theme validating the emergence of WordPress as an e-commerce solution. The rest of the themes are multi-purpose or portfolio themes which target professionals, small or medium scale businesses and corporations.

Boutique theme shops and clubs such as StudioPress, Thematic, Press75, iThemes, WooThemes, Templatic and many others continue to thrive with their own loyal following.

Outlook for 2013

Major and minor WordPress theme marketplace vendors are experiencing the trends towards responsive themes and e-commerce. The question is how will these trends influence these marketplaces as they prepare for 2013 and beyond?

It is our opinion that responsive themes will continue to be in high demand as the transition to mobile platforms is still ongoing. About 6.1B mobile subscriptions are still yet to convert to internet ready smartphone subscriptions. The recent introduction of WooCommerce and Jigoshop indicates that the market is also only in the early stages of adaptation and mainstreaming of this technology. 2013 will be a year for continued acceptance as more sites exploit the democratization of e-commerce with these two plugins. Perhaps more eCommerce plugins will be introduced into the market and WordPress users will have more options and solutions to choose from.With a big year ahead for responsive themes and e-commerce, developers now have to bid for the best products to serve these markets as well as look at what lies ahead in 2014.

As ThemeForest continues its commitment to evolve and improve its review standards on what WordPress themes are made available in the marketplace we can expect higher quality WordPress themes that will satisfy even the strictest Code gurus out there. The renewed commitment to become more involved in the WordPress community is also a welcome move that will surely benefit us all.

Wedding WordPress Theme 2012 by ThemeFuse

Bring out the bubbly because she just said “Yes!” But wait! Walking down the aisle isn’t that simple nowadays what with all the preparations and planning that has to be done. One of the most challenging things you’ll ever go through in life is to plan a wedding. But what if you had a tool that could help you address all the logistical challenges that go with it? A simple solution is to create a website just for the event that way you can manage certain aspects of the wedding wherever you are.

Many times, coordination and information dissemination can be a challenge as you plan your wedding or even somebody else’s. Just Married Premium WordPress theme is a theme indispensable during wedding preparation activities. This premium WordPress theme is an effective means of communicating the progress of wedding preparation, invitations, attendance, as well as bookings and gift registry. It is also perfect for wedding organizers as they coordinate activities that may be logistically challenging to accomplish.

Just Married allows you to manage information relevant to the wedding. With the theme’s built-in templates, you can post all the information about the ceremony, sponsors, bridesmaids, groomsmen, and the entourage that guests might want to know. You can also post information about the bride and the groom’s story and how the story continues along. Confirming guest attendance is also much easier with Just Married’s RSVP feature. With this feature, guests can fill out the RSVP form to confirm attendance making it easier for the bride and the groom keep track of their budget. The theme also allows you to connect to the couple’s bridal registry pages to their stores of choice making it convenient for guests, whether local or international, to give gifts to the couple. Out of town guests can take advantage of the accommodations feature to book hotel rooms at group discounts set-up with partner hotels.

This premium WordPress theme’s responsive design allows guests to visit the site while on the go. This is perfect for friends and family travelling to the event. Planning a wedding need not be such a stressful activity if you have the right tools.

Features:

  • RSVP Module
  • jQuery Image Lightbox
  • Auto Image Resizing
  • Cross Browser Compatible
  • jQuery Image / Video Lightbox
  • Font-face custom font
  • Powerful Admin Options

This theme includes documentation, video tutorials, as well as access to an AfterCare Forum for theme support. Check out Just Married Premium WordPress Theme today.

Just Married Theme: $49 | Demo & Download

35 of the Best eCommerce WordPress Themes 2013

Believe it or not, 2013 is right around the corner, and we want you to be prepared. Thanks to some big advancements in eCommerce functionality for WordPress in 2012, the Best eCommerce Themes of 2013 are sure to be amazing. eCommerce is simply the commerce conducted through the Internet. With millions of websites, blogs, and Internet users, more and more businesses are taking their products online. The successes of sites like Amazon and Ebay has dispelled all skepticism about eCommerce websites – not to mention the scores of “mom and pop” operations selling everything from ebooks to digital hugs…yes…some people are making money selling completely made up things.

(more…)

HTML5 WordPress Themes 2013: Trends

The evolution of HTML from the time it was introduced years ago to the HTML5 we know today is a technical geek lover’s journey. This article is not about that but just in case you are interested to know how it all came to be here are some interesting resources for you to check out. For those who want a more comprehensive history of HTML5, you can read all about it here – Dive into HTML5 by Mark Pilgrim. For those who just want a quick overview, check out this cool infographic The History of HTML5 published by Mashable. If you are really want to get into the technical stuff, you can go straight to the source right here – W3C.

What’s so Cool About HTML5

According to PCMag:

HTML5 was designed to provide a comprehensive application development platform for Web pages that eliminates the need to install third-party browser plug-ins such as Java and Flash. HTML5 provides support for 2D graphics, document editing, drag and drop, browser history management, audio and video playback and local file storage.

Simply put, HTML5 is composed of a set of rules that tell computers how to interpret code to display websites. It’s the 5th version of a set of instructions, governed by specific rules, that tells your browser how to execute these commands to display a specific design. It is the language of the web. HTML5 includes the following updates:

HTML5 introduces a number of APIs that help in creating Web applications. These can be used together with the new elements introduced for applications:

  • Media elements (video and audio) have APIs for controlling playback, syncronising multiple media elements, and timed text tracks (e.g. subtitles).
  • An API for form constraint validation (e.g. the setCustomValidity() method).
  • An API for commands that the user can invoke (used together with the command element among others).
  • An API that enables offline Web applications, with an application cache.
  • An API that allows a Web application to register itself for certain protocols or media types, using registerProtocolHandler() and registerContentHandler().
  • Editing API in combination with a new global contenteditable attribute.
  • Drag and drop API in combination with a draggable attribute.
  • An API that exposes the components of the document’s URL and allows scripts to navigate, redirect and reload (the Location interface).
  • An API that exposes the session history and allows scripts to update the document’s URL without actually navigating, so that applications don’t need to abuse the fragment component for “Ajax-style” navigation (the History interface).
  • An API for base64 conversion (atob() and btoa() methods).
  • An API to schedule timer-based callbacks (setTimeout() and setInterval()).
  • An API to prompt the user (alert(), confirm(), prompt(), showModalDialog()).
  • An API for printing the document (print()).
  • An API for handling search providers (AddSearchProvider() and IsSearchProviderInstalled()).
  • The Window object has been defined.

WHATWG HTML has further APIs that are not in HTML5 but are separate specifications at the W3C:

  • An API for microdata.
  • An API for immediate-mode bitmap graphics (the 2d context for the canvas element).
  • An API for cross-document messaging and channel messaging (postMessage() and MessageChannel).
  • An API for runnings scripts in the background (Worker and SharedWorker).
  • An API for client-side storage (localStorage and sessionStorage).
  • An API for bidirectional client-server communication (WebSocket).
  • An API for server-to-client data push (EventSource).

source: W3C

How Does this Affect WordPress Developers?

The HTML5 standard features make it easier to develop faster, interactive, and more semantically correct web pages, eliminating the need for functions that require JavaScript and Flash. WordPress designers, authors, and developers can take advantage of HTML5 enhancements on these 6 key elements: video, application cache, canvas for images, geolocation, worker threads, and notification. No doubt, HTML5 has bridged the divide between desktop and mobile and so far it is the best way to create mobile-friendly websites on a variety of devices.

What Trends do We Expect See in 2013

  • The rise of the baked, boilerplate, bare bones or blank HTML5 Themes
  • HTML5 will be supported by all new WordPress themes
  • More single dynamic pages websites with animation features
  • WordPress themes running on HTML5 compatible smart phones
  • Responsive design
  • Simple and clean themes (no to options-overload, yes to feature-specific themes)

HTML5 is still a work-in-progress and its adoption into more and more WordPress themes will continue as more and more users turn towards the mobile web. We can continue to expect more power, more speed, and more capabilities from it in the future as this technology continues to mature.

Responsive WordPress Themes 2013: Trends

For decades web design has always been centered around the desktop. We’ve always created our themes with the assumption of a user sitting in front of a desktop with high speed internet connection and using the most powerful web browsers available. The advent of mobile platforms have forced us to rethink this paradigm and we have had remarkable progress in creating themes that work on both desktop and mobile platforms. A few years ago, it was predicted that mobile devices will overtake desktops as the dominant Internet access device. With this continued trend to towards mobile computing, are we really prepared to respond to this technology inflection point?

The necessity for asking this question comes with the realization that a lot of design practitioners still follow a graceful degradation doctrine of design. We develop a top of the line theme version designed for the most powerful infrastructure users may have and allow the theme’s functionalities to disable when weaker systems are encountered. We have done this effectively with the use of fluid grids, flexible images/elements and media queries. However, if iOS and Android devices become the new mainstream, shouldn’t our themes be designed primarily for these devices and allowed to progressively enhance when more generous systems are encountered?

The point we are putting forth is this: 2013 will likely be the year mobile devices take over. The challenge for us is to create our themes for this new environment. The next question: “Among mobile devices what should our base platform be?” Based on the latest mobile internet trend numbers, tablets, particularly the iPad, are now coming to the forefront. Smart phones are still on the early stages of growth with a lot of mobile subscribers anticipated to convert in the next couple of years. The growth of the mobile internet is driven by emerging markets led by China, India, Indonesia, Philippines and Nigeria. As such, upcoming themes should be optimized with iPad sized tablets in mind, comprehending how the site will load in light of 3G infrastructure still being mainstreamed in global markets. These designs should be light on cache on these memory limited devices. Features for high performance desktop systems should not in anyway be downloaded to mobile devices but should remain in the cloud to be activated only when the appropriate device is detected.

So what comes next? What do we look forward to beyond 2013? We still have about 5B mobile phone users anticipated to convert to smartphones. By then, our designs will have to be for the small screen. For now, our general trend is “miniaturization” of the desktop. Quite appropriate for a world that is becoming smaller and smaller everyday.

Business WordPress Themes 2013: Trends

Business websites have always been put up for one purpose: to bring about more conversions/sales that will impact the company’s bottomline. The advent of the Internet has redefined the markets our companies and enterprises have operated in. Thomas Friedman has considered it one of the forces that “flattened” the world. What is amazing is that the Internet continues to evolve. Analysts have predicted that there will be a shift to mobile devices between 2013 to 2015, a forecast that is now turning into a reality. With this change in platform, businesses have to rethink how they do business on the web.

With a transition on the way businesses use the Internet, the question that needs to be asked is: “How do we develop business themes that will address this emerging trend towards mobility?” We need to consider how people use the mobile web. Business WordPress themes are no longer confined to corporate portfolios alone. More than ever, these themes should be designed to be multifunctional with eCommerce capabilities integrated in its core and these business WordPress themes must be flexible enough to adapt to the rapid changing face of the marketplace.

A good business WordPress theme built with this mobile trend in mind should focus on responding to these basic online activities that people do – people use the mobile web primarily to search, share, and shop. These are, in a nutshell, what people really do online – search for information, share what they find, and shop for stuff they need or want. WordPress themes for businesses should be designed in such a way as to enable people to Search, Share, and Shop without taxing memory, network, and computing resources especially if the user is using a mobile device. Product and price information should also be easy to share and be compared to competitors. Purchases should be safe, secure and robust over 3G infrastructure dominant in emerging markets of the developing world.

Aesthetically, the business theme should be responsive with the base design optimized for tablets which is now becoming the new mainstream. As a website owner, providing your clientele with the most pleasant online experience on your website will have a direct impact on your conversions. Addressing what they need in the simplest and fastest way possible will always yield good results.

Design trends and WordPress theme bells and whistles will come and go. These are all nice and fun to have but one day they are in, the next day they are out. Nice, flashy websites don’t make a business successful. It still boils down to good old-fashioned business practices like courtesy and excellent customer service, whether online or offline, that will win the day. These business ingredients transcend technological trends anytime.