Customize your ODK forms with fonts, colors, etc

Hi all,

I just wrote up quick instructions on how to add fonts, colors, sizes,
and tappable links to ODK forms.

You can find the post at
https://nafundi.com/blog/posts/customize-odk-forms-with-fonts-colors-sizes-and-links.

This feature only works in ODK Collect 1.4.9 and later, so upgrade to
the latest version of Collect and give the demo form a try!

Thanks,

Yaw

··· -- Need ODK consultants? Nafundi provides form design, server setup, in-field training, and software development for ODK. Go to https://nafundi.com to get started.
3 Likes

That is GREAT! You guys at Nafundi are really doing an* A+ job*. Many
many thanks from community.
Curtis Broderick
EpiConcept, Paris, France

··· 2016-05-04 14:52 GMT+02:00 Yaw Anokwa :

Hi all,

I just wrote up quick instructions on how to add fonts, colors, sizes,
and tappable links to ODK forms.

You can find the post at

https://nafundi.com/blog/posts/customize-odk-forms-with-fonts-colors-sizes-and-links
.

This feature only works in ODK Collect 1.4.9 and later, so upgrade to
the latest version of Collect and give the demo form a try!

Thanks,

Yaw

Need ODK consultants? Nafundi provides form design, server setup,
in-field training, and software development for ODK. Go to
https://nafundi.com to get started.

--

Post: opendatakit@googlegroups.com
Unsubscribe: opendatakit+unsubscribe@googlegroups.com
Options: http://groups.google.com/group/opendatakit?hl=en


You received this message because you are subscribed to the Google Groups
"ODK Community" group.
To unsubscribe from this group and stop receiving emails from it, send an
email to opendatakit+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--

1 Like

Hi! I'm trying to style with some markdown (headers) and font color: <span style="color: red;">**Note:**</span>. But Collect is not parsing headers (# is displayed) and ignoring the span tag and **. I have ODK Collect v1.12.2. Thanks!

Ok, I see that this is happening when you combine html and markdown in the same label. And, rather than using the span tag to change the font color, I used <font color="red">. Like this it worked.

1 Like

Hello sir.
I have a text like this: Welcome to IGIAC soil horizon project
How do I pass it to the syntax for the colour to be green?
Thanks

@Samuel_Nyarko You may use it like this in your XLSForm Label Column:

<span style="color:#f58a1f"> Welcome to IGIAC soil horizon project </span>

You will have to replace the #f58a1f with the appropriate color code. Color codes can be found here: https://www.w3schools.com/colors/colors_picker.asp

Than k you for your reply.
I tried your idea but the color does not change.
Please see screen shorts.


Soil_collect.xlsx (15.0 KB)

NOW CHECK YOUR FILE IS WORKING FINESoil_collect.xlsx (14.9 KB)

Thanks.
But sorry it is still the same.


Thanks.

@Samuel_Nyarko Did you try it on another mobile ?

The problem is that we don't support styling group names: https://github.com/getodk/collect/issues/3433

Hello
I designed a form on xlform and I use kobotools as a deployment and collection server.
I have a problem with displaying color. I am using odk collect version v2022.2.2
How to fix it?

Hi @Romain_TCHAKOUTE

Welcome to the ODK forum. We're glad you're here. When you get a chance, please introduce yourself on this forum thread. I'd also encourage you to add a picture as your avatar because it helps build community!

Please attach your form (xls version) without it we can't tell what is wrong.

1 Like