top of page
  • Writer's pictureVirtual Angie

Animate your Client Portal Banner in Dubsado

Updated: Sep 19, 2023

One of the features I love about Dubsado is the ability to customise and brand forms to reflect your business. Since their new form builder has arrived, it is easier than ever to do this and by using design software such as Canva, you can design some pretty unique questionnaires and proposals for your clients. Add CSS into the mix, well the world is your oyster.

Animate your Dubsado Client Portal

The client portal in Dubsado is also a favorite with me. However, the design capabilities of it, not so much. You have the ability to put in a header, or banner (1800 x 160px for desktop, 700 x 200px for mobile, bear in mind these can change depending on screen size) and choose the text and tab colours. That’s pretty much it. You can create the banner in Canva but it won’t be responsive and you’re limited on space. A little bit boring!

Until now. Let’s go back to forms for a sec. Without CSS, no matter how you design the form elements in Canva, they will be static. Unless you use GIF animation in your elements! The same can be done with your Dubsado client portal headers!

Now, I don’t mean those silly animations you see in memes. I mean actually creating some in Canva itself. Canva has a great guide here but I’ve created a video below.

Designing your animated portal banner

Remember that simplicity is key: Your portal banner should never be too busy as it can detract from the purpose of the portal itself. When designing your banner, ensure there isn’t too much going on. One animated element is probably enough to make it really pop. Also, the animation itself will run on a loop which may get annoying depending on the size and what the animation is. Don't worry though, I have a solution for that too!

If you’re feeling adventurous, you can actually set it so the animation only runs so many times before becoming static again. This involves utilising another website and uploading your image to it but once you know how, it's pretty simple and it means that your GIF animation won't run for infinity and annoy the ish out of your clients!

After uploading, do make sure you check how it appears on various devices and make any necessary edits to make it cohesive with your brand. If the dimensions aren't quite right for your screen, just have a play around with the sizing on Canva.

Don't fancy doing it yourself? Check out my ready made templates that you can download and edit for your brand in my Etsy store here. Take a look below.

Like the idea of a portal for your clients? Why not check out Dubsado, an all in one CRM focused on automating your mundane business tasks, saving YOU time and giving your clients that all important WOW experience? You can even save 30% on your first month or year using my affiliate link here*.

*This is an affiliate link that if used will give me a small commission at no additional cost to you.


bottom of page