Why CRP styling changes in style.css not working?

Resolved supertrooper2
(@supertrooper2)

4 months, 3 weeks ago

In order to optimize page speed loading we are moving all css styling changes to the style.css file in our child theme. This approach works well for other plugins but not for Contextual Related Posts!

When we move the css styling changes from the Custom CSS Box under “Styles” to the style.css file in the child theme, all of the changes are lost.

If we move the styling changes from the Custom CSS Box under “Styles” to the “Additional CSS” box in the WordPress Customizer this works. However this approach is not good for SEO because the styling changes are saved in the database and loaded with every new page. Of course we are clearing all caches, so this is not the cause!

Please advise how we can get the styling changes to work in the style.css file.

Viewing 5 replies - 1 through 5 (of 5 total)

Plugin Author Ajay
(@ajay)

4 months, 3 weeks ago

You can select the no styles option in the settings and add the CSS from the style you prefer in this folder to your style.css plus anything custom you’d like to change.
https://github.com/WebberZone/contextual-related-posts/tree/master/css

Thread Starter supertrooper2
(@supertrooper2)

4 months, 3 weeks ago

Hi @ajay

That is exactly the approach I have been following. i.e. selecting the “no styles” option and inserting the CSS below into the styles.css file in the child theme.

The problem is that it doesn’t work and I have to insert the code into the “Additional CSS” box in the WordPress Customizer to get it to work.

Please advise how this can be made to work in the style.css file.

.crp_related .crp_title {
color: #000000!important;
position: inherit;
display: block;
bottom: 0;
padding: 7px;
font-size: 14px;
text-shadow: none;
background-color: white;
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
text-align: left;
margin: -7px 0px -3px 7px !important;
}

.crp_related li:hover .crp_title {
background-color: white!important;
}

.crp_related img {
padding: 2% !important;
width: 100% !important;
}
.crp_related li {
margin: 15px 6.6% 15px 6.6% !important;
border: 1px solid #ddd;
padding: 6px;
}
.crp_related ul {
list-style: none;
float: left;
margin: 0!important;
padding: 0!important;
background: white !important;
border-left: 1px solid #dadada !important;
border-right: 1px solid #dadada !important;
}
.crp_related h3 {
margin-left: 7%!important;
margin-bottom: 2% !important;
}

Plugin Author Ajay
(@ajay)

4 months, 2 weeks ago

How does your theme deal with styles and where does it put the styles that govern it? You’ll need to put the above set of rules into the same place. If it loads its other styles, then it should load these.

Am afraid I can’t help you much on that one as it becomes theme specific and it’s best to ask the theme dev where you’d place styles i.e if style.css is the right place or somewhere else?

Thread Starter supertrooper2
(@supertrooper2)

4 months, 2 weeks ago

Hi Ajay

I ran a validation test on the css and discovered a couple of errors. After correcting the errors we were able to move all css styling changes to the style.css file in our child theme.

i.e. it was no longer necessary to put styling changes into the “Additional CSS” box in the WordPress Customizer. Problem solved.

Thanks for the great support.

Plugin Author Ajay
(@ajay)

4 months, 2 weeks ago

Thank you for confirming @supertrooper2

Viewing 5 replies - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

Views