Design responsive form - How to?

DFG
23 Posts
DFG posted this 03 December 2015

hi

I have designed two form fields and button which looks like I want in Desktop and in Mobile preview.
Goal is to have a responsive form.

Now I have to integrate form html code below, but I do not now how.
Please is there a help available on this ?

desktop

mobile

http://imgur.com/qwpEDgP
http://imgur.com/2UUY99v

<form method="post" action="http://www.gogvo.com/subscribe.php">&lt;input type=&quot;hidden&quot; name=&quot;CampaignCode&quot; value=&quot;xxx&quot;&gt;&lt;input type=&quot;hidden&quot; name=&quot;FormId&quot; value=&quot;xxx&quot;&gt;&lt;input type=&quot;hidden&quot; name=&quot;AffiliateName&quot; value=&quot;xxx&quot;&gt;&lt;input type=&quot;text&quot; name=&quot;FirstName&quot;&gt;&lt;input type=&quot;text&quot; name=&quot;Email&quot;&gt;&lt;input type=&quot;submit&quot; value=&quot;Submit&quot;&gt;</form>

hi I have designed two form fields and button which looks like I want in Desktop and in Mobile preview. Goal is to have a responsive form. Now I have to integrate form html code below, but I do not now how. Please is there a help available on this ? ![desktop][1] ![mobile][2] [1]: http://imgur.com/qwpEDgP [2]: http://imgur.com/2UUY99v http://imgur.com/qwpEDgP http://imgur.com/2UUY99v <form method="post" action="http://www.gogvo.com/subscribe.php">&lt;input type=&quot;hidden&quot; name=&quot;CampaignCode&quot; value=&quot;xxx&quot;&gt;&lt;input type=&quot;hidden&quot; name=&quot;FormId&quot; value=&quot;xxx&quot;&gt;&lt;input type=&quot;hidden&quot; name=&quot;AffiliateName&quot; value=&quot;xxx&quot;&gt;&lt;input type=&quot;text&quot; name=&quot;FirstName&quot;&gt;&lt;input type=&quot;text&quot; name=&quot;Email&quot;&gt;&lt;input type=&quot;submit&quot; value=&quot;Submit&quot;&gt;</form>
Vote to pay developers attention to this features or issue.
5 Comments
Order By: Standard | Newest
DFG
23 Posts
DFG posted this 04 December 2015

I am also attaching section with input boxes and a button.

I am also attaching section with input boxes and a button.
DFG
23 Posts
DFG posted this 04 December 2015

From my research I found that horizontal should be called inline.
Reference: http://www.w3schools.com/bootstrap/bootstrap_forms.asp

So I am asking for a help how to design a responsive inline bootstrap form in Themler?

Thanks!

From my research I found that horizontal should be called inline. Reference: http://www.w3schools.com/bootstrap/bootstrap_forms.asp So I am asking for a help how to design a responsive inline bootstrap form in Themler? Thanks!
Support Team
Support Team posted this 04 December 2015

Hi,

Sorry. I do not see the problem with the attached section. It looks just fine in responsive modes with the default Themler theme. If you have any issues in display, please attach the theme you are working on and also several marked screen shots explaining what should be fixed.

Sincerely,
Hella

Hi, Sorry. I do not see the problem with the attached section. It looks just fine in responsive modes with the default Themler theme. If you have any issues in display, please attach the theme you are working on and also several marked screen shots explaining what should be fixed. Sincerely, Hella
DFG
23 Posts
DFG posted this 04 December 2015

Thanks!
Yes, design looks fine, but when I add HTML form code to this design I have no success to get form work.

My approach was to add part of HTML form code to one column and part to another, and button code to third, but this was just a blind try.

I also experienced that HTML tool automatically close form in first column.

I do not know how to get this form work with attached form HTML code I got from auto responder service.

Is it possible to get help with that please? I hope you understand my goal.

Thanks! Yes, design looks fine, but when I add HTML form code to this design I have no success to get form work. My approach was to add part of HTML form code to one column and part to another, and button code to third, but this was just a blind try. I also experienced that HTML tool automatically close form in first column. I do not know how to get this form work with attached form HTML code I got from auto responder service. Is it possible to get help with that please? I hope you understand my goal.
Support Team
Support Team posted this 09 December 2015

Hi,

Sorry for the delay.
Could you please try adding the following code to the HTML control:

<form method="post" action="http://www.gogvo.com/subscribe.php">
<div class="row bd-row-align-top">
<div class="col-lg-6 col-sm-6">
</div>
<div class="col-lg-6 col-sm-6">
<input type="text" placeholder="Name">
</div>
<div class="col-lg-6 col-sm-6">
<input type="text" placeholder="Email">
</div>
<div class="col-lg-6 col-sm-6 col-xs-24">
<input type="submit" value="Submit" class="data-control-id-1411725 bd-button">
</div>
</div>
</form>

It should help to achieve the same result.

Please keep us posted about the progress.

Thank you,
Olivia

Hi, Sorry for the delay. Could you please try adding the following code to the HTML control: `<form method="post" action="http://www.gogvo.com/subscribe.php">` `<div class="row bd-row-align-top">` `<div class="col-lg-6 col-sm-6">` `</div>` `<div class="col-lg-6 col-sm-6">` `<input type="text" placeholder="Name">` `</div>` `<div class="col-lg-6 col-sm-6">` `<input type="text" placeholder="Email">` `</div>` `<div class="col-lg-6 col-sm-6 col-xs-24">` `<input type="submit" value="Submit" class="data-control-id-1411725 bd-button">` `</div>` `</div>` `</form>` It should help to achieve the same result. Please keep us posted about the progress. Thank you, Olivia
You must log in or register to leave comments