[Cherise]

Hi, I am using the Catch wedding theme. Is there a way to change the button colour on the homescreen? It currently is pink. I would like to change the button background color as well as the text color.

[Sakin]

Hi Cherise,

For advanced color options, you need to upgrade to the pro version. In the Catch Wedding Pro theme, you can change the color from “Appearance => Customize => Theme Options => Colors”. There are many places with pink so it will be difficult to change with CSS only.

For homescreen button color, you can change the color code in the following CSS and add it in “Appearance => Customize => Additional CSS” box:

.header-media .more-link .more-button,
#promotion-section .more-link .more-button,
#hero-section .view-all-button .button,
.site-main #infinite-handle span,
.view-all-button .more-link {
  background-color: #000;
  color: #fff;
}

Regards,
Sakin

[Cherise]

1. Thanks so much. Is there a way to make the button background colour a bit transparent (maybe with a border)?
2. How can I remove the header media title (not site title) from my mobile view only?
3. My mobile menu has a black background which turns white when I select it, but I would like to remove the black background or change it to white?
4. I made a custom footer with Elementor, but it doesn’t display full width on a pc or mobile, even tough I selected the full width option, is there any way to make it full width with an additional css?

[Cherise]

5. And I would also like to remove the search box in my mobile menu please. I was able to remove it on a pc, but it is still visible in my mobile menu

[Cherise]

6. And maybe also a css to remove the site title from my mobile view only please?

[Sakin]

Hello Cherise,

1. For the transparent button, you can use the following CSS in the “Appearance => Customize => Additional CSS” box:

.header-media .more-link .more-button,
#promotion-section .more-link .more-button,
#hero-section .view-all-button .button,
.site-main #infinite-handle span,
.view-all-button .more-link {
  background-color: transparent;
  color: #fff;
  border: 2px solid #fff;
}

2. To remove the header media title for mobile view only, add the following CSS in the “Appearance => Customize => Additional CSS” box:

@media only screen and (max-width: 768px) {
	.header-media .entry-title {
		display: none;
	}
}

3. Catch Wedding theme doesn’t have a black background. So, I am confused about this.

4. You need to ask the Elementor support team.

5. You can hide that by adding the following CSS in the “Appearance => Customize => Additional CSS” box:

#header-navigation-area .search-social-wrap .secondary-search-wrapper {
	display: none;
}

6. You can hide that Site Title on Mobile by adding the following CSS in the “Appearance => Customize => Additional CSS” box:

@media only screen and (max-width: 768px) {
	.site-branding .site-identity {
		display: none;
	}
}

Regards,
Sakin

[Cherise]

Hi, thanks. Also another concern which I hope you can assist with. With the header media title, it’s 2 peoples names “Maverick & Delmarie” – you enter it in the customiser.

But on some mobile screens it cuts the name in half and displays it as follows:

“Maverick & Del-

marie”

Is there any way I am able to change this? So that it doesn’t cut the name in half.

[Cherise]

And I would also like to know how to hide the button on mobile only please?

[Author]

Posts