Changing text in promotion banner and image & text

[hellofromutrecht]

Hi!

I want to adjust the font thickness or add a background to the promotion banner and image & text, because you can’t read the text on the photos properly now. I put them both on my homepage and it’s the first thing you see, so it would be nice if it’s catchy like on your demo site.

Where can I change the color and thickness, or add a background of:
– Fine Art Print – Domtoren in de mist
– Ansichtkaarten 10 halen = 8 betalen

Thank you!

 

Cheers,

Liset

Attachments:

You must be logged in to view attached files.

[Harry]

Hi,

You can use “Promotion Banner” element to build your content https://tppr.me/Ne0O87 and it has option for you can change text color https://tppr.me/CYY2NG

Kind regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[hellofromutrecht]

Hi! Thanks for your reply. Isn’t there any possibility to make the text thicker? Now it’s hardly visible.

[hellofromutrecht]

Hm, I changed the text in Loco translate, but it can only be a short word…

I also want to adjust the text ‘Domtoren in the mist’ because it’s not nice the way it is now. I added the product there, so I can’t change the text as I could in the promotion banner.

Is there any possibility to change these things?

Attachments:

You must be logged in to view attached files.

[Harry]

Hi,

Can you send me your access to check?

Thanks

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[Harry]

2. Please add below code to Claue > Theme Option > General Layout > Custom CSS if you want add background below Promotion text

.jas-promotion.bottom .pa {

	background: rgba(0,0,0,0.8);
	padding: 20px;
}

and add below code to make the text thicker

.jas-promotion.bottom .pa h3, 
.jas-promotion.bottom .pa h4 {
	font-weight: bold;
}

2. add below code to make background cover the text ” ‘Domtoren in the mist’

.badge span.0nsale {
width: 145px;
}

Kind regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[hellofromutrecht]

This reply has been marked as private.

[hellofromutrecht]

And the text Domtoren in de mist is also quite low in the photo.

[Harry]

hellofromutrecht wrote:

And the text Domtoren in de mist is also quite low in the photo.

Quote

Please tell me more about this issue? I still confuse this.

Thanks

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[hellofromutrecht]

Can I change the color of the text and its placement?

Attachments:

You must be logged in to view attached files.

[Harry]

you mean the text “Fine Art Print – Domtoren in de mist”?

Please give the design where do you want it show, I will give you suggest code

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[hellofromutrecht]

Yes, I mean that text. If possible, can you create a code that matches the regular buttons on the product categories?

Could you create the same code for the Pick & Mix? I only get the background wider when I extend text 2. I actually would like to exchange text 2 and text 3 in the promotion banner. With a black background and white text, please.

Thank you!!

Attachments:

You must be logged in to view attached files.

[Harry]

Hi,

Please add below code to Custom CSS

.product-countdown .product-info h3 {
	width: auto;
	overflow: inherit;
}
.product-countdown .product-info {
	padding: 20px;
	background: rgba(0,0,0,0.8);
	max-width: calc(100% - 20px);
	text-align: center;
}
.product-countdown .product-info h3 a {
	color: #fff;
}

Kind regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[hellofromutrecht]

Hi Harry,

Thank you. Can I add a bit more space between the container and the bottom of the photo? So the space where the arrow is in the attachment needs to be bigger so the text will be a bit higher.

The second attachment:
Left arrow: I want less space here, the text is not nicely aligned in the center of the container.
Right arrow: I want this text not bold but regular.

Third attachment:
Where can I remove the ‘Clear’?

Attachments:

You must be logged in to view attached files.

[Harry]

Hi,

1. Please change to to

.product-countdown .product-info {
	padding: 10px;
	background: rgba(0,0,0,0.8);
	max-width: calc(100% - 40px);
	text-align: center;
	bottom: 20px;
}
.product-countdown .product-info h3 {
	width: 100;
	overflow: inherit;
}
.product-countdown .product-info h3 a {
	color: #fff;
}

2. Please change code

.jas-promotion.bottom .pa h3, 
.jas-promotion.bottom .pa h4 {
	font-weight: bold;
}

and

.jas-promotion.bottom .pa {
	background: rgba(0,0,0,0.8);
	padding: 20px;
}

to

.jas-promotion.bottom .pa h3 {
	font-weight: bold;
}
.jas-promotion.bottom .pa h3, 
.jas-promotion.bottom .pa h4 {
	font-weight: 400;
}
.jas-promotion.bottom .pa {
	background: rgba(0,0,0,0.8);
	padding: 10px;
}

3. Please add more code

a.reset_variations {
	display: none;
}

Kind regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[hellofromutrecht]

Hi Harry, thank you. It’s not perfect yet. I added the word ‘EXCLUSIEF’ to the title of the photo ‘Domtoren in de mist’, but now it’s not showing well as it’s running out of the photo. How can we fix this?

Attachments:

You must be logged in to view attached files.

[Harry]

Hi,

Please try short the text, if show full text it like this image https://tppr.me/UgH1Ly

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[hellofromutrecht]

When I shorten the text, the text is not in the middle of the container…….

Attachments:

You must be logged in to view attached files.

[Harry]

Hi,

Please find the code

.product-countdown .product-info h3 {
	width: 100;
	overflow: inherit;
}

and change to

.product-countdown .product-info h3 {
	width: 100%;
	overflow: inherit;
	padding: 8px 10px;
}

Kind regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[Author]

Posts