WordPress Attachment URL Find and Replace

I am currently doing some work for a client who is transferring his wordpress installation onto a new domain. His site has around 350 pages, most of which have a couple image attachments. After transferring, we noticed that all the image attachments were still pointing to the previous domain, even though we had updated the site URL in the backend.

The Problem – How WordPress Stores File Attachments

The problem with how WordPress stores file attachments is that the attachment information (aka image URL) is literally stored in the actual post as an absolute URL. This means that when you move your installation to a new domain, all the file attachments are still going to point to the old domain. This is a strange way of doing things, and I’m sure it’s been a problem for many people.

The Solution – WordPress Database Find & Replace

There may be a plugin to do this, but I used some old fashioned SQL queries that basically searched for the domain within the post content and replace it with my new domain. The basic formula looks like this:

UPDATE wp_posts SET post_content =
replace(post_content,"http://www.old-domain.com","http://www.new-domain.org");

Obviously you need to replace the domain names with your relevent information, but that command is all you need to go in and find-and-replace all attachment URL’s. Be careful, there is no way to undo this action, so make sure you do it properly.

You can put this command into the SQL area of PHPmyAdmin. It should look something like this:

Hope this helps someone!

Why I Hate Windows Vista, A Brief Rant

I find more and more that I’m using this blog as an outlet for my daily frustrations. Today for example, I’m feeling particularly belligerent towards Windows Vista (64-bit Ultimate). I feel like I may be in the minority of people feeling this way, but my experience thus far has been a huge disappointment. First, I should probably shed some light on my situation.

The Situation

I am working as a freelance web designer/developer over at Element42, and I specialize in PHP, WordPress, Photoshop, HTML, jQuery, and CSS. I’ve loved and worked with computers for as long as I can remember, and have used them as my gaming consoles for my entire life. I’m not great with the really advanced Windows stuff (ie. registry editing), but I know my way around fairly well and can generally ‘figure something out.’ 

In late 2004 I bought my first mac (iBook) and was instantly convinced of Apples superiority (especially with regards to software). Since then, I’ve been primarily involved with my shiny-new metal MacBoook. Although I still use my Windows desktop as my primary music repository, as well as my gaming platform (nvidia 9800GS).

A Real Chance

I remember hearing about Windows Vista and being really really excited. I’m the kind of guy who really enjoys using the most up-to-date software and hardware, so much so that I actually downloaded and used the free Vista RC1 version for a couple months. After another stint with XP I finally got Vista 64 Ultimate. 

There were definitely some problems with RC1 (aka drivers), but my experience was generally pleasing. How quickly tides can change… because my current Vista situation has become an unimaginable nightmare. Even basic tasks like using iTunes are so frustrating that I want to smash up my desktop. It’s soooooooooo slowwwwwwwWW…. in a way I’ve never experienced before.

The Apologist

What makes this worse is that I was originally a Vista apologist! I actually thought the problem was on my end! I even went out and bought an extra gig of nice RAM in the hopes that something would change. Oh no, it’s still the same old story. I start it up, and after around 4 minutes of downtime I need to login. Once logged in it’s at least another 3 minutes before Windows is actually useable. It just keeps hitting the hard-drive… 

I’ve already disabled all the Aero effects (which helped a little), I’ve installed SP1 and updated all my drivers, and my Vista install is really fresh (I’ve already reinstalled once). So I’m really starting to think I should move back to XP. Even right now I can hear Vista scanning through my harddrives, it’s been going on for at least 30 minutes… just really intense hard-drive reading. I’m not even using that computer and I already know this is one of those times of the day when I just can’t use my Vista box. Not until it’s done “thinking.”

How Did We Let This Happen?

What I don’t understand is how Microsoft managed to release this? They have thousands of well-paid and enthusiastic employees who are constantly trying to improve their product and this is the best they can do? I can’t believe they’ve done this!? I actually want to go backwards and re-install XP. It just really makes no sense at all.

Now I know there are going to be people who want to respond to this post with accusations that my hard-ware is probably not good enough, or that I am probably just stupid with computers or something, and that’s fine. But be advised that my specs are good enough to play through fallout 3 (mid-high settings) and I fully understand that I am probably in the minority of users having these problems. I am just sick of hearing about everyone who is “perfectly happy with vista.”

Anyways, this rant is over. It’s probably a little heated and not well thought out, but it’s as real as can be and it was written on a MacBook because Vista was not up to the job.

- Emerson

A New Microsite

Just thought I would take a moment to post up the link to my latest creation. I’m calling it a ‘microsite,’ and I’m going to be offering templated versions of the site for $250.00 a year. This includes a domain, wordpress installation, minor customizations to the template, screencast tutorials for each template, and regular updates and support.

The project is still underdevelpment and will hopefully be launched within a few months. Take a look at the sites and let me know what you think.

• Elementfortytwo – Montreal Web Design
• Personal Microsite Template by Elementfortytwo

WordPress Transfer Media Upload Path Problem

Well – looks like I just came across another random problem with my wordpress installation. Didn’t take me long to figure out, but I thought I would share it anyways. We all know how frustrating this stuff can be.

The Problem

After transferring my wordpress blog to a different directory on my domain – I noticed that I could no longer upload media. Anything I would try to upload would just show up as a broken link. I had recently changed my installation directory and knew that was probably related to the problem. After looking into the file directory – sure enough – wordpress was still uploading my media to the old installation directory.

The Fix

It’s really easy for once. You don’t even have to open any coding programs. All I had to do was navigate my way to the Settings/Miscellaneous section of the wordpress admin. From here you will be able to set the upload path to the proper directory. Like I said – actually really easy.

Hope this helps someone out there…

Changing Widget List Titles in Dynamic WordPress Sidebars

Just a quick post today – something that I picked up while trying to figure out some issues with my web design portfolio site. I am in the process of adding a blogging section to my site, which should be easy given the fact that I built it on wordpress. However, I ran into a relatively simple problem while trying to design my widgetized sidebar.

The Problem

The problem I was having was relatively simple. I built my sidebar using a standard unordered list. It looked something like this:

<ul>
    <li><h2>Title</h2>
      <ul><!-- Second Level Etc... -->
    </li>
</ul>

The problem was that I needed my title to be inside an H3 tag rather than the standard H2. Turns out the fix is relatively simple if you understand how to use the widget API. When ‘widgetizing‘ your wordpress theme, one of the first things you need to do is create a special file in your theme directory named functions.php. Inside of this file is where you put the basic code required to get your widgetized sidebar up and running.

The Fix

Using the widget API (explained in detail here), I was able to quickly change the tags that surround my titles. Check out this code (located in your functions.php file) and you’ll understand how it all works:

if ( function_exists('register_sidebar') )
    register_sidebar(array(
    	'before_title' => '<h3 class="widgettitle">',
    	'after_title' => '</h3>'));

All you need to do is replace my H3 tags with whatever you want to appear around your widget title. It does not need to be a heading tag at all – you could make it whatever you want. Hope this helps anyone having the same problem I did.

Hail to wordpress,
Emerson

On the Merits of Organized Photoshop Documents

As someone who builds websites for a living, I am sensitive to things that normal people are not. One such thing is the organization of photoshop documents. I’ve had my fair share of poor photoshop files land at my desk, and it’s always my responsibility to “make it a webpage.” For one reason or another, the designers I work with simply refuse to take the extra five minutes to organize their documents – something that makes what should be a 2-hour job take 5-6 hours. 

Layer 53 through 103

One of the worst photoshop crimes you can commit is neglecting to name your layers. I have worked with documents so bad that I honestly have to go through, layer by layer, and rename everything. This can easily take me half-an-hour on a big document. It’s a huge waste of my time and it’s something that the designer should be doing as they work. Keep your document labeled as you create it! It will speed up production times significantly and fill your CSS boys with happiness.

Folders are Required

In the same vein as labeling your documents, I really feel that putting your layers in properly labelled folders makes everything easier. When I’m working with transparencies I need to be able to isolate my layers quickly. This means I want to be able to hide the entire document except the layer I need. If things are not in proper folders this can take an extra 5-10 minutes to do (every time). It’s also just common courtesy for integrators.

Think Like an Integrator

You might be the lead designer – but it’s extremely important for designers to understand how sites are built (integrated). Here are a few limitations that need to be considered:

• Text that will be generated by HTML should not have drop-shadows or effects, and should also be written in a web-safe font. Don’t show a client something that is simply not possible.
• Websites need to expand and contract. They are living breathing documents that should not have a fixed height. This means that when you design a site, there needs to be a section that is repeatable. 
• Consider the consequences of big images. Although it’s true that bandwidth is less an issue than it used to be, we should still strive to build sites that are quick and efficient. Maybe that 500kb background image is a little to big?
• The less image-based text the better. If we can do it with HTML our efficiency will increase massively. Think of the production time benefits of using HTML (not to mention the accessibility and SEO benefit). 

Repeatable Hell

Making something into a repeatable background can be very difficult. Especially for someone who is supposed to be building a website, not working with photoshop. I’ve spent literally hours on a tiling background in order to get things just right, and I think it can be a giant waste of time. If your going to use a repeating background you need to plan for it. Make sure the designer has already created the pattern so that it’s easy to slice for the integrator.

Use the Rulers

Using rulers to build photoshop documents is a must. There is nothing more frustrating than slicing a PSD, only to find that something is one-pixel off due to a design flaw in the photoshop document. This kind of problem can set back a slice significantly (on rare occasions it requires starting from scratch). Using rulers also ensures that things are centered properly – another aspect of slicing that can be really frustrating if done incorrectly.

Final Words

As someone who works well with both Photoshop files and CSS, I think I bring a distinct advantage to my designs compared with someone who does exclusively graphic design or just CSS. I build my photoshop documents so that they are exceptionally easy to slice, and my production times are much lower on my personal projects than when I’m working with a CSS ignorant designer. So if you’re ever looking for a good designer, try and make sure that they have at least some understanding of what it takes to slice a PSD. Hopefully they will consider the end goal of their work and build their photoshop document accordingly. You have nothing to lose and time and money to gain. Just my 2 cents.

My Portfolio Redesign

I just finished my portfolio relaunch and it feels really good to have it out of the way. I didn’t actually spend all that much time doing it, but I put a great deal of thought into it. My last portfolio was plain old HTML, but this time I took the time to design a system on WordPress and as a result my site can change and grow with ease (as well it just ‘feels cool’).

It’s in the Details

So I really like this new work of art, I think it might be one of the better montreal web design portfolio’s in exsistence. At least in my eyes anyway. Take a look and let me know what you think – it’s a minimalist style, but I think it works really well. I paid attention to the smallest details -  all padding and margins are either 15-pixels or 30-pixels.

All Hail jQuery and WordPress

The homepage uses a custom template that I’ve selected in WordPress. My featured work cyclebox is loaded with posts (in the featured work category). Likewise my design articles are also just posts. This was one of the harder things to do because apparently wordpress needs a little coaxing to have more than one ‘the loop’ (if you don’t understand – it’s some wordpress jargon).

Updates Galore

Thanks to the use of wordpress, I can now update my portfolio site whenever I want. Keep an eye on whats going on – most of the articles at this point need to be edited quite a bit, but I think they will eventually be really good. I might actaully try to get featured on a design site.

Let me know what you think,

A fresh new look,
Emerson R. Lackey

Tables are Dead – Now Move On

I just want to come out and say it. I hate everything to do with tables. They are old, ancient relics that should be discarded as quickly as possible. I actually have to work with them quite often, as one of the companies I do work with uses them extensively (and swears by them). Yuk, haven’t they ever heard about the philosophy of separating content from design?

Why Tables Suck

First off, they are tables. Secondly, they merge your layout with your content – something that makes it really really hard to change layouts in the future. Rather than changing one simple CSS file we are forced to do a massive find-and-replace. To be honest, the only thing I hate more than find-and-replace is tables. But really, I find that table based layouts just feel wrong. They have no “zen,” and have a sluggish feel. 

Furthermore, if you look at a table based page without the CSS it retains its basic layout. I know there are people out there who tout this fact as something good, but I can’t stand it. When someone turns off the CSS they should basically see a word document. That’s something I strive for with all my sites.

CSS Zen

I also would like to say that I love CSS. I know many designers have said this before, but I really associate CSS with the word Zen. It’s something that is a little cliche at this point, but I don’t care. CSS layouts are filled with glorious zen that makes designers feel good about themselves. It’s crazy I know, but whatever — CSS is the best thing to happen to web design since the creation of the internet.

I know this is just a stupid rant, but I really hate tables. When I see them in designs I automatically think “ewwwwww… this designer has no idea what’s going on in the web design community.” 

So next time you start to enter a table cell think of this post. Think of all the semantic minded designers you’ll offend. We know the shortcut key for ‘view page source’ and we can read your code like a book. Do yourself a favor and learn some CSS – it will do you well in the long run.

Rants and raves,
Emerson R. Lackey

Sources of Design Inspiration

We all need some inspiration sometimes, even those of us that want to become a source of inspiration. So today I wanted to throw together a quick list of some of my favorite design blogs. Anyone who is into design probably already knows most of these, but you never know!

Smashing Magazine

This is probably the best known design blog there is (although I think they call it a ‘online magazine’). They are known best for their use of lists in almost every article. Articles have names like: “100 ways to improve your designs,” “63+ Unbelieve jQuery techniques,” “72 Professional Fonts.” You get the idea… and for some reason names like these make you want to read more. I know everytime I see these lists I get a little excited.

Check out Smashing Magazine for your daily web fix.

CSS Tricks

This is a relativly new source for me, but I think its been around for awhile. Run by a portly man named Chris Coyier – this blog offers much more than information of CSS. I recently (finally) learned how to use sifr (font replacement) by following one of Chris’ great screencasts. He seems to update things fairly frequently, once every couple days. Actually today I just learned something incredibly useful from Chris – how to avoid IE’s image distorition when using HTML to scale down images. Apparently, all you need to do is insert this code into your stylesheet:

img { -ms-interpolation-mode: bicubic; }

Thanks Chris – this is the kind of stuff you find regularly on his blog. Check it out and your stylesheets will thank you.

A List Apart

Yes yes yes – I almost forgot this corner stone. What would the web be without a list apart? Probably a horrible mess of tables and spacer gifs. This magazine is released in articles – once every second Tuesday. I find the articles are sometimes more academic than practical, but to be honest, that’s often what I find the most rewarding. It also doesn’t hurt when you’re trying to talk to clients and want to wow them with some overarching design philosophy.

Take a moment and check it out – once every second Tuesday.

Nettuts

In life I generally try to save the best for last, and this blog is no exception. Of all design blogs out there Nettuts is by far my favorite. They have an amazing layout and only the highest quality of articles get published. They draw people from all over the web design community and have really put together some great tutorials. I find they deal a lot with wordpress, jQuery, and PHP – some of my favorite web technologies. They pay handsomely for articles, so if you have some high quality material you can try and get them to publish your stuff.

Nettuts, where Jesus would go if he were into web design. (technicially called nettuts+, but whatever, I liked them better before they rebranded.)

A Final Word

I’m going to be relaunching my own web design/portfolio site at elementfortytwo.com – I’ll probably put up a post once it’s done and explain some of the techniques I’ve used to build everything.

Thanks for reading,
Emerson R. Lackey

Montreal Web Design

An Introduction

Well, so it begins. Today I’ve finally gone through with my plan to blog about my Montreal web design company. I will slowly fill this blog with ideas I get when creating new sites for myself and clients. I’m hoping that I will be able to eventually put in code snippets that allow my users to copy and paste without hassle. This might take some time to get up and running but I have a good feeling about where this is all going, and I can’t wait to start hearing from other people in the design community.

Passion for Design

I sometimes feel that others think I’m totally crazy. I am really passionate about design in a way that most would not understand. I think about CSS whenever I can, paddings, margins, font-stacks… anything that deals with design makes me happy inside. In fact, I’ve worked so hard that my hands are starting to hurt. This is not a good sign for a young man of only 25-years, but I think it will all payoff in the end.

So come along for the ride you like. There will be  many times you will disagree with what I’m saying. Hopefully that will just makes things more interesting than they already are, but I have some pretty firm design beliefs that might freak some people out. One thing you’ll understand pretty quick is my love of simplicity. I try to design websites like Mark Twain wrote books – with the easiest language possible.

Content is Content, Design is Design

So where to start? Well for those of you who keep up with modern web design you will already know all of this. For those who don’t, this might be a good chance to learn the first rule of modern web design. Always separate design and content. Learning this simple philosophy will put you on the right track to learning all about CSS and XHTML. I know that sounds boring and plain right now – but trust me, take a few months to understand it and you’ll never look back.

Love of WordPress

I’ve been learning as much as possible about wordpress. If you are really serious about separating content from design, then wordpress is a great place to start. This is the real essence of wordpress that makes it so alluring for web designers. Giving a facelift to a wordpress site is much easier than doing it with 60+ pages of static HTML (ugh, kill me). I’ll talk about this more later – but for now, just listen and understand that the separation of content and design is what we will build upon here.

shameless self plug – if ever you find yourself in Montreal and need web design, then I highly recommend visiting my company’s site. Hell – even if you don’t live in Montreal  we are still happy to hear from you.

Goodbye for now,
Emerson R. Lackey