how to reference css files after creating different paths using rewrite rules - php

In my root, I have index.php which references css files like this:
<link rel="stylesheet" href="css/style.css" type="text/css" />
<link rel="stylesheet" href="css/custom.css" type="text/css" />
I have a rewrite rule that makes my path example.com/products/.....
RewriteRule ^products/([0-9a-zA-Z-]+)$ product-detail.php?slug=$1 [NC,L]
The issue I have is that the css links are now broken on the products pages because the reference to the css files is incorrect as it should change to:
<link rel="stylesheet" href="../css/style.css" type="text/css" />
<link rel="stylesheet" href="../css/custom.css" type="text/css" />
I would like to have a header.php file where I can just make changes once if I need to add or remove css references but now I have to have 2 make changes twice. Is there a way around this?

you can start the include with the root path
<link rel="stylesheet" href="/css/style.css" type="text/css" />

I solved this by adding this to the head:
<base href="//localhost:8888/mysite/" />

Related

Linking CSS Stylesheet not working

I have two CSS links in the head of my PHP file.
<link rel="stylesheet" type="text/css" href="../styles/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="../styles/style.css">
The first one (Bootstrap) works. The second one doesn't. They are both in the same path. I've double and triple checked that the second one is spelled correctly. What should I do?
Check the location of your file in a web site's folder structure.
<link rel="stylesheet" type="text/css" href="bootstrap.min.css">
css is located in the same folder as the current page
<link rel="stylesheet" type="text/css" href="styles/bootstrap.min.css">
css is located in the styles folder in the current folder
<link rel="stylesheet" type="text/css" href="/styles/bootstrap.min.css">
css is located in the styles folder at the root of the current web
<link rel="stylesheet" type="text/css" href="../styles/bootstrap.min.css">
css is located in the folder one level up from the current folder

Edit included PHP header to show CSS file specific to the page

So, I've had a look around, become somewhat overwhelmed by the variety of different answers I've come across and would like a hand.
My included PHP header CSS files currently look like this:
<meta name="viewport" content="initial-scale=1.0">
<link href="CSS/header.css" type="text/css" rel="stylesheet" />
<link href="CSS/ufc-blog.css" type="text/css" rel="stylesheet" />
<link href="CSS/ufc205.css" type="text/css" rel="stylesheet" />
<link href="CSS/cerrone-lawler.css" type="text/css" rel="stylesheet" />
How can I specify the path and then enter a variable from the page with the included header that set the stylesheet to display the CSS specifically for that page?

Including file in php which keeps resources intact

Let's say I have
/index.php
<?php include("boxes/boxes.php"); ?>
boxes/boxes.php
<link href="style.css" rel="stylesheet" type="text/css" />
boxes/stylesheet.css
body{ background-color: yellow; }
The stylesheet won't be included on /index.php, as it'll look in / for the stylesheet instead of boxes/. How do I fix this?
Can you not explicitly write in the href
<link href="/boxes/stylesheet.css" rel="stylesheet" type="text/css" />
The slash in front of /boxes/stylesheet.css will tell the link to start from the start of the domain. That way it can be used anywhere and it will still work
Provide an absolute path to your stylesheet file as follow,
<link href="http://www.example.com/boxes/stylesheet.css" rel="stylesheet" type="text/css" />
This will solve your issue.

How to refer to css file in codeigniter? 2.0

What is the difference if I store the main.css file in /webroot/myapp/css or /webroot/assets/css?
This one is working...
<link rel="stylesheet" href="/assets/css/main.css" type="text/css" />
This one does not...
<link rel="stylesheet" href="/myapp/css/main.css" type="text/css" />
Why?
Load the URL helper and then add to your href like so:
<link rel="stylesheet" href="<?php echo base_url() ?>/assets/css/main.css" type="text/css" />

Header template wont alway pull up css

I am new to php, but suspect there is a simple solution that I am not aware of.
I have made a template for the header on every page, but when the user loads pages the css page changes in relation to their current page.
How do I have php track how many levels up in a folder the user is so I can pull the css from anywhere in the website?
<link rel="stylesheet" href="../templates/css/css.css" type="text/css" />
That is my current link to css, but for a page further down in folders I need it to add additional ../
You should use an absolute path from the root of the website (note, no ".." just a "/"):
<link rel='stylesheet' href='/templates/css/css.css' type='text/css' />
Will always work, as long as your css is at:
http://yourwebsite.com/templates/css/css.css
you shouldn't be using a relative path then. Why not just do something like:
<link rel="stylesheet" href="http://www.mysite.com/templates/css/css.css" type="text/css" />
or
<link rel="stylesheet" href="/templates/css/css.css" type="text/css" />
or
<link rel="stylesheet" href="<?php echo $_SERVER['DOCUMENT_ROOT']; ?>/templates/css/css.css" type="text/css" />
whichever suits your needs - since you may be working locally and have a strange file structure, or a shared style directory for example
The best method is to use:
<link rel="stylesheet" href="<?php echo $_SERVER['DOCUMENT_ROOT']; ?>/templates/css/css.css" type="text/css" />

Categories