Dawn Theme - Change Title Position of Contact Form

Store Design
,
1

I would like to adjust the position of the heading so that it is roughly in the same position as the heading of the “About Us” example. Does anyone have an idea how I can do this?

www.taskslider.de

PW: nonsense

14.png
14.png1111×613 11 KB

12.png
12.png1102×652 31.4 KB

2

Hi @Roxolot ,

Try this.

  1. From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  2. Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  3. In the “Assets” folder, click on “base.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
  4. And Save.
form#ContactForm {
    padding-top: 0px;
}
3

16.png
16.png1361×593 10.4 KB

Unfortunately, that is not exactly what I mean. I have now increased the distance from the top and would like to reduce the gap between the input fields and the heading so that it looks like the other example.

4

Yes, that is what Ive understand the code is not for increasing its for decreasing.

Ribe_Dagandara_1-1686681951905.png
Ribe_Dagandara_1-1686681951905.png1306×485 85.9 KB

This area what you mean right?

If you know a bit of coding this is the div.. the one making the space is the padding so what I do, I reduce the padding on top to clean the white space between them.

Ribe_Dagandara_2-1686682124632.png
Ribe_Dagandara_2-1686682124632.png1084×518 31.5 KB

5

If that code doesnt work you cant try this one.

.contact.page-width.page-width--narrow.section-template--19011405775181__form-padding form#ContactForm {
    padding-top: 0px;
}

I hope it help.

6

@Roxolot

Hello,

Please add the below code above in theme.liquid

online store >> edit code >> theme.liquid

.contact h2.title.title-wrapper--no-top-margin.inline-richtext.h1 { padding: 0 70px; }

after added the given code store looks like this.

shreyhweb_0-1686682406999.png
shreyhweb_0-1686682406999.png1920×932 29 KB

If our solution is helpful for you then Please like the post and tap on accepted.

If you want to discuss any further information then please contact us on our whatsapp.

We will always here for your help.

Thankyou :slightly_smiling_face:

7

Thanks a lot. It works

8

Welcome. Good to hear, happy to help. :blush: