14 Day Hassle-Free Refunds. Shop Now

Want 10% off your next template purchase?  Click here to unlock the code!

Memorial Day Sale is happening now! 25% off Website Templates through 5/28. Use code: SUMMERSPLASH. Shop Now

LAST DAY! 40% off Website Templates 11/24-11/27. Use code: HOLIDAYCHEER. Shop Now

BLACK FRIDAY SALE COMING NOV 24-27. Click here to download the Black Friday Lookbook.

New website templates in the shop!   Private Label  |  Firefly

New website templates available now!  Private Label  |  Firefly  Save 30% through 8/25 at 12pm CST with code NEWTEMPLATES30.

Wondering what to do before making a website?  |  Download the roadmap now for free

Windbreaker-website-template-customized-Strands-and-Co-salon-website-1

Step by Step Guide of How to Customize your Showit Website Template (2023)

Blog Home

Share + Save

You just bought your website template for Showit. But where to start? How can you make your customizing process quick and simple? In this post I’ll be breaking down the exact process I use so you will know exactly how to customize your Showit website Template. Everything from the first things to do before even getting started, setting up your branding on your website, and the best way to go about editing each page. Let’s get started.

1. Pre-Website Planning

If you want a website that stands the test of time and serves you big results, it’s essential that you put in the time to take care of some homework ahead of time.

  1. Poll your audience
  2. Nail down your brand colors
  3. Establish your font suite
  4. Schedule & execute your brand photoshoot
  5. Gather your reviews in one place
  6. Brain dump
  7. Prep your email list opt-in (if applicable)
  8. Set up your booking system
  9. Write your website copy
  10. Prep your logo files
  11. Get your photos web-ready
  12. Secure your domain name
  13. Select your web design or designer.

Click here to access the Pre-Website Homework Roadmap. Once you’ve worked through these homework steps, return to this blog post to know exactly how to customize your Showit website template.

2. Getting Started

Before you jump right into customizing your website, I recommend setting up your website’s design settings, social media settings, and establishing which parts of the templates you will and won’t need. These “Getting Started” steps will set you up for success and making everything go smoother!

Design Settings:

Your design settings are where you’ll really make your website template unique to you. This is where you’ll adjust your color palette and fonts. Click “Design Settings” from the top left of your Showit builder. Use the color palette at the top to paste in your brand’s HEX color codes.

Showit website template design settings color fonts

At the very top, click “Fonts” to add your brand fonts to your design. Then return to the “Site Style” tab to set your Type Styles for each setting: Title, Heading, Subheading and Paragraph.

Social Media Links:

In order for your site-wide social media icons to link up and work properly, you’ll need to add your social media links to your site settings. Click “Site Settings” from the top left corner of your Showit builder. Then click the “Social” tab. Insert the full URL (example: https://instagram.com/franklinandwillow) for each social media account you have. If you don’t have some, just leave them blank. Hit “Close” to save.

Showit website template customizing social media link settings

Upload Media (logos and images):

Upload all of your logos and images ahead of time to save yourself time later on. First, select “Media Library” from the top left corner of your Showit builder. Begin uploading all of your compressed and renamed images and logos into your media library. Consider using folders to better organize your media.

Showit website template customizing uploading media - logos and images

Determine Which Pages you Need:

Your website template likely came with many pages, many of which you don’t need on your website at this time. To eliminate headaches later on, I highly recommend determining which pages you will and won’t be using on your website. If you’ve purchased a Franklin & Willow website template, you’ll see a section titled “Not in Use” on the left side of your Showit builder amongst the page names. Drag any unused pages down below that title to keep yourself organized.

customize Showit website template - determining "Not in Use" pages

3. Customize

Next up: customizing! Yes, we’ve finally made it to the fun part of making your website your own. Follow the steps below to customize in an order that makes the process more simple and doable.

Edit Site Canvases:

A Site Canvas is a section (“canvas”) of your website that remains the same on any website page that it appears. A site canvas is used for any canvases that will be used on multiple pages. We typically see site canvases used for things like Menus and Footers. If you need to make a change to your menu, you only need to update it once if it’s a site canvas (instead of editing it on every single page).

Customizing showit website template - editing site canvases

On your website, you’ll see all of your site canvases listed on the bottom left corner of your builder, underneath all of your pages. I recommend working one-by-one to edit them. The most important site canvases to get right are your Menu, Navigation and Footer canvases, as these are the main ways users will travel throughout your website.

Hide Sections You Won’t Need:

Just like you dragged your unused pages down below the “Not in Use” section earlier, you’ll want to hide any pages you won’t be needing on your website pages. This will help un-complicate the customizing process for you, stripping your website back to only the sections you truly need to edit. I strongly encourage never to delete sections of your website, in case you need to later bring them back. To hide a section (“Canvas”), make sure that canvas is selected. Then next to the canvas name you’ll see 3 dots. Click the dots and uncheck “Visible on Desktop” and “Visible on Mobile” to hide that section from view.

Replace all Logos & Photos with your Own:

Now it’s time to start getting your own content plugged in! Start replacing every photo on the page with your own. Then ensure all logos (mostly found in headers/menus, navigations and footers) are swapped out with your own.

Finish customizing each page:

With everything in place, you can now work through each page, plugging in your own words and making any layout tweaks as necessary for your content.

4. Finishing Touches

You’re so close to making your website live and driving traffic to your newly customized Showit website! There are a few things left to do to ensure a smooth launch.

Add Privacy Policy and Terms of Use Policy pages:

Save your booty down the road by adding a Privacy Policy and Terms of Use policy to your website. There are generators online available to help you quickly create your own policy. You website template from Franklin & Willow comes equipped with pages that you can easily paste your policies into. Click here to read our blog post about how to set up these legal pages to make sure your website is legally compliant.

Add SEO Settings for each page:

One of the biggest missed opportunities we see with DIY’d Showit websites is not getting SEO settings in place. You could be missing big time search result boosts by avoiding this step! Click here to learn how to add a Page Title and Meta Description, as well as copy and paste our examples directly into your website.

Test and Polish your website:

Make sure your i’s are dotted and t’s are crossed before launching! Click here to read about the 5 things you should do before launching your website.

5. Launch your website!

YOU DID IT! You’re ready to launch your website! To go live, you’ll just let Showit know you’re ready to connect your domain. Do this by first clicking “Site Settings” in the top left corner. Click here for Showit’s tutorial covering how to launch your website. I hope you feel more confident in knowing how to customize your Showit website template.

FREE DOWNLOAD FREE DOWNLOAD FREE DOWNLOAD
Free download Free download FREE DOWNLOAD

Your first step to a website you deserve. Download now and let us walk you through the baby steps (yes even the scary techy stuff!).


Pre-Website Homework Checklist for the Beauty Industry

Other Free Resources

FREE • FREE • FREE •

Templates for Stylists

        Shop the Templates

        Schedule a Call

Other Free Resources