Pour your coffee (the champagne will come soon!) and let’s get to work on setting up your new website!
watch this awkward, albeiet helpful welcome video from us!
01 / PREP
Let's start by getting the brand back together. ;) If you already have a brand style guide, then refer to that and pull your fonts and brand colors into one place. You'll be able to add any custom brand fonts to your Showit site in .woff format (web format), or you can totally choose to keep the fonts and colors that come with your TONIC template. (We thought long and hard about those font pairings!)
If you need a new font for your brand, we highly recommend (read: spend all of our money on) CreativeMarket.com and find a lot of great free fonts at dafont.com.
Also compile your brand logos and marks in one easily accessible folder, too... we highly recommend high-res transparent PNGs or vector-based SVGs of logos + graphics so they render nice and crisp!
DOWNLOAD the CONTENT prep GUIDE
Time to do a little image curation! Pull all of the images want to include on your website in a folder (or folders)... you can organize them by page if you like! Showit does the hard work for you by automatically resizing your images to fit the area and screen dimensions that are needed. All you’ll need to do is make sure your images are at least 1500px and no larger than 3500px on the long side (any bigger and you may experience load speed issues) and have an RGB color profile. We recommend saving as a JPG, although PNGs work, too.
Need some killer stock images? For $1 you get 7 day access [plus downloads] to Social Squares with your template purchase, so snag some great photos there or check out other options in the stock photo section of our Resources Library.
Bonus points? Rename your images before you upload to SHOWIT for optimum SEO performance. That means kara-jason-wedding2034.jpg? Bad."modern-chic-chicago-wedding-at-the-ritz.jpg" Good.
You can also use tinyjpg.com to resize your images before uploading to get your site speed up. You can get more info on that in our *killer* content prep guide here:
Our number one piece of advice for adding copy to your website? Write it outside of Showit... preferably in a Google Doc with your template open alongside it. How you organize your document is up to you, but we suggest copying the text that comes with your TONIC template, pasting it in the Google Doc, then writing your copy underneath it. When it comes time to paste your copy in, you’ll know exactly what goes where!
Pro-tip: feel free to use the copy that comes with your template as cues for what to write about. It's there for a reason! Keep it simple (seriously, less is more unless you're telling a great story), make sure your reader could get the gist of the page if they ONLY read the largest pieces of the text on the page, and remember what you want them to take away from their experience!
Click HERE to learn how to write copy people actually want to read... and to the right are a few resources from copywriters we love.
02 / DESIGN
While our templates *are* completely customizable, we've found that the majority of our customers are happiest with their finished website when they start by simply replacing the content that is in the template with their own content.... and then make small design tweaks, like color changes and layout alterations.
You chose a template so you DIDN'T have to design something from scratch, so while we encourage you to make our designs your own, just remember — we already did the hard part for you! We designed it! You don't have to!
We’re not saying we’re Leonardo da Vinci over here, (though, we wouldn’t mind it if someone else said it 😉), but I mean, you wouldn't paint over the Mona Lisa, right? Hey, we tried to give you a solid masterpiece to start with...
So, if you’re tempted to embark on a new career as a website designer at 3am, call a friend, email us, go get some coffee…promise us you'll press pause on that idea and focus on replacing content first. You can always customize from there!
One of the great things about Showit is the global design settings panel that allows you to automatically change your fonts and colors across your entire website with just a few clicks.
If you followed along with the Prep Checklist in your content guide then you’ll already have your fonts and colors picked out. Now all there is to do is set them up. Read these Showit guides on how to do that in just a few clicks.
Now it’s time to add your lovely images and photos to your website.
PRO TIP: Start by replacing images (meaning you click on an image in the template, then hit that blue SWAP IMAGE button on the right hand toolbar) rather than adding them using the Showit media library or image adding tool in the bottom center of your Showit window.
We’ve seen our Regulars experience delays from adding imagery + text boxes that get overlapped and muddled instead of using what’s already there to fill it in. These placeholders are there to be used as such to save you time in the design process.
If you followed along with the Prep Guide (GOLD STAR!) then you already have all of your copy ready to go! All you need to do is simply double click on the text box you want to edit, highlight the text that’s there, and paste in your new text. It's like writing an email, baby. (Just don't forget to make sure you're checking it on mobile as you go!
Below is a Showit guide on adding and formatting text. Remember, replace, don’t add.
03 / EXPERIENCE
Did you know that you can edit your website to look one way on a phone and another way on a desktop computer? Using Showit, you have FULL design control over the mobile version of your site — something you won't find anywhere else.
You want your visitors to enjoy their time on your website no matter the device they are on... No "Make sure you look at this on your Desktop." here! All TONIC templates are 100% optimized — and built to wow — for mobile viewing. Should you need to make any specific adjustments to things like fonts or images, you can do so easily by toggling mobile settings. Check out this tutorial:
Every TONIC template comes with a "Portfolio" page that features multiple gallery styles and methods of displaying your work at its best.
To make use of the portfolio pages, you'll simply choose the gallery style you like best, add your content, and duplicate that gallery as many times as you need.
This one's easier to show than tell, so just CLICK HERE to watch our handy tutorial, "Tonic Galleries 101."
One of Showit's coolest features is called "Canvas Views." Canvas Views basically allow you to show different content in the same PLACE or section of your website. When you want something to be almost like a slideshow on your website (perhaps with arrows, like the example on our site on the left), you'll use Canvas Views.
In our templates, we often use Canvas Views to showcase rotating testimonials or create "header" sections where you can navigate through different content. To access the other "view," you'll just click the folder for that particular canvas, navigate to the proper view (again, like the example on the left) and add / edit the content.
04 / PRE-LAUNCH
You’re nearing your launch day! Testing is a critical part in having a successful website launch. With fresh eyes and a fresh mind, open your website preview and click through it like you’re an average viewer. Once you’ve done that and made any adjustments that you need to, ask a friend or TONIC Regular (feel free to post your website on our Facebook group!) to review your website with your preview link.
Now that you’ve navigated your website like a visitor, it’s time to get rid of elements that you don’t need. We recommend that you hide elements rather than delete them. Why? It makes it easier to add them back if you change your mind!
Note: When it comes to PAGES (say, you've got a podcast page and you don't have a podcast... yet!), you can delete any page you don't want for now, because you can always re-add a page from your template design at any time. Here's how!
Because it doesn't matter how pretty your website is if no one can ever find it! We’ll spare you the deep dive into this incredible concept and tell you that your TONIC site comes primed for your keyword ranking. If you’d like to learn more about how you can set your website up for SEO success, view the articles below or check out our friend Ryan's killer SEO course / other resources with our discount.
05 / LAUNCH
You’re ready to debut your new website to the world! All that is left to do is submit your launch request to the Showit team and celebrate! Once you submit your launch request to Showit will provide you more info and are available if you need help in the process. There’s nothing like letting the pros do the hard work for you. ;)
Our VERY favorite thing is being able to celebrate with you when your site goes live! We can feature you on our Instagram if you use the hashtag #toniclaunch and tag us in your launch post, which is great, but here are a few other quick ways to get featured on our site and beyond (and just get a MAJOR virtual high five from our whole team!)
SUBMIT YOUR SITE TO BE FEATURED
GET THE LAUNCH KIT
Oh hey, we made you something! Since you've got a pretty TONIC website template, why not some pretty Canva graphic templates to LAUNCH your TONIC website template? Just add your screenshots or screen recordings, customize with your fonts and make sure you tag us in the result (bonus points if you include a little "WHY I LOVE TONIC SO MUCH" review. *WINK*)
Just fill out a short little form for us and you'll get your kit!
Great question! So great, in fact that we recorded a quick video to show you. Watch that here!
You'll have some help with this from SHOWIT! Here's a quick tutorial for that.
Showit's galleries are some of their most developed features! Here's a quick tutorial on how to add / arrange images in a gallery, and here's a walk through Jen recorded just for you to show you how our TONIC galleries are set up!
Your Showit subscription includes hosting for both your site and blog, use of the software to customize and manage your site and tech support along the way. We typically recommend the middle tier — if you plan to blog — and that is priced at $29 per month (or $288 billed annually). More information on their pricing options can be found HERE. NOTE: If you want to add your own Wordpress plugins to your site, you'll need the Advanced Blog option -- the top one!
We totally understand that the Wordpress + Showit relationship can be confusing! So, you will have a Wordpress.org account, and you will upload, schedule and publish content from your Wordpress dashboard like normal. Basically, you get all the power of Wordpress for blogging, but you can customize the blog design and make it pretty, in the awesome, super-easy-to-navigate Showit platform. Your published blog content ties directly into your design. Check out this tutorial on how the two platforms work together. And Showit will actually get this all set for you, once your site is launch ready. Here’s more on how to request your blog setup!
To connect that opt-in site canvas to an email list — you will need an email marketing platform, like FloDesk, to connect that form to build your list + deliver your freebie.
You will want to use the "inline form" option when setting up your form in FloDesk! And then you will remove the existing placeholder boxes for Name, Email, and the button only on the form already built into your design, and instead embed your form in its place instead. Here's more on how FloDesk x Showit works together. And here's a tutorial from our friend Ryan on how to create + embed that form, too!
Have no fear! If you need more design support, you can always post in our TONIC Regular Facebook group, the SHOWIT Facebook group, or email us for some recommendations! <3 For more technical support questions, you can hit the live chat button in Showit or email our killer support team at firstname.lastname@example.org.
Frequently Asked Questions
Don't miss our killer resources page that gives you our best... resources (duh) for images, graphics, tools and everything else we recommend for your site!
Once your site is launch-ready, you can let the Showit support team know by hopping into the in-app chat, and they will migrate your blog over to your new site (if applicable) and provide instructions to get your domain settings all situated! They are so great at helping with all of that icky backend stuff! Want the full rundown on launching your site? Click here.
It’s best practice to request the domain connection when you’re ready for the site to be live! If you’d prefer to create a “coming soon”page instead, here’s more information on how to do that (it takes, like, two minutes)! That way, you can connect your domain, but still work on your full design in the background — on unveiling it once you’re ready!
Showit has fantastic live chat support in the app, but also an invaluable helpdesk with tutorials for almost everything.
Come build your site with us in our exclusive Tonic Regulars Facebook Group. We can't wait to have you!
Have a question pertaining more to the design of your site that live chat couldn't answer? Email us!
Need Some Help?
Get all of our favorite tips and tools, from building your site, developing your brand, writing copy, adding images, and even running your business a little bit more smoothly.