This forum is no longer open and is for reading/searching only.

Please use our new MachForm Community Forum instead.

MachForm Community Forums » MachForm 3

Make First/Last name fields larger


  1. jpello
    Member

    Hello,

    I've got a form up and was asked to make the first & last name fields larger... I noticed that is pretty much the only field that doesn't give an option...

    I'm on Machform 3.3

    Posted 13 years ago #
  2. williamansley
    Member

    I'm also curious about how this can be done in Machform 3.3. I assume that you can make this happen by pasting custom CSS code into the Advanced CSS code box in a theme, but I am not sure what this code should be.

    It would be really, really nice if you wonderful people at AppNitro would add a additional control for name fields so that we can set the width, as with text or number fields. As an interim measure, is it possible to change the width of the name fields using a custom CSS class? If so, could you fine people at AppNitro, please, please, pretty please with sugar on top, add custom classes to do this to the next release of Machform?

    Posted 13 years ago #
  3. yuniar

    You need to use CSS code indeed. First check the HTML source of your form.
    You'll find the code for the name field is like this:

    <li id="li_1" >
    <label class="description">Name </label>
    	<span>
    	<input id="element_1_1" name="element_1_1" type="text" class="element text" maxlength="255" size="8" value="" />
    	<label>First</label>
    	</span>
    	<span>
    	<input id="element_1_2" name="element_1_2" type="text" class="element text" maxlength="255" size="14" value="" />
    	<label>Last</label>
    	</span>
    </li>

    the important part is the "id" attribute of the "li" element above. In the above sample, the container "li" element for the name field is having id = "li_1"

    To adjust the size of the first and last name, you can add this CSS code:

    #li_1 input{
      width: 200px;
    }

    paste the code above into the "Advanced CSS" section of your form's theme.

    It's a great idea to put this into the built-in CSS classes. Thank you!
    I'm putting this into our "must-be-done" list for v3.4


    MachForm Founder

    Posted 13 years ago #
  4. williamansley
    Member

    Hurrah!

    Posted 13 years ago #
  5. jpello
    Member

    So.. I checked the documentation on how to add CSS tags to the theme...

    It says"
    On the Theme Editor, click the dropdown on the right top corner and select the “Advanced” menu. You will be prompted to enter your CSS code. Once you have finished, make sure to save your theme to apply any changes."

    Unfortunately, I don't see any "Advanced" settings within the theme editor.

    I see 1 dropdown at the top right that allows me to choose my theme... am I missing something?

    Posted 13 years ago #
  6. yuniar

    You will need to select your theme first. Once your theme is being loaded, you will see the "Advanced" menu item.

    This is actually some kind of bad UI, we're fixing this for v3.4. The "Advanced" menu item should be displayed consistently.


    MachForm Founder

    Posted 13 years ago #
  7. williamansley
    Member

    @yuniar: With regard to my suggestion to add built-in custom CSS classes to make the name fields wider, you said:

    It's a great idea to put this into the built-in CSS classes. Thank you!
    I'm putting this into our "must-be-done" list for v3.4

    However, this never seems to have been done. Did it prove unfeasible to do this after all, or did it just slip between the cracks? If it can be done, could you please add it back to your "must-be-done" list? Thank you.

    Posted 12 years ago #
  8. yuniar

    Sorry, your request is actually still within the todo list. Here is a peek:

    The only problem was the list keep getting larger and larger :(
    We didn't have the chance to complete that one yet. Sorry!


    MachForm Founder

    Posted 12 years ago #

RSS feed for this topic

Reply