Posts Tagged ‘WordPress’

Adding Social Media Activity to your Website: Monday Productivity Pointers

Published by | Monday, December 16th, 2013

Add social activity to your website

Explore Monday Productivity Pointers at lynda.com.


Your website is the first place potential customers will visit to find out more about you, so it’s important to keep your site active, current, and consistently updated—establishing your professional persona in the best possible light.

In this week’s Monday Productivity Pointers, I’ll show you how to publish a Twitter feed to your website; using a WordPress blog as my example. I’ll also show you how to embed a Google calendar into your site so it’s clear to potential clients that you’re an active professional.

WordPress 3.8: A quiet revolution

Published by | Thursday, December 12th, 2013

Today’s release of WordPress 3.8 is revolutionary in the history of WordPress—and a clear sign of things to come from the popular content management system. Sporting a clean new interface, tons of new features, and a new development philosophy, the 3.8 release is a milestone for the WordPress community in many ways. We’re already hard at work updating our WordPress Essential Training course to reflect WordPress 3.8, but there’s a lot to notice in today’s release beyond just what ships in the code.

Deadlines are not arbitrary
Establishing the current WordPress philosophy “Deadlines are not arbitrary,” WordPress cofounder and project leader Matt Mullenweg made a series of bold announcements at WordCamp San Francisco back in July. First, he stated that WordPress 3.7 and 3.8 would be developed in parallel, with firm, preannounced release dates for each. Furthermore, he announced that all new features slated for version 3.8 would be developed as stand-alone plugins first, and only built into the WordPress core code once they were stable. Finally, Matt announced that he’d be personally leading the development team for the 3.8 release.

WordPress 3.6: What’s new, and why it matters

Published by | Thursday, August 1st, 2013

A few months behind schedule, version 3.6 of WordPress is out and ready for you to make the most of. The scope of changes in this release are relatively minor, but the updates are important and will help in your day-to-day work with WordPress. Here’s what’s new and why it matters to you.

Twenty Thirteen: The new theme standard

Since 2010, a new default theme has been released every year, and this year is no different. With 3.6 comes Twenty Thirteen. While the previous three themes—Twenty Ten, Twenty Eleven, and Twenty Twelve—got progressively simpler, Twenty Thirteen goes in a new design direction. It’s aggressively blog-centric with a heavy focus on Post Formats, and it’s a great example of the popular flat design trend currently sweeping the web.

The Twenty Thirteen WordPress default theme

Post Formats are a new feature in WordPress 3.6 that lets you choose unique layout and design templates for specific types of blog posts, such as images, videos, quotes, and regular articles, among others. The Twenty Thirteen theme supports Post Formats by providing a bold, unique visual style for each post so your site visitors can differentiate between the content in each one. In the image above you see the Video, Quote, Status, and Chat post formats on the front page. The Standard post format has a white background. The post format styling is also carried over into the post editor so as you change your post format you’ll see the styling change as you work, and the post formats are now identified using icons throughout the dashboard.

Why WordPress?

Published by | Wednesday, January 16th, 2013

Why WordPress?

 

What makes WordPress a good solution? Why is it so popular? Regardless of the question, the answer is the same, and it can be boiled down to three simple words:

Because WordPress works.

Of course, it’s a little more complicated than that. Let me put it into context from the perspective of the three main users of WordPress: the end user, the site owner, and the designer/developer.

 

 

Easy to find, easy to use, easy to share

A poorly kept secret about WordPress is its findability. If someone asked you how to get indexed on Google and you answered “Just set up a WordPress site,” you would not be far from the truth. The way WordPress is built makes it a magnet for search engines and other online indexes. So much so that if you don’t want your WordPress site indexed, you have to take steps to prevent it from happening.

Out of the box, WordPress has great search and share optimization. With the addition of plugins like WordPress SEO, AddThis, and Facebook for WordPress, these built-in capabilities are further enhanced, giving any site the opportunity to become the next big thing on the web. This is provided the content is great, of course. We’ll get to that later.

The purpose of many websites is to put out easily findable, accessible, and shareable information. And WordPress does this in spades. When you are searching for content on the web today, you will likely find it on a WordPress site. If you are reading or viewing content on a WordPress site, you are able to access and interact with that content through comments and RSS feeds. And once you have read the content, you will have an easy time sharing it with your friends on social sharing sites and social media.

 

Easy to publish, easy to configure, easy to maintain

WordPress is a prime example of the virtues of open source. It is built, evolved, and maintained by the people that use it and is therefore in a constant state of forward-moving flux. For site owners this means by simply running a WordPress site and keeping it up to date, they are at any time using the most current web technologies to communicate with the world.

Over the past three years, WordPress has undergone several fundamental design and development changes that have made an already easy-to-use application even easier to use. At the same time it has become more powerful and diverse. From how it is installed to how a site owner can publish content and interact with visitors, WordPress leads the way in removing the barriers that prevent anyone from publishing online. Between WordPress.com and self-hosted WordPress, most people with access to an Internet connection are now able to publish their thoughts, ideas, and creations online with minimal effort. With the challenges of web technologies all but removed, the site owner can focus on what matters: producing and publishing excellent content to share with the world.

 

Easy to build, easy to augment, easy to evolve

For me, the true power of WordPress lies in the back end. Whether you are a complete novice or a seasoned pro, building themes and plugins for WordPress will make your life easier and will enable you to do more in less time. I am walking proof.

With a design in place, building a custom WordPress site from scratch—one that looks and behaves nothing like what is expected of a WordPress site but is still just as easy to use and maintain—takes less time than with any other platform I have tried. When people ask me what WordPress can do I answer, “Whatever you want it to do.” And I stand by that statement. At its core, WordPress is a simple interface between the site owner, the database, and the end user. All the stuff in between (administration, themes, and functionalities) is available for the designer and developer to play with and add to in any way they want. And because WordPress is open source, people can step in and contribute to the WordPress community in whatever capacity they feel fit, from answering questions in the forums and building free themes or plugins to contributing to WordPress Core.

The bottom line

Though it may sound like I see WordPress as the be-all and end-all of web publishing, the reality is I am a pragmatic platform agnostic. The reason I laud WordPress and why I love teaching people about WordPress is because I see it as one of the best available solutions for most websites today. I have and continue to work with other solutions including Drupal and Joomla!, but for most of the websites I encounter, WordPress is one of the best options.

Whether you are just starting to play with the idea of publishing a blog, you want to become a web designer or developer, or if you already know all there is to know about the web and you just want to play with something new, WordPress is a great tool to use. It has both the ease of use and the advanced features to suit pretty much any need. And when that need isn’t met, a theme, a plugin, or an extension is there to fill the void.

Interested in more?

Suggested courses to watch next:

Twenty Twelve–lean, clean, and ready for your WordPress site

Published by | Wednesday, December 5th, 2012

The Twenty Twelve WordPress theme, responsively displaying itself at mobile resolution.
The past two years have seen the release of two default themes for WordPress, aptly named Twenty Ten (released in 2010) and Twenty Eleven (released in 2011). Now we can add this year’s addition, Twenty Twelve, to the list. And with it we get a new stock theme that redefines what a stock WordPress theme is and sets a new standard for lean and clean design and coding. But like all good things the Twenty Twelve theme is not without controversy, which makes it all the more exciting.

Less is more

Twenty Twelve is at the same time stripped down and sophisticated in a way we’ve only previously seen in sandbox and development themes like Toolbox and _s. But unlike these themes, which were created specifically to be used as baselines for new themes, Twenty Twelve is fully built out and ready to take on the challenges of pretty much any content you throw at it. Twenty Twelve is responsive, conforming to small and large screens and providing custom navigation for smartphones and tablets; it is in line with current ultra-minimalist design trends, putting content and typography front and center; and it has tons of cool features built in for beginners as well as advanced users. All in all it makes for a great theme whether you just want a fresh look for your site or you want a good baseline to start from when you build your own child theme or full-on custom theme.

If you ask me, one of the most important aspects of the Twenty Twelve theme is its simplicity in design, code, and implementation. When the Twenty Ten theme was released, it was a revolutionary shift from the old and stale default themes. Twenty Ten was simple to work with and had lots of advanced features under the hood like custom background color, custom header images, and more widgetized areas people could take advantage of. The next theme in the series, Twenty Eleven, built on this concept and introduced more advanced features like a custom front page template, a featured content slider, and other elements. However, the advancements of Twenty Eleven came at a cost with the theme being far more complex on the back end and far more convoluted and tricky to work with.

Considering this, Twenty Twelve is a step in the right direction. Gone are advanced features that few used in practice, replaced with simpler, more meaningful templates and tools to make customization and use as easy as possible.

Efficient in both code and display, the new Twenty Twelve WordPress theme is simple and powerful.

Twenty Twelve at a glance

The key features of Twenty Twelve include responsive design and custom phone and tablet menus; a custom front page template as well as full-width and sidebar templates for pages; full support for Aside, Image, Link, Quote, and Status post formats; full Theme Customizer support for all the standard WordPress functions; Google Fonts integration; and the standard header image and background color support we have come to expect from modern WordPress themes. Not to mention a clean and modern design with the content front and center.

Even with all this, the true power of Twenty Twelve can be found on the back end. Twenty Twelve is a leaner and cleaner theme than its numerically named predecessors. This is great for novice theme tinkerers and advanced theme developers alike. The theme provides more bang for your brackets, separating out functions and templates in separate files and folders and wrapping up functions in conditional functions, actions, and filters to make modifications and interactions easier. In my opinion, Twenty Twelve could be the new standard from which child themes and full themes should be built.

Controversy abounds

I say “could be” because quite a bit of controversy has stirred up around one decision made by the theme creators: It doesn’t seem to support Internet Explorer 8, at least not the way that is expected.

Twenty Twelve is fully responsive and ships with a custom mobile menu for smaller screens. This much is to be expected from a modern WordPress theme. However, in implementing the mobile menu function the developers of the theme made an interesting and controversial decision: Rather than setting the desktop stylesheet as the default for the theme and making special media queries for smaller screens and mobile devices, they chose to set smaller screens and mobile devices as the default and wrap the styles for larger screens in media queries. While this is no problem for modern browsers that follow the new HTML5 standard, it is problematic for older browsers like IE8 because the provisional media queries that create the layout for larger screens is not understood by these browsers. As a result, users of older browsers like IE8 get the mobile layout on their full-size screens.

The theme developers argue that this is not an issue for two reasons: One, the mobile version of the site is perfectly acceptable even on larger screens, and two, people shouldn’t be using old and outdated browsers like IE8 to begin with.

While I agree with both these statements, I believe our job as web designers and developers is not to police the Internet but rather to provide great experiences for the end users and educate them in the process. And since we have little to no control over what hardware and software the end users choose to access our sites, we need to provide the best experience possible for all of them regardless of their choices.

We can’t let older technologies hold us back from implementing new standards. In that case, providing a suboptimal experience for users with older browsers would be acceptable. However, the IE8 issue in Twenty Twelve is not caused by this type of situation but rather the choice to set the mobile styles as the default and wrap the desktop styles in media queries. In other words, they turned the theme stylesheet upside down on purpose. Had it been turned right side up, this would not be an issue.

These are the types of issues that arise in open source and they are incredibly interesting and frustrating for everyone working in open source. Unfortunately, more often than not the end users are left in the dark about what’s going on and get the impression that things are not working right. That is not the case at all. The great thing is that these issues are usually resolved through a collective effort, and a solution to the IE8 menu problem in Twenty Twelve is imminent.

If you want to read more about the IE8 menu controversy and get an idea of how these things happen and how they are resolved, check out the forum streams Excellent base for child themes and nav bar fails in IE8 as well as the track ticket. They provide for some interesting reading.

Check out Twenty Twelve right now!

Though it may sound dramatic, do not let this minor controversy deter you. Twenty Twelve is a great and forward-looking theme and a excellent basis for child themes as well. If you are itching for a new look for your WordPress or WordPress.com site, you should give it a spin and see what you think. There are lots of customization options and you can easily make it your own. Once you’re done, post your thoughts, ideas, and questions in the comments below.

Interested in more?
• The Twenty Twelve theme at wordpress.org
WordPress 3: Building Child Themes at lynda.com
• All WordPress courses on lynda.com
• All courses from Morten Rand-Hendriksen on lynda.com

Suggested courses to watch next:
WordPress Essential Training
WordPress: Building Responsive Themes
WordPress Mobile Solutions

WordPress 3.4 update to WordPress 3: Building Child Themes course

Published by | Monday, July 9th, 2012

With the update of WordPress to version 3.4 came some important feature improvements that changed the way certain key components work, including how the header image and background functionality are implemented. This in turn can mean some of the old methods of making changes to WordPress elements suddenly won’t work anymore if you’re trying to apply old code techniques within the new and improved WordPress 3.4 environment.

The issue

Recent WordPress 3.4 upgrades to stock WordPress themes have made a previously well functioning component in my WordPress 3: Building Child Themes course currently non-functional.

Specifically, in movie 2.3 (Creating a functions file and changing the header image size) I instruct the viewer to redefine the height and width of the header image using the following code in a child theme functions.php file:


Unfortunately, with the new implementation of the header-image function, this no longer works. A new filter function is needed.

The fix

To get the result you want without messing things up in the process, a modified version of the code above is necessary. So, to resize the header image in a WordPress 3.4 Twenty Ten child theme you use the following code:

An update is imminent

We are hard at work rolling out an update to the WordPress 3: Building Child Themes course to bring it in-line with the new WordPress 3.4 version of Twenty Ten. Until then, using the code above should solve the problem.

Do you have other WordPress 3.4 questions? Feel free to ask them here and I will do his best to get back to you as soon as possible.

 

Interested in learning more about WordPress?
The complete WordPress 3: Building Child Themes course on lynda.com
• WordPress Essential Training
• WordPress 3: Developing Secure Sites
•  Dreamweaver and WordPress: Building Mobile Sites

Using the new WordPress 3.4 Theme Customizer

Published by | Friday, June 15th, 2012

Of the many great reasons for using WordPress to create your web site or blog, one of the most important ones is that WordPress is an ever evolving platform. That means with every new version release you can expect to see either security and usability upgrades, or the addition of whole new features. In the case of the latest WordPress evolution—version 3.4, released for WordPress.com and WordPress for self-hosting—we see both regular security hole fixes and code patches, as well as some cool new features for site owners and developers. One feature in particular that is worth special mention is the new Theme Customizer.


Using the WordPress 3.4 Theme Customizer The major update of 3.4 is the introduction of the Theme Customizer. This new feature makes it possible for an administrator to change most theme-related elements of a WordPress site in a live environment and see how those changes look before publishing them to the live site. Previously these customization features were found under several different sections in the admin area, and to apply them you had to make one change at a time and then open the site in a different window to see the result. The Theme Customizer is a one-stop-shop for theme customization, and depending on what theme you are using, you’ll be able to change everything from the site title and description, to menus, what is displayed on the front page, background colors, header images, and more. Once logged in as an administrator you can access the Theme Customizer both from the front end and the Admin panel on your site. From the front end you’ll find the Theme Customizer on the WordPress menu under your site name.

Theme Customizer on the WordPress menu under your site name.

In the Admin panel you can activate the Theme Customizer for the site’s current theme by going to Appearance > Themes and clicking Customize. Activating the WordPress Theme Customizer from the Admin panel.

In either case, you are taken to the Theme Customizer for the current theme which consists of a collapsible left-hand sidebar with all the customization features and your site in preview mode on the right.

WordPress Theme Customizer screenshot.

Theme Customizer with editing options displayed in the left sidepanel, and a preview of your changes displayed in real-time in the full, right-side view.

 

Screenshot of the collapsible left-hand Theme Customizer sidebar with all the customization features.

Zoomed in view of the collapsible left-hand Theme Customizer sidebar with all the customization features.

Using the Theme Customizer is really very easy. To get started simply open the feature you want to change in the sidebar, for example Site Title & Tagline, or, as seen below, Header Image, and make your changes. As you make changes to the different elements, the live site preview will change on the right to reflect these changes.

Changing the Header Image in the Theme Customizer left-hand sidebar.

Changing the Header Image in the Theme Customizer left-hand sidebar.

The addition of that Theme Customizer sidebar itself takes care of a bit of JavaScript that I can’t quite wrap my head around. While that unto itself is very cool, what’s even cooler is that you can navigate your site as you make these alterations and see what your customizations look like on different pages—all in real-time without your visitors being aware of what’s going on. Very, very cool.

Once you’ve made your customizations and you’re happy with how the theme looks, go to the top of the customizer and click the Save & Publish button and your new settings will be activated on your site. If you don’t like your customizations, simply click Cancel and you are back to the Admin panel without any trace of anything having ever happened. Since this is a brand spanking new feature most themes only have support for the regular functions right now, but expect the Theme Customizer to showcase some pretty snazzy features once theme developers dive into the code for real.

Other WordPress 3.4 updates of note
WordPress 3.4 has two other cool updates under its sleeve:

1. If the theme allows it, you are no longer restricted to a specific size for the header image. As an example, that means you can upload a full-height image in the Twenty Eleven theme and have it take up most of your page if you want. I’m not sure that’s a good idea, but the option is there if you want to try it out. My recommendation is you try it in the Theme Customizer to see what it looks like first.

2. Image captions now allow HTML elements, so you can make fancy captions with text that has bold or italic emphasis, links, and all sorts of other interesting HTML touches.

To find out more
Now that you know what’s new and what’s possible, go test out the Theme Customizer, try some HTML captions, and check out the new and improved WordPress 3.4 for yourself. If you want to see the full list of goodies under the hood of WordPress 3.4 take a look at the codex.wordpress.org version 3.4 article. If you need some extra help, visit lynda.com to check out my full collection of lynda.com WordPress courses.

 

Interested in more?
• All web + interactive courses on lynda.com
• All WordPress courses on lynda.com
• All courses from Morten Rand-Hendriksen on lynda.com

Suggested courses to watch next:
• WordPress Essential Training
• WordPress 3: Creating and Editing Custom Themes
• WordPress 3: Developing Secure Sites
• Creating and Managing a Blog Network with WordPress

 

This week’s featured five: Going mobile! From using your device, to developing applicatons

Published by | Wednesday, May 30th, 2012

It’s no secret that computer engagement is going mobile, with access via mobile devices predicted to surpass desktop computers in the next two years. So for this week’s collection of featured videos, I’ve chosen five free movies that focus on the theme of mobility, whether it be creating a WordPress site that behaves properly on mobile devices, learning to use your mobile phone or tablet more productively, or learning to develop your own mobile applications.

 

1. Customizing WordPress for smartphones and tablets
In this video from chapter nine of the WordPress Essential Training course, Morten Rand-Hendrickson shows you how to use built-in responsive themes and useful plug-ins to ensure that your content is presented in a usable form, regardless of screen size. The main takeaway? With a bit of appropriate planning, you can greatly improve your overall user experience by saving your viewers from the pain of having to zoom or scroll to view your carefully constructed content.

 

2. Accessing Evernote on a mobile device
Evernote is a great application for organizing and accessing your electronic notes, links, and other bits of critical information. (Admission: I use Evernote to collect interesting free movies from the lynda.com library that I want to use in my featured five blog posts.) In this movie from chapter one of Up and Running with Evernote for Mac, David Rivers shows you how to get Evernote set up so that you can add notes via your mobile device. If you’re primarily working in a Windows environment, there’s an analogous movie in chapter one of David’s Up and Running with Evernote for Windows course, as well.

 

3. Using the iPhone and iPod Touch Maps app
Admittedly, using the iPhone (or iPod Touch) Maps application is a fairly straightforward proposition, but in this excerpt from chapter nine of iPhone and iPod touch iOS 5 Essential Training, Garrick Chow shares some insights into using the compass feature that I always found confusing. Not only can the Maps app help you discover what is around you, and how to get there, it can also help you orient yourself by showing you which direction you are facing in your current location. After all, it’s always good to start out heading in the right direction!

 

4. Identifying the four pillars of iOS development
For the developer types who have already figured out how to use their mobile devices, going mobile is more about focusing on the creation of mobile applications. As with any metaphorical or physical journey, it’s always good to have a scope of where you will start, where you will end, and how you will get there. In this excerpt from chapter one of iOS SDK Essential Training (2012), Simon Allardice shows you how to approach your iPhone application development, and elaborates on why tools, language, design, and process are the four pillars—or, the four important areas of content—that you need to have all together in order to build the applications that you want to make.

 

5. Exploring the lynda.com mobile site
Finally, a lynda.com collection of mobile tutorials wouldn’t be complete without a look at how you can take the lynda.com library with you wherever you go via your own mobile device. In this movie from chapter one of the How to Use lynda.com course, Garrick Chow demonstrates the features and functionality of our new mobile site, so you can get to learning wherever you are:

 

We’d love to know more about how you are using your mobile devices, and how mobile technology is changing the way you work, and play. Which activities have gone mobile in your computing life? Are there some jobs that still feel best done at your desk? Tell us a little about your relationship with your mobile devices in the comments section below.