Theme Designer

Theme Designer


Hello, Kane here to take you through the ins
and outs of the Theme Designer in Wufoo. The theme designer is the hub where you can
make your forms beautiful and customize them for your specific needs. The possibilities are almost endless, but
some of the ace things you can do here are add a logo, change the background and add
your own CSS. We’ll go through how to use the theme designer
to make your forms look nice and show you how to apply the themes to your forms. The easiest way to get there would be to click
the “Themes” tab at the top of your page. If you’re creating a form, you can also
click the “Apply Theme” tab at the bottom of your page and click to create a new one. Once you arrive, you’ll see a plain old
white and grey form. If you’ve not got loads of time on your
hands, click the tab at the bottom of the page here. That will take you to the theme gallery where
you can pick from a bunch of our pre-created themes and add them to your account. Otherwise, you’ve got a blank canvas to
paint. At the top of your page, you can choose to
create a new theme or edit an existing theme here. We’ll create a new one and then move onto
the Properties. Things get pretty easy from here. If we choose the Logo option, another section
will show up where we can either keep the Wufoo logo, have no logo at all, choose from
some stock logos we made for you or add your own. If we choose to add our own, we’ll be able
to grab an image from the internet and apply it here. The default width of a form is 640px, so you’ll
want to make your image be that width or smaller. The height can be altered here. You’ll also notice that as we add to the
theme, the form below begins to take shape so we can see exactly how the form will look
in real time. Back to the properties and the Backgrounds
section will allow us to change the colours of the form. The wallpaper is arguably the most important. Once again, if you click on that another section
will show up. We can choose to have a solid colour in which
we’ll give you a bunch to pick from, but you can literally add any colour you’d like
by changing the hex code over here. You can add your own background image with
a custom pattern or you can choose from some of the stock backgrounds we made for you. You’ll see the exact same in the header
and the rest of the parts of the form will allow you to choose a solid colour. Typography is next, where you can change the
fonts, styles, size and colour of all the text in your form. From the title to the instructions and everywhere
in between. A lovely addition to this is if you click
on the font, you not only have a choice of loads of great fonts we have for you, but
you can also add fonts from TypeKit to customize things even more. Borders will let you change the colour, style
and size of the borders to each part of your form. IF you click on Shadows, you can turn them
on or off. The buttons tab will let you change the Submit
button in your form. You can either change what the Submit button
says or, you can embed an image as your submit button. Finally, the Advanced tab will let you add
your own CSS stylesheet to your theme. So if there’s something you can’t do in
the normal theme designer such as curving the fields, you can code it yourself and upload
it to your theme. Pretty cool. When you’re done, make sure to click the
“Save Theme” tab up here. You’ll be asked to name it. Then you can click the “Forms” tab at
the top of your page to get back to the form manager. Apply the theme to your form via the dropdown
on the right side of your page. View the form and you’ll see your lovely
new theme applied to it. Adding your own theme to a form is a perfect
way to make the user experience more enjoyable and just make your form pretty. Check it out.


One thought on “Theme Designer

Leave a Reply

Your email address will not be published. Required fields are marked *