My PHP files within folders are not rendering my default CSS files.
I have a "document-head.php" file that contains:
<link type="text/css" rel="stylesheet" href="assets/css/main.css"/>
Within each file I include this 'document-head.php';
For example, the directory I have is:
index.php
|__ assets
|__ css
|__ main.css
|__ includes
|__ document-head.php
|__ components
|__ secondary.php
|__ partials
Within "components/secondary.php" contains
<?php include('../_includes/document_head.php'); ?>
And within "index.php" contains:
<?php include('_includes/document_head.php'); ?>
How do I make sure that files within folders that include this "document_head.php" always render CSS/JS files?
Edit:
The reason I can't use absolute URL's is that one of the developers configured a script that allows me to upload my application to an FTP where I can name a new folder. For example, if all my files are in "secret-app", in the terminal I can publish my app to an FTP with the new folder "test-app" and it will create "mydomain.com/test-app/secret-app". (It's a ghetto system, but it's useful for my particular needs.)
Try change to an absolute href url like:
<link type="text/css" rel="stylesheet" href="/yourApp/assets/css/main.css"/>
If you're using a framework, you will have several ways to get your base_url.
if this stylesheet is within the document_head.php
<link type="text/css" rel="stylesheet" href="assets/css/main.css"/>
then try this :
<link type="text/css" rel="stylesheet" href="../assets/css/main.css"/>
sorry for my grammar :D
Related
i have started to add include files like header, nav, footer.php to my index.php in my root directory, i got a admin folder with another index.php, with the same include files except it is using "../" in its target path to go back one before accessing the includes file, what happens is it works except for the css files... i lose my styling, but on my root index.php if i go back to that, the styling is working.
Any idea why this is happening?
my css code is:
<link rel="stylesheet" href="css/main.css">
Use an absolute path in your link tag
<link rel="stylesheet" href="/css/main.css" />
As kindly pointed out by John, this is not an absolute path and in all honesty I have no idea what to call it (root relative?). What I do know is that it is relative to the root of the site and not the current folder on the server.
The syntax you're using is relative path.
Use either this to fix the relative path:
<link rel="stylesheet" href="../css/main.css">
Or make it absolute if your css directory is in the web docroot:
<link rel="stylesheet" href="/css/main.css">
if css folder is outside of your admin folder it should be ../css/main.css, right?
For a better management, I'll use an abolute path with full url
<link rel="stylesheet" href="{$html_css}/main.css" />
I am trying to include css file with php so that i have one same path through my sub folders and files as well. This is my code
<link rel="stylesheet" href="<?=ROOT;?>CustomStyles/MyStyles.css">
I have constant root set up before in this way:
define('ROOT', $_SERVER['DOCUMENT_ROOT']);
However this does not work because the result of the link is that after ROOT constant there is the web address of my server.
Can anyone help me please?
Thank you very much.
Place your css file in public directory. Example assets/. And link
<link rel="stylesheet" href="//your.site/assets/MyStyles.css">
I was wondering how was that possible.
Technically, I have a head.php file that contains all of the stylesheets and javascripts:
head.php
<!--CLIENT-->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="../css/jquery.dataTables.min.css">
<link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css">
<script src="js/bootstrap.min.js"></script>
</head>
The file where the bootstrap.min.css is located is 2 folders up and I read somewhere that "../" is moving a step back. So I was wondering why it still works?
Here is the path information:
C:\xampp\htdocs\renewSAD
-includes folders client,css,fonts, & js.
inside the css folder are all the bootstrap css files.
`in the client folder
C:\xampp\htdocs\renewSAD\client
it includes another folder which is the head.php
Therefore it is 2 folders away for the css folder. How come a single ../ works in locating the path for bootstrap's css?
I asked this question because I think it might cause an error in the future.
If I understand the question correctly, you have the following structure:
C:\xampp\htdocs\renewSAD
- Client
- Another folder
- head.php
- CSS
- bootstrap.min.css
- ...
- Fonts
- JS
Any chance that your index.php is actually located in the Client folder, and head.php just gets included in that file?
If so, this works because paths are relative to the main script (not the included script). You can use getcwd() to verify the current directory.
I'm new in slim framework and in PHP 5,
I've copied a template folder download from the internet on my folder '/Template' which is the 'template.path' and I've renamed the folder download '/Default' .
When I want to render the view to a page from 'Default' folder I've written:
$app->get('/auth', function() use ($app) {
$app->render('/Default/pages/examples/lockscreen.html');
});
When I go to http://localhost/Site/index.php/auth, it shows me the content without its CSS and its Bootstrap.
And in lockscreen.html, the link to the CSS and the bootstrap file are written like that:
<link href="../../dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
<link href="../../bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
and this is the architecture of the folder /Default :
/Template
/Default
/bootstrap
/build
/dist
/pages
/examples
lockscreen.html
It's hard to give you a correct answer without knowing your site's complete directory structure, but the reason your template file is not pulling in the .css files is because the generated page is (normally) relative to your site's public (web) root, not to the template file. So, for example, if your web root is /Default, the css includes in the template should be:
<link href="/dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
<link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
It would help to know where your index.php file is located within the directory structure - it should be located in your site's public root folder.
I've solved it!
It's about the root to the css file and the bootstrap file and this is what i've done :
<link href="./Template/Default/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="./Template/Default/dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
I have a PHP file called header.php which contains as follows:
<title><?php echo $title; ?></title>
<link href="core/css/styles.css" rel="stylesheet" />
<link href="core/css/bootstrap.css" rel="stylesheet">
When on the root folder of my website it is easy to access these files. Simply using: include 'header.php'. However when I am in a directory other than root, for example order/ the files are not able to be accessed. I can access the PHP file by going back a directory using: include '../header.php' however this does not work for the css files included in that file and they cannot be accessed by the file that is not in the root directory.
Can anyone help me with a way to come over this? I like only having one header.php file as I can then add/remove files from that document and the change will appear across the whole site.
Many thanks,
Harry
When using a universal header it's important to use absolute paths to your css files, from the web root. So if core were a folder in the root this would be the revised header.php:
<title><?php echo $title; ?></title>
<link href="/core/css/styles.css" rel="stylesheet" />
<link href="/core/css/bootstrap.css" rel="stylesheet">
Notice the / at the beginning of the path denoting from the web root.