Squarespace Tutorial - Sell senior grad cards from your website

If you're like me, and you actually don't do in-person-sales (GASP!) and you've been looking for a more streamlined way to sell grad cards, I have an answer for you! Well, if you have a Squarespace website I have an answer for you...

I ADORE Squarespace. It is elegant in its design; easily used without coding, yet still extremely functional and beautiful. Squarespace sites can be minimal, or more detailed. The beauty of Squarespace is this - it is what you make it, and you don't have to write even one line of code to do it.

Now, back to the problem at hand. Graduation Announcements, or Grad Cards, as I like to call them - are not easily sold if you don't do in-person-sales. The problem is this: each card has more than one image on it, as well as multiple lines of text. If you try to sell Grad Cards on your Shootproof, Pixieset, etc. there is not a very easy way for the client to select multiple images to go with one product - roadblock.

If you send your clients a PDF with all of the card designs in it, and ask them to email you back with the design choice, as well as the file numbers of the images they want on their cards, and the verbiage - all back to you through email - then it is cumbersome. Do you then ask them to call you with a credit card number? Mail you a check? Send them a SEPARATE email with an invoice attached? #headdesk

I decided that I was going to solve this problem to the best of my ability this year - and I did! Read on for a step-by-step tutorial on how I accomplished this using the power of Squarespace...


Step 1

Create a new page to house your Grad Card "product". You must have the proper type of Squarespace account to sell products on your website. See this page for more info. You will also need to be set up with Stripe in order to collect payment before you even embark on this tutorial. So get that all set up first, then follow along.

I chose to keep this page off of my homepage's navigation, so I used an unlinked page.

Click the + sign to add a new page.

Click the + sign to add a new page.

Step 2

Tell Squarespace that your new page should be a Products page.

 Squarespace Tutorials for Photographers

Step 3

Once the new page pops up, you will see a little plus sign at the top right of the new page - click on that plus sign to add a new product to your page.

 Squarespace Tutorials for Photographers

Step 4

Start building your new product. The first step for me was loading all of the sample images that were numbered so my clients could see all 18 designs I had for them to choose from, and they could then click on them to enlarge into a lightbox (default for Squarespace products) so they could see them close up and make their choice.

Editing screen for your Grad Card "product".

After I loaded all of the design preview images, I wrote a detailed description in the space to the right - where you describe your product. You can style your description multiple ways - using heading styles, as I did, as well as bold, italic, bullets, etc.

I made my most important text in the description "Heading 2" to style it and draw attention.

I made my most important text in the description "Heading 2" to style it and draw attention.

Step 5

Now, the tedious part of the product set up has arrived! After loading all of your sample images, and writing your description, click on the next tab - Pricing & Variants. This is where you will create a new line for each design, times the number of options each design can be purchased in.

This is the tricky part. I will give you an example:

I sell my Grad Cards in 3 different types of cardstock and I have 18 designs to choose from.

I need to make a separate line (that has its own SKU - done automatically by Squarespace!) for each of these options.

So, for Design 1 I make three lines:

SKU1234 $40 Design 1 Linen

SKU1235 $40 Design 1 Pearl

SKU1236 $40 Design 1 Smooth

I repeat this process for each design I have, for a total of 54 variants. I ignore the dimensions, and weight, and for "stock", I choose "unlimited" because I don't want to limit how many a client can order. That "+" on the right side of the window adds a column for another option. I only had 2 options, design and cardstock. They are all the same price - if yours are different prices, you will need to have a different price for each separate line that has a different price. I charge the same no matter which cardstock my clients choose.

Entering all of the product variants.

Entering all of the product variants.

Step 6

Next, you can enter in any "additional info", but I don't use that because whatever you place in that part of the product is far at the bottom and I fear clients may not see it. So, on to the Form that they will fill out when they purchase. This is where they will tell me which image numbers and which verbiage they want on the front and back of their cards.

Click "create new form" at the bottom to make your form that clients fill out when purchasing.

Click "create new form" at the bottom to make your form that clients fill out when purchasing.

Add the "text area" fields so your clients can tell you image numbers and verbiage.

Add the "text area" fields so your clients can tell you image numbers and verbiage.

 

Step 6.5

Add fields to the form, by choosing the "text area" field, naming each field appropriately, and giving them a short description so they know exactly what you want in each field. They will need to have their gallery handy or their USB if they purchased digital files - so they can look up the file names.

Editing fields on the purchase form.

Editing fields on the purchase form.

Step 7

Choose a thumbnail for your product. If you don't upload a thumbnail image for your product, Squarespace will automatically use the very first image you uploaded in the description area. You can also make this a "featured product", use a custom Add to Cart button, or change the URL of the product if you would like to.

Upload a thumbnail image and enter a custom URL if you desire.

Upload a thumbnail image and enter a custom URL if you desire.

Step 8

Now, click on "save" to make sure your product is saved and published on your site! You can see what my final product looks like below.

Close up of the final product page that my clients see.
Dropdown menu showing options as my clients see it.

Dropdown menu showing options as my clients see it.

The form filled out with purchase as my clients see it.

The form filled out with purchase as my clients see it.

I hope this has helped you tackle selling those Grad Cards in a more seamless manner! Please comment below if you use this tutorial and let me know how it goes!

Erin

Lux Senior Photography

Dayton, OH

I am a fine art senior portrait photographer in Dayton, Ohio. I capture the Art of Youth.