• Hi

    I have all my WP CSS added here in Appearance < Editor > Styles > Additional CSS and have had no issues so far with page styling. I have a couple of one off webpages that I want to either use internal CSS or point to a different external CSS file which I know how to do through using the wp_enqueue_style() function in the WordPress theme’s functions.php file.

    The problem is, when I try to use either method, my webpage must still be picking up the main CSS as my webpage has elements that are all over the place. I know it’s the main CSS because if I delete it, and just add this single webpage’s CSS into the Additional CSS section, it works fine.

    I’m relatively new to WP so I’m not sure how I can avoid this CSS conflict.

    Help appreciated.

Viewing 9 replies - 1 through 9 (of 9 total)
  • Moderator threadi

    (@threadi)

    If you want to prevent individual CSS files from being included, you can do so in PHP using https://developer.ww.wp.xz.cn/reference/functions/wp_dequeue_style/. Check out the examples there to see how to use it.

    Thread Starter skyman77

    (@skyman77)

    Hi,

    Thanks for the quick response. I tried the instructions in the suggested technique. It doesn’t appear to have any effect. Here is my code:

    add_action( ‘wp_enqueue_scripts’, ‘twentytwentyfive_child_deregister_styles’, 11 );
    function twentytwentyfive_child_deregister_styles() {
    wp_dequeue_style( ‘twentytwentyfive’ );

    }

    Can I confirm that the CSS added in the Additional CSS section is the theme’s CSS? Another thing I don’t understand is why WP doesn’t put that CSS somewhere in a file where it can be edited in the usual way. I did a text search for unique strings from my CSS in the whole WP directory and it finds nothing.

    Thread Starter skyman77

    (@skyman77)

    OK, I found the code that was breaking the unique webpage, so that’s progress. Id’ still like to be able to be able to get this deregister technique to work, and there’s still another oddity and cross styling issues in the way my webpage is displaying which also needs further investigation.

    • This reply was modified 2 weeks, 3 days ago by skyman77.
    • This reply was modified 2 weeks, 3 days ago by skyman77.
    Moderator threadi

    (@threadi)

    If you want to remove a specific style sheet from the output, you need to use its handle in wp_dequeue_style(). However, there is no handle named “twentytwentyfive” when using the default TwentyTwentyFive theme.

    With block themes, CSS styles are dynamically generated from the templates and the settings in theme.json. No files are created in this process; at most, the style.css file from the theme or from plugins that supplement it is used. If you’re looking for something like that, you’d have to switch to classic themes (such as the last classic default theme, TwentyTwentyOne).

    What you enter as Additional CSS is simply an addition to the styles that WordPress already generates for you via the theme. You can store additional CSS in the Additional CSS section – as the name suggests.

    I’m a bit unsure what you’re actually getting at here. If you don’t want the settings in Additional CSS to appear on the front end, simply leave that field blank. No coding is required for this.

    And what do you mean by “external CSS” in this context? By that, I mean a style specification that is loaded from a different server. For example, if you run your website at example1.com, you could include CSS from example2.com – and you want to prevent that? Perhaps some specific examples from you would be helpful to move forward here.

    Thread Starter skyman77

    (@skyman77)

    Thanks again for replying.

    So here’s the full story. With WP, I’m writing my own HTML/CSS and just using custom HTML blocks in the builder. When I started out using WP a few months ago, realising I couldn’t find styles.css files and that CSS works differently in WP, I asked where do I put my CSS? I was told, add it to the additional CSS section in the Styles area. No problem.

    I’m publishing a website publicly with my Webhost but use WP on my home PC for testing/backup/dev etc. Apart from my main website content, I run some unique unrelated pages that I want to be able to ‘isolate’ from whatever CSS WP is injecting from the additional CSS section. So my main questions/objectives are the following.

    – What is the best/right way to lodge your ‘main’ CSS in WP?
    – If I want to block that ‘main’ CSS completely so certain pages won’t pick it up, how can I achieve this?
    – And do these questions point out that I’m fundamentally missing something 🤣

    Cheers.

    Moderator threadi

    (@threadi)

    Okay, that’s an unusual way to use the Block Editor. It’s a bit out of the ordinary, but WordPress definitely allows it. If you’re comfortable with it – why not 🙂

    So your goal is really to have your own CSS file where you can style the HTML code you’ve written yourself. There are actually several ways to do this, but you also want to get rid of the other styles you don’t need for your custom page – and that’s where custom themes come into play.

    I would therefore recommend setting up a theme yourself. Since you want to do without any of the block features, a classic theme would likely be the best fit. See: https://developer.ww.wp.xz.cn/themes/classic-themes/your-first-theme/ – there you’ll also find the file handling you were looking for.

    As mentioned at the beginning, though, this is a bit unusual. With this approach, you don’t really need a CMS at all; you could just write everything yourself in HTML/CSS files. What value does WordPress still offer you in this case?

    Thread Starter skyman77

    (@skyman77)

    There’s a few reasons.

    When I started building my website a year ago, I was traumatised by my web host’s website builder lol. So I thought I’d cut out the middle man and learn HTML (I understood a bit from years ago). I had to cut that webhost loose and in the process of looking for another one, I found that they all have their own website builders (shudder) and WP which I had a bit of familiarity with from years ago when I tried my hand at some blogging.

    I actually work in IT support (20+ years) but am looking to transition into WebDev, so I think it’s useful to be across WP due to it’s popularity. If I wasn’t going to use WP, what would I use in terms of public web serving?

    By the way, as an IT support engineer, we do pretty much everything except webhosting/development, so my knowledge is minimal in that area.

    Moderator threadi

    (@threadi)

    Which approach you take (whether with or without WordPress, whether using a pre-made theme or a custom one, etc.) depends on the goals of your specific project. WordPress can handle all of this, but using WordPress solely to enter HTML code in the Block Editor that’s styled with custom CSS is a bit odd. The main reason is that you have a full-fledged CMS with many features that you don’t even use, yet you still have to keep it up to date even though you’re only utilizing a fraction of its capabilities. I think you see where I’m going with this.

    As I said, you still have various options for achieving your goal with WordPress. Based on what you’ve described, the custom classic theme mentioned above would likely be a suitable approach.

    Alternatively, you can continue using TwentyTwentyFive and try to trim it down so that as little as possible of what you don’t use is loaded. A child theme could help with this, by the way; see: https://developer.ww.wp.xz.cn/themes/advanced-topics/child-themes/

    And of course, you could also look into building the website without writing HTML yourself. Imagine if you ever had to hand the project over to someone else (which you should never rule out) – the approach of using HTML blocks would likely be just as unfamiliar to them as it is to me right now.

    Thread Starter skyman77

    (@skyman77)

    OK, thanks for that, I’ll check out the resources you’ve pointed out.

    Have a great day!

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

You must be logged in to reply to this topic.