Editing/ reformatting long list of values on a form

Tom_Kerlin2
Level 8

Editing/ reformatting long list of values on a form

Hi,

I have a form with a really long list of product values. The field type is set to be a check-box (see below).

Is there any way to split this list into columns to make the form more user-friendly and also fill the empty space?

pastedImage_0.png

Thanks,

Tom

Tom Kerlin
17 REPLIES 17
Grégoire_Miche2
Level 10

Re: Editing/ reformatting long list of values on a form

Hi Tom,

I would probably look into the CSS to display them in 2 or 3 columns and in a responsive way.

-Greg

Tom_Kerlin2
Level 8

Re: Editing/ reformatting long list of values on a form

Thanks Greg,

How can I edit the HTML/CSS in an individual Landing Page if I'm using a global template in design studio?

Tom Kerlin
Grégoire_Miche2
Level 10

Re: Editing/ reformatting long list of values on a form

Hi Tom,

You will have to add some styles that will use the form id in the css styles. you styles will look like:

#mktoForm_XXXX .mktoCheckboxList .mktoField {

     width:20px !important;

     float:left !important;

}

#mktoForm_XXXX .mktoCheckboxList label {

     width:26% !important;

     float:left !important;

     margin-left: 5px !important;

}

where XXXX is your form ID. This is not tested, so it may need some adjustments.

-Greg

Tom_Kerlin2
Level 8

Re: Editing/ reformatting long list of values on a form

Thanks Greg,

Where can I find the Form ID? I could only find something like that listed under "embed code" option.

Tom Kerlin
Grégoire_Miche2
Level 10

Re: Editing/ reformatting long list of values on a form

Hi Tom,

You can find it on the landing page code. display the page in your browser and access the page code, then search for mktoForm_

the other possibility is to go to Marketo, on the form, and then form actions -> embed code. The 4 digits will appear in the JS.

-Greg

cjb-csdental
Level 1

Re: Editing/ reformatting long list of values on a form

Is there a way to modify this so that the Mobile version does not crowd the selections/columns? 

TheCandaceB
Jo_Pitts1
Level 10 - Community Advisor

Re: Editing/ reformatting long list of values on a form

@cjb-csdental ,

can you give a visual example of what you have, and what you want?

Cheers

Jo

Erin_Cavanaugh
Level 3

Re: Editing/ reformatting long list of values on a form

You should be able to put this into columns. Try dragging "Card Payments" to the right of "Active View" You should see an orange arrow.

SanfordWhiteman
Level 10 - Community Moderator

Re: Editing/ reformatting long list of values on a form

The Checkboxes data type (which I think Tom is using, even though he said Checkbox) doesn't allow repositioning that way, AFAIK.  You have to use CSS to column-ize it.