The Community forums are being phased out in favor of a new Slack group.
Add your email address below to get an invitation to join the community slack group
Styling the Bootstrap Formidable Pro Form
Hi guys. I bought the Formidable Pro and Bootstrap add-on, because I need a form to be opened in a modal. My problem is, that I don't know how to style the form as I would like to. Formidable Support - which is awesome by the way - told me that I might be lucky with finding someone that would help me out.
Here's the screenshot of the form: http://prntscr.com/f07m7r
The actual form is already set up correctly, I would "just" like it to look like the screenshot I attached:
1. Add top margin, so the modal is centered.
2. Remove the form title, the line underneath.
3. Add some padding/margin inside the form.
I would really love it if someone could help me out. 🙂
Attachment:
April 25, 2017 at 12:38 pm
Have you tried using CSS? I haven't used the Bootstrap add-on, but we have used plain CSS to edit numerous elements of numerous websites.
You can use Firefox's Web Developer Tools (In Firefox, go to Tools --> Web Developer --> Inspecotr) to find the CSS ID's that you need to change. Then, add the CSS in the Formidable Pro's CSS section (Formidable --> Styles --> Custom CSS). So, for example, you could add code similar to this (where 10 is my form's id):
#frm_form_10_container{margin-top: 10% !important;}
This ID may work for padding and margin to.
There's a setting to disable the form title, or you can find the CSS selector for the title and add it to your child theme and use display:none hide it.
Now this would affect every page from 10 is on. Our theme allows for CSS on a page. There are also plugins that enable you to have page-specific css.
Good Luck!
August 29, 2017 at 1:31 pm
How did you go with this? I could absolutely style it as per your screen grab, but you've probably down that by now
Discussion closed.