SIGN UP

Button Style / Placement

By: mich h | Asked: 11/15/2023
Forums › Category: General questions › Button Style / Placement
0 Vote Up Vote Down
mich h asked 8 months ago
Hi! can anyone give me some direction on how to edit/style buttons with a field like the one attached?  
Attachments
button_style_sample.png
1 Answers
0 Vote Up Vote Down
Victor Font answered 8 months ago
That's all done through CSS. Formidable's field container uses CSS grid for formatting. If you're not familiar with CSS grid, imagine it working like a spreadsheet. By default, the grid consists of twelve columns and each field is placed in its own dedicated "cell", so to speak. When you add a class to Formidable field in the builder, that class determines the "column-spread" for the field placement. In other words, if you frm_half to a field's CSS layout class, the field takes up 6 grid columns or half the row. Here's a good tutorial on CSS Grid: https://css-tricks.com/snippets/css/complete-guide-grid/. I'll complete my answer in the comment below.
Victor Font replied 8 months ago

From your example, it appears that you want the button overlapping the entry field. Yes, you can do this, but it's tricky when CSS grid is involved because both components have to be in the same grid element to overlap like that. You can adjust Formidable's grid structure with custom CSS to to bring two fields close to each other, but I don't believe you can make them overlap. I've never been asked to fulfill a requirement like this to try it, so I could be wrong. Maybe someone can figure out a way to it.

If it's a "must have" requirement and it can't be done ig CSS grid, then you may need to create a custom field that includes both components and the CSS to make them work together. Or, you might be able to do it with a custom shortcode in a Formidable HTML field. I would try the custom shortcode first. Not anyone can build a custom field and at best a custom field in the US would probably cost $5k or higher USD to construct. At least, that's I would charge as a minimum if you contracted with my agency.

Good luck on this. I wish you the best getting this requirement fulfilled. If there's something else I can help you with, please ask.

Making the Best WordPress Plugin even better - Together

Take on bigger projects with confidence knowing you have access to an entire community of Formidable Experts and Professionals who have your back when the going gets tough. You got this!
Join the community
crossarrow-right