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.