July 4, 2023
Prefer to watch (in German)?
Hack 1: Start with fonts and colours
Before you do anything else in Showit, start by setting up all of your website’s colours and fonts. To do so, go to app.showit.co and log in. Go to DESIGN SETTINGS in the upper left corner and set all of your site styles:
Once you set that up you’ll be able to use all the colours and fonts just by clicking on them in the panel on the right:
Hack 2: Prepare all your images BEFORE you start building
Rather than uploading one photo at a time whenever it is needed in your website building process, upload ALL of them at the same time BEFORE you even start with the website design.
And before you upload them don’t forget to name and resize them correctly.
I have an entire blog post on how to to that: How to format images for you Showit website.
Hack 3: Use the align buttons
As simple as it may seem, use these buttons in the control panel on the right:
They are your best friends for alignment purposes. Select the objects you want to align and the ALIGNMENT-section is going to come up on the right.
Hack 4: Use site canvases
You need to understand that there are 2 types of canvases in Showit:
- PAGE CANVASES: These are the “normal” canvases that you will use on a more regular basis for your website. These are sections that are too different to re-use them in other areas of your website.
- SITE CANVASES: These are used for canvases that appear several times throughout your website – e.g. the header or the footer, a navigation bar, or a newsletter opt-in canvas.
How can you tell if a canvas is a page or a site canvas? They look kind of shaded:
Once you click on EDIT FOOTER (blue button) the site canvas will show up separately and whatever edits you make to it will be changed on all the footer site canvases on your entire website. This means you won’t have to edit every single footer manually:
How do you convert a page canvas into a site canvas? Simple! Just click on the 3 dots next to the page canvas name and choose CONVERT TO SITE CANVAS:
Hack 5: Do the mobile version parallelly
When you design a new page on your website, don’t forget the mobile version! If you design the entire page of the desktop version and then go to the mobile version you’ll find pure chaos with all the little bits and peaces all over the place. Don’t try it, just believe me! It is not fun!
Therefore, I recommend to do one canvas at a time – in desktop AND mobile version, or even having the mobile and desktop version open at the same time and work parallelly.
Hack 6: Button design
Hack 6 is kind of related to hack 5 in that it is about working on the desktop AND mobile version.
If you design a button in your desktop version that you want to use multiple times throughout one page you can simply copy paste it. However, don’t just do that before designing the button in the mobile version as well!
Design your button in the desktop version, then design the same button in the mobile version. So, if you copy paste the button now it will already have the design you want it to have and you won’t need to re-design every single button.
Hack 7: Use the help docs in the Showit help centre
Honestly, I love the help centre! They’ve got help docs about basically any design topic you could wish for. Every time I get stuck I pop by and brows all their resources, and most of the times I find out what I wanted to find out. And for all my other questions I use the chat function to write them a message. They respond within a few hours, sometimes even minutes (depending on the time of day) and are super nice and supportive.
