Shopify is a fantastic e-commerce solution for small businesses. One thing it doesn’t have? An integrated contact form. But it’s easy to add one to your site using a third-party service like Wufoo (which offers a free account level as well as several paid tiers with ever-increasing levels of fabulosity).

Add a simple form to your site

Let’s take a look at adding a contact form to our ‘About Us’ page in Shopify. First, we need to create the form in Wufoo. Log in (or create a new account) and click “New Form.”

Add some fields (for a contact form, it’s a good idea to at least ask for an email address and a message, but you can add any fields you think you may need – name, phone number, whatever). Keep in mind, the shorter your form, the more likely it is people will fill it out!

Once you’re happy with the fields in your form, click the “Form Settings” tab and give your form a name and (optionally) a description. In this section you can also decide on your confirmation options: you can have your users redirected to a page on your site once they’ve successfully submitted the form, or replace the form with a message (“Success!” or something similar). You can also opt to send your users a confirmation email.

Click “Save Form” when you’re all done. A pop-up will ask you what you want to do next. Choose the option that returns you to the Form Manager.

In the Form Manager (otherwise known as your Wufoo dashboard), choose the “Code” button and click the tab for “Embed Form Code.” Select the code under “JavaScript Version” and copy it to your clipboard.

Now, log in to your Shopify admin area and click “Blogs & Pages.” Choose your Contact Us page and click “Edit.”

In the Edit screen, click the “Insert” button and choose “Script.” You will see a box open up with an example of a JavaScript code snippet. Delete the sample snippet and paste the entire JavaScript code you selected from the Code section in Wufoo (it will be two separate JavaScript snippets). Insert the code into your page and click “Save.”

Voilà! You now have a Wufoo contact form on your Contact Us page. User submissions will be saved to your Wufoo account. You can tweak the settings in Wufoo to dictate where submissions are sent (for example, you can opt to have each submission emailed to you or texted to your phone) and whether you want to integrate your form with a third-party add-on like Highrise or Campaign Monitor. Keep in mind, any changes you make to the form in Wufoo will be reflected on your Shopify site!

Click here to get your tickets! Don’t wait too long; the event sold out last year and it’s almost certain to do the same this time around. I’ll be talking about Business Blogging for Non-Writers & we’ll be giving away copies of our book as well. Hope to see you there!

Today I needed to write a bit of code to take the style attribute off of an HTML tag and convert it into something I could use inside PHP.

My first thought was to use regular expressions, but it occurred to me that there might be a simpler way to do it with just a couple of explodes.

Just in case this might help someone else out there, I thought I’d post it.

So, assuming you will pass something like “width:1090px;left:-340px;top:-144px;” to the function
you should get back the following:

Array
(
    [width] => 1090px
    [left] => -340px
    [top] => -144px
)

function styles2array($styles){
	$styles = rtrim($styles, "; ");
	$arr = explode(";", $styles);
	$return = array();
	for($i=0; $i<sizeof($arr); $i++)
		{
		$split = explode(":", $arr[$i]);
		$return[$split[0]] = $split[1];
		}
	return $return;
	}

Cheers!

-Matt

One of the great things about WordPress is that it’s constantly being updated with bigger and better features. The switch from 2.x to 3.0 brought some seriously cool new additions, like custom menus, custom headers, and custom post types.

We’ll be blogging about all the new stuff 3.0 has to offer on the companion site for our book, The WordPress Visual QuickStart Guide site. Pop on over and take a look at the first tutorial, Custom Menus in WordPress 3.0!

We’re pleased as punch to announce our latest launch: Moody Eyes Online!

We jumped at the chance to take on this project, since at least half of couldbe studios is blind as a bat (though the other half got his first pair of glasses recently – which counts, even if he only needs them when he spends too long on the computer) and most other online glasses retailers…well, let’s just say we had lots of ideas! The Moody Eyes guys let us take the design lead, and the result is a site that makes us really want another pair of glasses.

The collections are hand-picked and showcase the frames, and each collection features a piece of pop art by the fabulously talented Hillary White. The whole thing has a retro feel without being too kitschy, which really complements the product lines.

One of the coolest (and most developmentally challenging) features is the prescription form – not only did we integrate it with the product pages, but we tied it to customer accounts so that if you enter your information once, it will automatically populate the next time you order glasses. Cool, right?

When we announced the launch of the Clink Room last month we said the redesigned Shop was right around the corner – and we meant it! Check out the custom Shopify theme we put together for Casey & Jason. Of course it looks cool, thanks to their amazing graphics, but the really neat thing about it is how it functions behind the scenes. We made it as easy as possible to switch out the background graphics and the sidebar links so that the site will always look fresh. (One of the things we love about designing for Shopify: custom theme settings!)

We’re really excited to announce the launch of the new blog for The Clink Room – and not just because we had a hand in making it! The Clink Room guys do fantastic design work – they’re the people who do the official logos for Major League and Minor League Baseball teams – & we’ve had a blast doing this project. We got to flex our layout muscles getting the site to look just right, and we even got to create our first mobile site! Seriously, it’s very cool and all of you with iPhones or Android handsets should check it out, stat.

We’ll be launching the revamped Shopify store for these guys very soon, too – keep your eye out for the announcement.