Frontend form HTML markup style

• toniojst

• April 28, 2022 at 3:29 am

Hi all,

soes someone know how i can create frontend form which look like on this image? How i can tell that some field are shown in left column “Card – Product information” and some other field are shown under right column “Card – Pricing”? It is possible this?

• John Huebner

• April 28, 2022 at 1:12 pm

Using ACF?

Create two group fields, one for the left column and one for the right and set the width % of each field.

Inside these groups add a fields and or sub groups and fields. For example the left column would have a “Product Information” group and the right would have a “Pricing” group and an “Organization” group.

Then you would add your fields to one of these sub groups setting the width % as needed for each field.

Looking at your image you would set the display of each group/sub group as block.

Add a healthy dash of custom CSS and possibly a cup of custom JS. There are thing in that form that cannot be achieved with ACF alone.