Hi,
Please try this custom css to change the hover effect on links
.td-post-content a:hover
{
background: none;
color: red;
font-family: 'Creepster', serif;
font-size: 1.2em;
letter-spacing: 3px;
line-height: .75em;
}
https://www.screencast.com/t/oy78EtDUMs
Thank you!
Nu merge, dar am rezolvat pana la urma. Asta e ce voiam sa obtin.
.td-post-content p a {
color: inherit;
border-bottom: 2px solid #fc0;
background-image: linear-gradient(120deg, #fc0 0%, #fc0 100%);
background-repeat: no-repeat;
background-size: 100% 0.0em;
background-position: 0 100%;
transition: background-size 0.125s ease-in;
}
.td-post-content p a:hover {
border-color: #fc0;
color: black;
background-size: 100% 100%;
}
Singura problema e ca atunci cand deschid pagina sau dau refresh la inceput link-urile au alta culoare iar apoi se face negru. Cum pot scapa rezolva asta?
Hi,
That is happen because the first time is load the code from theme, only after that the code from custom css, what you can do is to set the code for links in header to by load first, in order to do that you need to insert the code between those tags <style></style> and set the code in Analytics/Js codes -> https://www.screencast.com/t/s28KJNbAJk please make sure that you clear all cache after you set the code.
Thank you!
I’m learning something new everyday. Is working properly now!
Thanks!
I am not sure if you are going to see this after all these years, but, your CSS code worked just fine.
The hover effect shows only on posts 🙂
How can I make it to show on bullet point lists as well?
Hello @bnbmedia !
Use this code:
.td-post-content p a,
.td-post-content li a{
color: inherit;
border-bottom: 2px solid #fc0;
background-image: linear-gradient(120deg, #fc0 0%, #fc0 100%);
background-repeat: no-repeat;
background-size: 100% 0.0em;
background-position: 0 100%;
transition: background-size 0.125s ease-in;
}
.td-post-content p a:hover,
.td-post-content li a:hover{
border-color: #fc0;
color: black;
background-size: 100% 100%;
}
Thank you!
