Change 'Read more' Button Text and Color

Sparkling
1

I would like to change the text in the read more button, as the color/hover color. Is that possible?

Thanks.

2

Hi @hola,

I hope you are well today and thank you for your question.

You can change the text of read more button by using the attached small plugin that contains the following code.

function colorlib_change_translate_text( $translated_text, $text, $domain ) {
	if ( $domain ==  'sparkling' && trim($translated_text) == 'Read More' ) {
		$translated_text = 'New text';
	}
	return $translated_text;
}
add_filter( 'gettext', 'colorlib_change_translate_text', 20, 3 );

Change the ‘New text’ text in the above plugin code to whatever you want to.

You can change the button color and its hover color by adding the following CSS code in the Custom CSS option of the latest version of Sparkling theme on the below path.

Admin Area -> Appearance -> Customize -> Sparkling Options -> Other -> Custom CSS

a.btn.btn-default.read-more {
    background-color: #363636;
    border-color: #363636;
}
a.btn.btn-default.read-more:hover {
    background-color: #DA4453;
    border-color: #DA4453;
}

Please change the color value in the above code to whatever you want to use by referring the following pages.

http://www.w3schools.com/html/html_colors.asp
http://www.w3schools.com/html/html_colorvalues.asp
http://www.w3schools.com/tags/ref_colorpicker.asp

Best Regards,
Movin

3

Is it possible to have different text on different read more buttons.

For example, one could say: Read More
And another could say instead: Read More - Warning: Spoilers Ahead

4

You will have to develop custom code to achieve that.

5

Hi !
I am trying to change the read-more button color as well but cannot find the path you recommend for custom css.
I tried in the global css file of my child theme as well but it doesn’t work. Can you help?

Thank you,
Regards

Edit : I managed to do it with background property for a.more-link

6

@maksanse Awesome great to see you managed to do it.

Please advise if you have more questions by creating separate topic for it.

Have a fantastic day!