How to create text over image with button?

Support
#12

Re: 1) Email subscribe box - I don’t have this showing in my dashboard. Is Email Forms the name of the plugin I need to add?

#13

Hi,

  1. Yes the plugin is called Email Forms.

  2. Check the gap elements visibility options, it could be that some gap elements are not visible in desktop

Please also note that you don’t need to add multiple gaps to create a big gap.

You can adjust the size to make it big.

Thanks

#14

Thanks for the Gap info!

There’s no plugin called Email Forms…

#15

Hi There,

Yes its name is Email Forms, it’s under X > Overview > Extensions.


Cheers!

#16

Thanks! Do I need to sign up for a program like Mailchimp before I can add Email Forms? Then will it appear as my Email List for the new form I need to add?

#17

Hi there,

That is correct, the Email Forms plugin is a tool to provide a form which connects to your MailChimp account and you can select a list which you have added to the MailChimp website. For more information:

Thank you.

#18

Thank you! This is how the email form is displaying:

  1. How can I make the boxes horizontal and not vertical?
  2. Can I change the colour of the Subscribe box?
#19

Hi there,

That is the default display of the email form. You can further edit this code as that requires a bit of customization:

.tco-subscribe-form fieldset:nth-child(2),
.tco-subscribe-form fieldset:nth-child(3),
.tco-subscribe-form fieldset:nth-child(4) {
    width: 30%;
    float: left;
    margin-left: 3%;
}

.tco-subscribe-form fieldset:nth-child(2) {
    margin-left: 0;
}

.tco-subscribe-form input[type="submit"] {
    border-color: #ccc !important;
    color: #fff !important;
}

Hope this helps.

#20

Thanks! Where would I put this code? Sorry I’m not very tech-savvy…

I think I am ok with the vertical layout but I would just like to change the colour of the Subscribe box to red. Would I just need to add this code:

.tco-subscribe-form input[type=“submit”] {
border-color: #ccc !important;
color: #fff !important;

Where can I find a list of colours & codes?

#21

Hi There,

To change the subscribe button color, the code would be:

/*Subscribe button default color*/
input[value="Subscribe"] {
	background-color: red;
	border-color: black;
	color: white;
}

/*Subscribe button hover color*/
input[value="Subscribe"]:hover {
	background-color: black;
	border-color: red;
}

You can get a color hex code here.

And you can learn more about CSS properties here.

Hope it helps,
Cheers!

#22

Thanks. Where do I put the code? I entered in into Content CSS of the page but it’s not registering.

#23

HHi There,

Please try adding the CSS code under X > Theme Options > CSS.

Let us know how it goes!

#24

That hasn’t worked unfortunately…

#25

Hi there,

Please provide the link and the admin details of your site in a Secure Note so that we could check your current setup.

The codes we have provided previous are just based in the general setup of the email forms and your it might not entirely work on your site depending on how it is setup so kindly provide us access to your site so that we could provide you some suggestions.

Thank you.

#26

No worries, I’ll send you the login details in a Secure Note here, many thanks

#27

Hi there,

Thanks for the details.

I have checked your site and the code you have added in the custom CSS panel seems to be working well. It set the subscribe button to red with a black border and changes to black background with red border on hover.

Please try to make sure that you have clear your site’s cache after you made any changes as you might be seeing a cache version of the site right now. Also while you are building and developing your site, it’s advised to turn off caching. This is especially important if you are working with our support team. It’s possible to implement a change, and not have it take place because a cached version of the page or various resources are loading instead of the latest version.

#28

Oh sorry I’m talking about the subscribe button on the feature image of the static home page I’m creating at diytravelhq.com/home

#29

I would like the light green border & text of the subscribe button to change to red if possible…

I’m happy for the subscribe button that was changed above to stay like that too, thanks

#30

Hi there,

Thanks for clearing it up.

This should work:

/*Subscribe button default color*/
.tco-subscribe-form .submit {
	background-color: red;
	border-color: black;
	color: white;
}

/*Subscribe button hover color*/
.tco-subscribe-form .submit:hover {
	background-color: black;
	border-color: red;
}

Hope this helps.

#31

Yes that worked!

But is it possible to have a transparent box like the original and just have the green border & text changed to red?