Hello @mschreijen,
Thanks for writing to us.
To remove the link overlay on your recent posts, please add this CSS code in your Theme Options > CSS.
article.post.type-post .entry-featured a {
pointer-events: none;
}
The purpose of providing custom CSS is to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.In case if you have no idea about coding you can subscribe to One where customization questions are answered.
Hope it helps.
Thanks
Thank you for your answer, but it didn’t work…
Hi @mschreijen,
You need to add the following custom CSS into the Theme Options > CSS instead of the previous code.
.entry-featured a:hover
{
background:none !important;
}
a.entry-thumb:hover:before
{
opacity:0 !important;
}
a.entry-thumb:hover img
{
opacity:1 !important;
}
Please remember that the above code will work if copied as it is and doesn’t conflict with any existing style.
Please note that the code provided serves only as a guide to help you get started custom coding on your own if there’s no option offered in our theme or the products we bundle.
We really do not provide support for custom codes which means we can’t fix it in case it conflicts with something on your site nor will we enhance it.
Thanks
Sorry, but this CSS code didn’t work either…no change…
Hey @mschreijen,
I tried the code below using the browser tools and it should remove the icon and the dark overlay. Please add the code in your Theme Options > CSS.
a.entry-thumb:hover:before {
opacity: 0 !important;
}
a.entry-thumb:hover img {
opacity: 1 !important;
}
Please note that custom CSS code is outside the scope of our support. Issues that might arise from the use of custom CSS code and further enhancements should be directed to a third-party developer or you can avail One where we can answer questions outside of the features of our theme.
Hope that helps.
Sorry Marc, but this code made no change either. I tried with and without .archive before the code you gave, because it is on the Archive page…
Hello @mschreijen,
I checked these codes on my local and it seems that it is working fine at my end. It might be the issue of CSS syntax in your custom CSS code. I would suggest you please check your custom CSS through the CSSlint.
If it doesn’t work for you we need to check your settings. I would request you, please share your details in a secure note. Please provide the following details meanwhile you must troubleshoot a few common issues before we investigate your settings.
- WordPress Login URL
- Admin level username and password
You can find the Secure Note button at the bottom of your posts
Thanks
I tried again and because of the problem I had before with the Masonry setting showing in 2 and 1 columns on Archives I had to put in some JS code to fix the bug by one of your collegaes on another Forum entry.
What I see now is that when I resize the browser window so the columns go from 3 to 2, and 1 column your code works. But not in 3 colums…
This is the code I had to put in JS:
if (window.jQuery.xIsotope) window.jQuery.xIsotope.settings.animationEngine = ‘css’;
Hello @mschreijen,
Yes, there is a known bug in the Masonry layout when using it in the blog index, archive or in the portfolio page. The given code is used to resolved it.
With regards to the CSS code, it is valid and correct. It is not being applied because you have a broken CSS at the moment. You have this BROKEN custom CSS code block:
@media (max-width:979px){
.single-post .entry-title{
font-size:150% !important;
}
.blog .entry-title{
font-size:130% !important;
}
@media(max-width:979px){
.blog .entry-title{
font-size:150% !important;
}
.archive .entry-title{
font-size:130% !important;
}
@media(max-width:979px){
.archive .entry-title{
font-size:150% !important;
}
}
.p-meta > span::after{
content:"";
}
.widget ul,.widget ol{
box-shadow:none !important;
border:0 !important;
}
@media (max-width:768px){
.no-bg-img .x-bg-layer-upper-image{
background-image:none !important;
}
}
.h-landmark span:before,.h-landmark span:after {
display:none;
}
.home .entry-header .entry-title,.archive .entry-header .entry-title .single .entry-header .entry-title{
position:relative;
margin:0;
font-size:130%;
line-height:1.1;
}
a.entry-thumb:hover:before{
opacity:0 !important;
}
a.entry-thumb:hover img{
opacity:1 !important;
}
@media (min-width:980px){
.x-full-width-active .entry-title:before,.x-content-sidebar-active .entry-title:before{
margin-top:-15px;
margin-left:-15%;
font-size:32px;
line-height:70px;
}
}
There is a missing closing curly brace. Please have it corrected and use this one instead:
@media (max-width:979px){
.single-post .entry-title{
font-size:150% !important;
}
.blog .entry-title{
font-size:130% !important;
}
}
@media(max-width:979px){
.blog .entry-title{
font-size:150% !important;
}
.archive .entry-title{
font-size:130% !important;
}
}
@media(max-width:979px){
.archive .entry-title{
font-size:150% !important;
}
}
.p-meta > span::after{
content:"";
}
.widget ul,.widget ol{
box-shadow:none !important;
border:0 !important;
}
@media (max-width:768px){
.no-bg-img .x-bg-layer-upper-image{
background-image:none !important;
}
}
.h-landmark span:before,.h-landmark span:after {
display:none;
}
.home .entry-header .entry-title,.archive .entry-header .entry-title .single .entry-header .entry-title{
position:relative;
margin:0;
font-size:130%;
line-height:1.1;
}
a.entry-thumb:hover:before{
opacity:0 !important;
}
a.entry-thumb:hover img{
opacity:1 !important;
}
@media (min-width:980px){
.x-full-width-active .entry-title:before,.x-content-sidebar-active .entry-title:before{
margin-top:-15px;
margin-left:-15%;
font-size:32px;
line-height:70px;
}
}
TIP: When inserting a CSS or JS code, it is best that you put some indention, spaces, new lines and line breaks to make your code neat and easily spot any missing or broken codes.
Best Regards.
Thank you very much. I may have been tired last night, because I didn’t see the two missing curly braces. Now I did, corrected it and now your code works without a flaw!
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.