Video summary
Add your logo
To add your company's logo to the checkout, please click on Edit in the Checkout App as shown in the screenshot below:
Give your Checkout a name and up and click on the circle to upload a logo of your choice. Once you have successfully uploaded the logo, click on Done.
Change the color and style of your checkout
In the Checkout App, select Settings in the header bar. Next to Color and style, you click on Edit.
Here you can change any color and style according to your wishes. You can choose whether you would like to have the corners of your buttons and fields sharp, round, or half-round.
You can also adjust the colors of the backgrounds, texts and borders. To change a color, you can either drag and drop the little circle across the surface and along the color bar, or simply paste a color code (in case you are following a corporate style guide and want to hit exactly the right color). If you would like to enter a color code, you can use the little arrows to switch between the formats Hex, RGB and HSL.
Once you are done, click on Close in the upper right corner. You do not need to save anything, any change you make will be saved automatically. Be careful to not accidentally click the Button Reset Styles at bottom, as this will delete your changes and reset your Checkout to the standard style.
Last but not least, click on the little switch to activate your changes (it should turn green when you click it).
Test your changes
If you want to get an idea of what the result looks like, go to Channels and copy the Direct Link by clicking on Copy.
Paste the link into your browser to see what you checkout would look like. If you are not quite happy with the result, you can always go back and make more changes. As soon as you have clicked Close and refreshed the page, you will see the changes (if you don't see them, try emptying your browser cache).
Do you have trouble figuring out which color field changes what?
This example may help you to get the hang of it faster:
Header Options
Page Options
(Link = the text color of any links you may have in your checkout, for instance links to data policy or other legal information)
Button Options
(Deactivated = the color a button will have if it is not clickable yet, for instance because mandatory information has not been entered yet)
Input Options
