I just recently installed the Improved Contact Form app. Setting it up was easy but I have no idea how to edit the html so that the format fits correctly on the contact us page. I'm using the Venture theme. It's placed all the way to the left, can barely see the Send Message button.
Here's how it currently looks like,
I want to make my contact form to look something like this,
Liz here, A Shopify Support Guru :)
Venture uses a full page width to display content so its pulling content all the way to the left based on the rules of the theme.
You can edit this though with a bit of HTML coding within the apps settings under Contact Page Settings. In this example I've followed Ventures class rules and included a <div class="content-block"> before the form ( in the Before Form section) and before <div id="col-main" class="content"> and then closed the </div> in the After Form section. This pushed the form off the wall of the page but kept the content left justified. You can of course go further and style it whichever way you like and add any class rules to your theme.scss.liquid file in Edit HTML/CSS section within your theme settings.
Do let me know if you have any questions! Hope this helps :)
Liz L | Shopify Guru
Hi Liz L (and anyone else working on this),
I'm having trouble getting this fix to work in the Debut theme. Do you know if I need completely different code for that theme? Or perhaps I am not entering the commands correctly? Note that I do not know html, css, etc.
When I enter the code as shown, my contact form remains fully flush to the left (like it was for ebizguy).
Thanks for any help you can offer!
The code that works for debut is:
put that into the "before" box and put
in the after box.
I took a screenshot and added it as well, for clarity sake.