CSS Import statement not being honoured in recent update

Hi guys, I have some custom CSS on a specific page which includes the following line;

@import url(“https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css”);

Until recently this worked fine. However since the most recent update of the Pro theme the @import statement is no longer being ‘processed’ by Cornerstone and hence my page is now not styled.

Is this something you are aware of?

Thanks

Stewart

Hey Stewart,

Thanks for writing in! Where did you added the @import url(“https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css”);? Is it in the child theme’s style.css or in the Cornerstone > Theme Options > CSS? To better assist you with the issue, please provide us the URL of your site or the WP site access so that we can investigate. You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
- Confirmation that we can access and make changes to your site

To know how to create a secure note, please check this out: How The Forum Works

Best Regards.

Hi Ruenel, thanks for coming back to me.

With regards to where I placed the CSS, as per my message, I placed the CSS in a specific page using the “CSS” button when editing the page. Please see screenshot - https://share.getcloudapp.com/ApuxDW0Q

Also, could you tell me how I can turn on notifications for updates to this thread. I never got a message to say you had replied hence the delay in getting back to you :frowning:

Thanks

Stewart

Hi Stewart,

It would be best if you could share with us the admin credential so that we can check your setup properly. To do that, please give us the following information in a Secure Note.

  • WordPress Login URL
  • Admin level username and password

You can find the Secure Note button at the bottom of your posts.

Thank you.

Secure note added.

p.s. you didn’t answer my question on how I can turn on email notifications when I receive a reply to the thread.

Hi Stewart,

The CSS option in the Page is only to add the CSS code inside the <style> tag, and import will not work if you are adding within it. Ass suggested by my colleague, you need to add it into the style.css file of your child theme.

NOTE: there is no option to enable the notification, it will always notify through the email id you registered.

Hope it helps.
Thanks

Hi, 2 things.

  1. this used to work before the most recent update. So saying ‘import’ won’t work, is only relevant now. It did work before. Something has changed.

  2. I am not receiving email notification. How can this be fixed?

Thanks

Stewart

Hello Stewart,

1.) Technically, it should work. Unless otherwise there is a conflict or error, it wont. Also, it could be a CORS (Cross Origin Resource Sharing) issue which your server now imposed.

2.) Please do check in Settings > General if you have inserted the correct admin email address. You may need to check your WP Mail SMTP if it is working.

Best Regards.

  1. The only recent change was updating Pro which moved to the new ‘Cornerstone’ branding. Problem is with your theme not a server issue.

  2. ??? I’m referring to the email notification that a reply from Theme.co support has replied to this thread. Not my WP installation :man_facepalming:t2: I never get notified that you have replied which can delay my response.

Hey Stewart,

We’re very sorry for all the confusion here.

  1. It’s not your server but it’s not our theme also. It’s a new set of rules in the latest version of most browsers. This boils down to understanding the usage of CSS @import. The latest version of most browsers now will not accept incorrect usage like placing other CSS blocks above the @import line and that is the case if you put the @import in our themes’ Code Editors.

The correct setup for this is to use a child theme and in the child theme’s functions.php file, add the CSS block like the following code:

add_action( 'wp_head', function () { ?>
<style>
	@import url("https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css");
</style>
<?php } );

Please just note that we do not provide support for any issues that will arise from the use of custom codes. What I’ve provided is just an example. Custom development questions can only be answered in our One premium support.

  1. Go to your Themeco Dashboard (https://theme.co/account/dashboard) then click on your username to go to your account controls where the Email and Notification controls are available under the Preferences tab.

image

Hope that helps.

Thank you. That all makes sense. Thread can be closed.

You are most welcome, Stewart.

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