GETTING STARTED

WELCOME TO YOUR NEW TONIC SITE!

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!

Next, sign into your account HERE and click on the "Sharekeys" tab in the left-hand sidebar. Copy the corresponding sharekey to your clipboard.

If you don't have one already, head on over to Showit and create an account. Be sure to take advantage of the free 14 day trial. When you're ready to subscribe, use the code  "TonicPremium20" to save 20% on your annual subscription. We typically suggest the middle tier account unless you need fancy Wordpress plugins.

If this is your first time using Showit, login at app.showit.co, toggle past the free Showit designs to "Your designs."

If it's not your first Showit rodeo, simply login to your Showit account at app.showit.co, click "Create A New Design."

Next, paste the share key you copied into the dialog box. Boom! Hello, sexy new website. Now, keep scrolling ...

How to Install Your Pretty New Template

First things first

01. Create a showit account

02. Access your TONIC design sharekey

03. install your design into Showt

01 / PREP

how to set yourself up for success... because when you start with intention, you create with purpose.

Branding

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!

Images

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: 

Copy

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.

resources from copywriters we love:

Learning Showit

Feeling a little lost with Showit? No problem. Learn everything you need to know about Showit in less than 30 minutes. Click here to learn the basics of Showit.

And if you need help along the way, access the VERY NICE, very actually helpful Showit support team directly via chat or browse their library of 300+ help documents to help you build and launch your site. Both buttons are located at the bottom right-hand corner of the Showit window:





Oh, and don't forget, there's a Showit Facebook group of almost 10,000 users — it's a great place to ask questions or just search for what you're looking for!

02 / DESIGN

TIME TO START MiXING UP THE eLEMENTs. OH BOY, THIS IS GOING TO BE GOOD.

Before You Begin Customizing...

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! 

Set Up Fonts and Colors

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.

How to add custom fonts →

How to edit design settings for font and colors  →

Integrate Your Copy

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.

How to add and format text →

03 / EXPERIENCE

a few of the nitty gritty things you'll want to know about your site.

Mobile / Desktop Views

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:

how to make MOBILE VS. DESKTOP changes →

Portfolio / Galleries

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."

How to add images to a gallery →

TONic galleries 101  →

Canvas Views

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. 

Even more about how canvas views work →

04 / PRE-LAUNCH

before you pop the champagne.

Test, Test, Test...

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.

how to get your website preview link →

Don’t Delete, Hide.

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!

How to hide elements →

SEO, BABY

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. 

What is SEO and why is it important? →

How to use Showit SEO tools for your website  →

How to use Showit SEO tools for your blog →

05 / LAUNCH

it's time to release that beautiful site out into the world!

How to Go LIVE:

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. ;)

How to submit your launch request to Showit →

the cocktail to drink after you do that →

Launch, Celebrate, Champagne, etc.

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!)

post your site in the TONIC regulars facebook group →

email us when you're live →

SUBMIT YOUR SITE TO BE FEATURED

actual footage of us

GET THE LAUNCH KIT

Get Your *Free* Launch Graphics + Planner!

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!

yourdomain.com

WE MADE YOU SOMETHING!

HOW DOES THE BLOG DESIGN WORK? 

Great question! So great, in fact that we recorded a quick video to show you. Watch that here!

WHO SETS UP MY DOMAIN?

You'll have some help with this from SHOWIT! Here's a quick tutorial for that. 

HOW DO THE GALLERIES WORK?

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!

Which Showit subscription option do I need?

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! 

HOW DOES the actual blogging part work with showit + Tonic?

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

How do I make use of the opt-in forms in my design to build my list? 

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! 

How do I integrate a quiz into my design? 

Ohh, we LOVE a quiz! We recommend you use Interact to create your quiz for lead generation. Here's an article from Showit that explains how to add an Interact quiz to your site, too. 

WHAT IF I GET OVERWHELMED / NEED HELP / want to outsource?

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 help@tonicsiteshop.com.

Frequently Asked Questions

I want to add new fonts / pretty images. where can i find some?

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! 

What is the process to launch my site/get it live

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! 

01

Get support

Showit Support

Showit has fantastic live chat support in the app, but also an invaluable helpdesk with tutorials for almost everything. 

02

Request Access

Join the Group

Come build your site with us in our exclusive Tonic Regulars Facebook Group. We can't wait to have you!

03

Send a note

Email Us

Have a question pertaining more to the design of your site that live chat couldn't answer? Email us!

Need Some Help?

Don't worry, we got you, boo!

The Tonic Resource Library

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.

visit resources

We can't wait to click glasses with you!

We're so grateful to have you among our TONIC Regulars and can't wait to see you in your new online digs. If there's anything we can do to help you along the way, don't hesitate to reach out.

QUESTIONS? EMAIL US

THANK YOU!