Load css via php


Is it possible to load CSS via php and if so, how could you do it? So, instead of :

 <link href="css/theme.css" rel="stylesheet" type="text/css" media="all" />

Open in new window

you use php to load this css file?
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

<?php include('css/theme.css'); ?>
Ray PaseurCommented:
PHP is a server-side technology.  PHP and MySQL are used to generate whole-cloth web pages consisting of HTML, JavaScript and CSS.  So the answer is "yes."  You can inject the CSS inline into the HTML document.
You can start there but there is a little more you should do.
Bootstrap 4: Exploring New Features

Learn how to use and navigate the new features included in Bootstrap 4, the most popular HTML, CSS, and JavaScript framework for developing responsive, mobile-first websites.

Ray PaseurCommented:
Sorry, I forgot to highlight the part of the article.  See: The Timeline of Request and Response
Dave BaldwinFixer of ProblemsCommented:
You can load your CSS with PHP but what is the point?  What are you trying to accomplish?
Ray PaseurCommented:
I kinda share Dave's question here, too.  It seems like there is a backstory to questions like this, and when we can uncover the "deep down" roots of the question, there is often a simple (or simpler) design pattern that emerges.
tofatAuthor Commented:
Well, I am not having much luck using defer/async plus a bunch of other techniques to load js and css files without getting the below the fold errors from google insights. Unfortunately I tend to obsess about things once I really get an idea in my head, and my idea is that I want to get 100% or as close to as possible.

Some of the methods work somewhat but don't always work across browsers. I have a few posts on here already with various other methods that I have been trying but I read someone say somewhere on all my searches that you could use php to do it (I think it was a wordpress function actually, but I am not using wordpress).

I am not sure if using php would in fact work to prevent that dreaded google speed insights message or not and if it would work across browsers without breaking my layout.
Dave BaldwinFixer of ProblemsCommented:
PHP runs on the server and will deliver the files in the place you have the link in the page.  It will not defer it to later loading.  For what it's worth, I never do the things you're talking about to defer loading except for putting tracking scripts at the bottom of the page.  Everything else goes where it is needed which is often in the <head> section.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
tofatAuthor Commented:
Yeah, everything behaves better when putting css in the head and Js before the closing body tag, but then I get that annoying above the fold error. I guess I should just stop obsessing over it and do it like that. But there is one particular website I found that has 100% and they have lots of css files and js. Am I allowed to post that page's code somewhere for you to look at? I would just like to know what it is exactly they are doing to get that. I don't know what is going on in there but since most of you here know 1000 times more than me, I am sure you would know. I will give you 500 points if you do, hehe  :)
Dave BaldwinFixer of ProblemsCommented:
If you are trying to follow the 'recommendations' of Google Pagespeed, you should first go look at the 'View Source' of a Google search results page.  The largest thing in the <head> section is a couple of hundred lines of JavaScript.  And they put <style> sections throughout the body code.  Google is not following their own 'recommendations'.
tofatAuthor Commented:
Where else can I do these kind of tests if Google isn't the best?

And, you didn't say if you were prepared to look at that code?
Dave BaldwinFixer of ProblemsCommented:
Just post a link to the site and I'll look at it.  I don't want you to send me the code.

The point is that all these recommendations are coming from Google and they are not following them themselves.  You need to do what makes sense and works for you and then move on.
tofatAuthor Commented:


If you could explain some of the techniques it would be appreciated. Perhaps you could even tell me if they are good or bad in your opinion.
Dave BaldwinFixer of ProblemsCommented:
I'm sorry but that is almost fraudulent.  The page loads very slow the first time because it has at least 1000 lines, yes, one thousand lines of JavaScript in the <head> section.  About 80% of the page.  And that does not include the jQuery files that are being loaded.  Even when I load that page a second time, it takes forever for that top section to display properly.  It may 'test well' but I would not say that it 'works well'.
tofatAuthor Commented:
Yeah, I did notice that it had LOADS of code in the page which gave me a headache. So, do you think the site gets 100% because most of the JS is inlined?

And last question (promise), what does that bit at the bottom do with all the css files? Google doesn't pick them up but I am assuming it is because they are at the bottom of the page below a 1000 odd lines of code. What does that function do? (like I said, that is my last question, I just want to know what that function at the bottom does with the css files)
Dave BaldwinFixer of ProblemsCommented:
That site is 'optimized' for testing, not functioning.  And as part of that... the javascript at the bottom loads some links to the CSS files so they won't be seen in the <head> section.  I didn't notice at first but something like 80% of the <head> section is the CSS <style> section.  And that's before the JavaScript loads more.
tofatAuthor Commented:
Thanks for your patience and answering all my questions :)
Dave BaldwinFixer of ProblemsCommented:
You're welcome, glad to help.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.