How can I add styling like font color, italics, etc to my forms?

form-design

(DavidM) #1

Not sure where to put this; it's not a document per se - it is an example form of formatting that may be of use to others. The attached form (ODK1) gives 14 examples of html and markdown used to format an ODK Collect form.
Most of the information is already available on the Nafundi website, I just find it useful to have on my device in a form.

MarkdownExamples.xlsx (26.4 KB)
MarkdownExamples.xml (9.4 KB)


Docs are live; contributors guide
(Hélène Martin) #2

Thanks, @DavidM, this is great! I've split it out into its own question so it's more likely to come up if anyone searches for styling examples. Feel free to modify the title if you come up with a better one.

I've also filed an issue for the documentation to incorporate your example form. https://github.com/opendatakit/docs/issues/627


(Pierre Grandidier) #3

This is a great initiative! Thanks @DavidM
Is there a way that this markdown form could be compatible with Enketo too?


(Yaw Anokwa) #4

It probably is compatible. Have you tried?


(DavidM) #5

Hi Pierre - It will work with Enketo as this utilises the same XForm base and basic mobile client. I built this with XLSForm which is also recommended by Enketo.


(Pierre Grandidier) #6

Hi!
@yanokwa and @DavidM
The compatibility is not full, especially for choices.
See here: https://ee.humanitarianresponse.info/preview/::YKAl
The paragraph "Formatting works on labels for Choices also."


(danbjoseph) #7

i posted an issue on GitHub


(DavidM) #8

Thanks Pierre,
I will update the thread with the info. Weirdlg it looks like some of the basic html isn't working (such as
). It might be worth you sharing your results on their forum to get a response? You have got a few formatting options at least :slight_smile:


#9

Just reviving this thread as I was trying to format choices for ODK Collect (v1.18.1) and it is not working. Tried also to preview in Enketo through the XML generated from https://opendatakit.org/xlsform/ and it's not working either. Has the markdown for choices been fixed?


(Grzegorz Orczykowski) #10

Hi @techGus

could you attach your form? We had a bug with styling choices in v1.18.0 but i's fixed in v1.18.1 so everything should be fine.


#11

@Grzesiek2010

I just found out that the issue is with the compact appearance tag. When I removed it, the colors showed as expected. Enabling the compact appearance makes the label show with all the HTML.

Not sure if this is an expected behavior or if this was overlooked and the documentation doesn't specifically say that colors for choices only works for the normal list appearance.


(Grzegorz Orczykowski) #12

You are right that's an issue with the compact appearance. We have never supported form styling with the compact appearance. I'll file an issue in our repository.

Do you really need to use styling with the compact appearance or it's just a bug you have run into accidentally?