How can I center and space my custom contact form sections?

Store Design
1

Hey guys,

I used the code from this shopify link to create my own contact form for customers to send me suggestions through an email https://shopify.dev/themes/customer-engagement/add-contact-form

I was able to customize the inputs to fit my needs but I don’t like how it is completely left aligned and would rather it be centered. In a perfect world I would also like more space between each section.

If it has to be left aligned, that is fine I just want it to be in the center of the blue bar.

Also is there any way to tie it to a specific email?

Any help would be amazing, thank you

IndraV_0-1665414916222.png
IndraV_0-1665414916222.png1244×352 5.86 KB

2

Hello,

you have to add a div to wrap all your form.

In the code below i’ve used the example you used and only added the first and last line. (

and
)

The style=“margin:auto” is what allowing the div to be centered.

3

Thank you for your answer! I wonder if I am not placing it in the right place. Here is new code, let me know if that is correct because it didn’t change in appearance when I used a div

{% form ‘contact’ %}
{{ form.errors | default_errors }}

First name
Last name
Email
Suggested Cause
Soap Idea
Message

{% endform %}

4

Theme is Mojave, if that matters

5

Do you have a link to share where we can see the problem ?

6

I ended up getting permissions from the client to download a form builder app, but I appreciate your help!