Posts Tagged ‘wordpress’

From Dell to Intel, companies have started to put up their own blogs as a new way to communicate with their customers. A lot of smaller businesses are trying to follow in their footsteps (with various levels of success). The question is: “Is it really worth it?”

The Good Stuff

1. Getting Personal. Many businesses already publish newsletters for their clients, but blogging takes client communications to a higher plane. The key is interaction. Blogging is a two-way street, usually in an informal atmosphere. With it, one can create a strong personal relationship with customers, encouraging brand loyalty.

2. Reader-friendly. The basic blog format is clean and simple (unless cluttered up by ads). If you use any of the popular platforms such as Wordpress, there are hundreds of great-looking free templates you can choose from. And, since people are used to blogs by this time, it’s easy for them to digest your content and navigate through your site.

3. Uncomplicated. You don’t have to be a very technical person to start a blog. Most can be set up in a matter of minutes. Enhancements like polls, podcast widgets and other plug-and-play add-ons are also available.

4. Low-cost. Blog setup can range from free, if you use a specialized blog host such as Blogger, to a few hundred dollars, depending on whether you plan to get your own webhost and use a personalized domain name. Of course, the latter will appear more professional.

5. Blog as portfolio. Aside from featuring the latest announcements from your company, your business blog can include articles on the latest trends in your industry, to show people that you are up-to-date and that your products and services reflect that. You can also post in-depth how-tos, reports, or opinion pieces that can build your credibility as an expert.

Part 1 - “Tools For The Task” and “Preparation”
Part 2 - “Layout And Structure” and “Designing Wordpress Themes in Photoshop”
Part 3 - “Photoshop to XHTML in 24 Hours”
Part 4 - “Cleaning Up Your XHTML”
Part 5 - “Preloading Images with Javascript and CSS”
Part 6 - “Marking Up is Hard to Do” and “The Anatomy of a Wordpress Theme”
Part 7 - “Beginning with PHP for Wordpress”

Wordpress is a state-of-the-art publishing platform with a focus on aesthetics, web standards, and usability as the makers proudly proclaim at wordpress.org. The keyword there being ‘publishing’ and the most important part of the Wordpress publishing engine is the element that allows content to be published online easily and automatically. This element is called the the loop.

(more…)

This is the seventh post in series about creating Wordpress themes with your Photoshop designs. You may want to review before we continue….

Part 1 - “Tools For The Task” and “Preparation”
Part 2 - “Layout And Structure” and “Designing Wordpress Themes in Photoshop”
Part 3 - “Photoshop to XHTML in 24 Hours”
Part 4 - “Cleaning Up Your XHTML”
Part 5 - “Preloading Images with Javascript and CSS”
Part 6 - “Marking Up is Hard to Do” and “The Anatomy of a Wordpress Theme”

• First we’ll duplicate index.html and rename the copy index.php. We’re only keeping the original .html file for reference to make sure that the finished PHP operates and looks the same.
• Let’s open index.php in our text editor. Right now it’s just a .html renamed .php. Our job is to make make it true PHP.

(more…)

Del.icio.us
Digg This
Stumble
8 Comments;

This is the sixth post in series about creating Wordpress themes with your Photoshop designs. You may want to review before we continue….

Part 1 - “Tools For The Task” and “Preparation”
Part 2 - “Layout And Structure” and “Designing Wordpress Themes in Photoshop”
Part 3 - “Photoshop to XHTML in 24 Hours”
Part 4 - “Cleaning Up Your XHTML”
Part 5 - “Preloading Images with Javascript and CSS”

Wikipedia defines the term markup as a set of annotations to text that describe how it is to be structured, laid out, or formatted. When we say we’re going to ‘mark something up’ it means we’re formatting the document so that it can be read correctly by machines. Hypertext Markup Language (HTML) is the most common form. That can be marked up to Extensible Hyper-text Markup Language (XHTML) and beyond that to PHP to become dynamic.

Now that we’ve got our basic html layout design we can begin the hard work the transition from HTML to PHP.

(more…)

You’ve gone from Photoshop PSD to slices to XHTML using Parts 1, 2, and 3 but if the end result is a Wordpress theme the majority of the work still has to be done. First of all it’s important to understand one bit of the operational mechanics of Wordpress. Wordpress looks for certain information the header of a file called style.css, this is how it can tell themes apart. Here’s a better explanation from Codex:

In addition to CSS style information for your theme, the stylesheet, style.css must provide details about the Theme in the form of comments. No two Themes are allowed to have the same details listed in their comment headers, as this will lead to problems in the Theme selection dialog. If you make your own Theme by copying an existing one, make sure you change this information first.

Thus, we need to separate our inline CSS and put it in a separate file called style.css

(more…)

We’ve just started our first Wordpress theme! In Part 1 and Part 2 we reviewed some techniques that will allow our design to be marked up to XHTML. In this lesson you’ll learn exactly how to do this and why it isn’t exactly as easy as it seems.

Photoshop to XHTML in 24 Hours

So we’ve all seen those ads for websites that say they can “Photoshop to XHTML/CSS in X Ammount of time” right? No? well here’s 39 of them. What exactly are these service doing that you can’t as the theme designer? Nothing. If you feel so inclined, save yourself the fee (usually around $100 or so dollars) and do it yourself!

(more…)

Designing your first Wordpress theme may seem incredibly ambitious at first but it’s really not that hard. It may help your understanding of Wordpress if you find a theme you like and disect or remix it. This is how I learned to code and one of my first attempt was a variation of Derek Punsalan’s theme The Unstandard.In Part 1 I talked a bit about the tools you’ll need and how to get prepared. Now that you’ve done that we’re going to get started.

Layout and Structure

This post by 37 Signals is an incredibly detailed account of how to organize information and using sketches to design for the web. I highly recommend taking a break to read it. As mentioned in the post sketching out the general layout of your site will help you. For my design I started with this sketch:

(more…)

In this multi-part series I’ll detail how to create and design a Wordpress theme from nothing more than your imagination using Photoshop, CSS, XHTML and PHP. Before you continue you should look over other tutorials “Working with Wordpress Offline Like A Pro and “Color Proofing Photoshop” as some of the topics discussed there will come up in this tutorial like working offline to develop themes, and proofing your colors so that they translate accurately for the web. At the end of the entire series I’ll allow you to download the fully developed theme with the PSD, and theme-files including stylesheets, and javascript.

(more…)

Like many of you I’ve noticed a lot more of my clients want dynamic websites instead of traditional static pages. This is great because dynamic pages tend to lead to more work, continued maintenance and they tend to offer larger budgets. I used to work off of my web server but the problem I’ve had lately is that when I’m not connected to the internet I haven’t been able to code for Wordpress in a way that allows me to view my changes. Since I started using the techniques used in this tutorial my productivity has increased significantly.

The solution for me was to start using MAMP which allows me to run a virtual web server on my Mac. With this tutorial I’ll tell you how to install MAMP, install Wordpress on your Mac, install extensions to Dreamweaver and soon you’ll be able to design wordpress whenever you want wherever you want! Although I mention Wordpress instructions specifically, MAMP allows you to use many other CMS’ offline as well. Unfortunately, this tutorial is for Mac users but if you’re a PC user try this tutorial on using XAMPP.

The abbreviation MAMP stands for: Macintosh, Apache, Mysql and PHP. It allows the user to host a virtual server bundled with all of the other things you need to run dynamic web pages like MySql, PHP, and Apache. Unlike previous solutions all these resources are available at the click of a button. You don’t have to figure out how to install or update them individually which saves everyone a lot of time and stress.

(more…)