How can I
-
Move the updates text to the left side and closer to the box.
-
Add a submit to my email signup
How it is currently:
How I would like it to look:
Store link: https://95d536-88.myshopify.com/
Store keycode: www
Topic summary
A user seeks help repositioning the “Updates” text closer to an email signup box and adding a submit button to the form.
Current Issue:
- The “Updates” heading appears too far from the input box
- No submit button exists for the email signup form
Solution Provided:
Navigate to Online Store > Themes > Edit Code and locate the CSS file (base.css, theme.css, or custom.css). Add the following modifications:
- Reposition heading: Apply CSS to
.newsletter__subheading h3with relative positioning (right: 100px, top: 15px) - Add submit button: Insert a button element inside the form tag
- Style the form: Use flexbox layout (display: flex, flex-direction: row, gap: 10px, align-items: center)
- Style the button: Set height to 47px with transparent background and 1px solid grey border
A screenshot demonstrates the expected visual result after implementing these CSS changes.
Here are the steps you can follow:
-
Navigate to Online Store > Themes > Edit Code.
-
Locate and open the base.css (or theme.css, custom.css) file.
-
Paste the code snippet provided below at the bottom of the file, then save your changes.
(Add a button inside the form tag and apply the provided CSS to the form. Also, apply CSS to the subheading class for h3 elements.)
“I am attaching a screenshot below as a reference to illustrate how it should look.”
.newsletter__subheading h3 {
position: relative;
right: 100px;
top: 15px;
}
#contact_form{
display: flex;
flex-direction: row;
gap: 10px;
align-items: center;
}
.button_submit{
height: 47px;
background-color: transparent;
border: 1px solid grey;
}
