Modify Entry Share

Hi there,

I just had a couple of quick questions about the entry share element:

  1. Do you know how I can alter with CSS the colour of the background shape that appears on hover? For example, the social icons in the top right of my website (https://thelanguagesherpa.com) have a red square when they are hovered over.

  2. Similarly, how can I alter the colour of the internal parts of the icon when they are hovered over, e.g. the ‘f’ in the Facebook icon and the bird in the twitter icon?

Thank you!
LS

Hi There,

Thank you for writing in, the first one is the background hover color and the second one is the actual hover color of the icon. Please add the following custom CSS to Theme Options > CSS

.x-entry-share .x-share:hover {
	background-color: green;
    color: yellow;
}

Feel free to change those color values.

Cheers!

Hi Friech,

Thank you, that’s great.

Just one more question: do you know how I can get rid of the entry share’s ‘Share This Post’ text and the two parallel horizontal lines that sandwich the icon row?

LS

Hi LS,

This CSS code should do it:

.x-entry-share {
    border: 0;
}

.x-entry-share p {
    display: none;
}

Thank you, Jade :slight_smile:

On behalf of my colleague, you’re welcome. Cheers! :slight_smile:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.