Remove H1 Tag from Subscribe Form

[mode500]

According to a CEO review of my site it appears that I have two H1 tags on my pages. I would like to remove the H1 tag from the SUBSCRIBE title on my site.

My site is : https://www.mode500.com

I actually have this CSS in place for my Subscribe form styling:

/* – FORM STYLING – /
/ SUBSCRIBE FORM HEADER */
.x-subscribe-form h2 {
font-family: Roboto, sans-serif!important;
font-weight: 300!important;
letter-spacing: 0.2em!important;
}

But even changing the styling to H2 tag hasn’t changed anything, and yes I have deleted cache etc.

Thanks

[marc_a]

Hi @mode500,

Thanks for reaching out!

To change the h1 of the form title will require some customization and a lot of steps. To fix your issue about the double H1 tag on your page. I suggest that you disable the form tile in the email form.

Then on your homepage, just add a text element above the form to add the subscribe text. In that way, we can eliminate the double H1 for SEO purposes.

Hope that helps.

Thank you.

[mode500]

Thank you, however, I am kind of lost because this is all that I see when attempting to edit it. Something seems amiss here wouldn’t you agree?

[mode500]

Okay, it appears that the plug in was an older version after a search of the forum for a similar issue and finding some type of resolve here: Extension plugin on home page appears as h1

However after following the instructions I have now lost my original Subscribe form and all of its styling. Please advise how I can get my form back in its original context without having to start all over again.

Thanks

[marc_a]

Hi @mode500,

I am not quite sure why the styling of your subscribe form is gone when you update the plugin. The only thing we can get back the styling and content of your form is restoring a backup where the form is still working. If you don’t have any backup, the worst-case scenario, you need to do it again from scratch.

Thank you.

[mode500]

Hi,

I have the original subscribe form on my testing site but just want to be able to copy that element over to my normal site. I have attached screenshots of 1: How it was originally and still is on my Testing Site and 2: How it now is at present on my normal site. Please advise, thank you!

[mode500]

Okay I have managed to sort of get it back by creating a new form. However it is giving me two input fields and the styling is completely messed up. See attached screenshot.

Here is the original CSS code also:

/* – FORM STYLING – /
/ SUBSCRIBE FORM HEADER /
.x-subscribe-form h2 {
font-family: Roboto, sans-serif!important;
font-weight: 300!important;
letter-spacing: 0.2em!important;
}
/ SUBSCRIBE FORM/WIDGET STYLING */
@media (min-width:480px){
.x-subscribe-form fieldset {
vertical-align: top;
width: 49%;
float: left;
margin-right: 4px;
}
.x-colophon.top .x-subscribe-form {
margin: 0 auto;
display: block;
text-align: center;
}
.x-colophon .widget ul li {
text-align: center;
}
.x-colophon.top {
padding: 0px 0px;
background-color: #2f2f31 !important;
}
.x-subscribe-form {
max-width: 100% !important;
}
.x-subscribe-form fieldset {
display: inline;
}
.x-subscribe-form input[type=“submit”] {
margin-top: 0 !important;
height: 37px;
}
.x-subscribe-form input[type=“email”] {
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}
.x-subscribe-form fieldset {
width: 50%;
margin-right: 0;
}
footer.x-colophon.top>div {
padding: 0 5%;
width: 100%;
max-width: initial;
}

[ruenel]

Hello @mode500,

Please edit your Email Form. In your form settings, turn OFF the name so that there will only be the email field and the submit button.

If this is not helping, provide us the URL of the page where we can see the form.

Thanks.

[mode500]

Okay thank you. I have managed to do a complete new Footer for my site, however couple of questions still remain.

1: From the above CSS in this thread, can I ask what CSS is no longer needed considering that it is a completely new Subscribe Form and that it is now two sections above and below one another, instead of side by side. I would also like to know what code I need in order to change the colour of the button, thank you.

2: What is the easiest way for me to duplicate the whole button, as I would like the payment card graphics to show only on my store-related pages and not my whole site, but other than that I would like the footer to remain the same.

Thanks

[ruenel]

Hello @mode500,

1.) You can remove this block:

.x-subscribe-form fieldset {
vertical-align: top;
width: 49%;
float: left;
margin-right: 4px;
}

 .x-subscribe-form fieldset {
display: inline;
}

.x-subscribe-form fieldset {
width: 50%;
margin-right: 0;
}

The color of the button can be tweaked in the Email Form Settings. Enable the “Custom Styling” option so that the Appearance (Form) meta box will appear below.

2.) For the payment card graphics, you can actually add a condition in the bar settings, Bar > Customize, that it will only display in WooCommerce related pages.

Hope this helps.

[mode500]

I only get that option for the whole of the footer and not just the payment card graphics element. The payment card graphic is as such:

[ruenel]

Hello @mode500,

You should select or click the “Payments” bar settings and not the Image element. If nothing is helping, provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
- Confirmation that we can access and make changes to your site
​
To know how to create a secure note, please check this out: How The Forum Works

Best Regards.

[mode500]

Please see above for my details. Thank you.

[ruenel]

Hello @mode500,

You will have to scroll to the bottom to find the WooCommerce related conditions. I went ahead and made the changes. I added a condition to your “Payments” bar settings.

The conditions are now working:

Kindly check your footer now.

[mode500]

Okay thank you but what do you mean by ‘You will have to scroll to the bottom to find the WooCommerce related conditions.’ as I just don’t see anything like the set up with the ID/Class/Etc options like you have shown me in the screenshot?

[ruenel]

Hello @mode500,

The condition is in the Customize tab of the Payments bar settings.

Hope this helps.