CODEWITHSUNDEEP
.htaccess
SheppardDigital
SheppardDigital

Reputation: 3255

.htaccess redirect, css/images no longer loading

I have a simple HTML project sat on a hosting account in a folder called 'buddies', its full url looks something like this http://www.example.com/buddies/

I'm trying to re-write URL's to point to PHP files like this;

RewriteEngine On

RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ((?:css|images|js)/.*)$ /$1 [L]

# About Us
RewriteRule ^about_us/what_we_do/?$ about-what-we-do.php [NC,L]
RewriteRule ^about_us/mission/?$ about-our-mission.php [NC,L]
RewriteRule ^about_us/team/?$ about-team.php [NC,L]
RewriteRule ^about_us/what_next/?$ about-what-next.php [NC,L]

# Classes
RewriteRule ^classes/learn/?$ classes-learn.php [NC,L]
RewriteRule ^classes/1to1/?$ classes-one-to-one.php [NC,L]
RewriteRule ^classes/swim_fit/?$ class-swim-fit.php [NC,L]

# Information
RewriteRule ^information/timetable/?$ info-timetable.php [NC,L]
RewriteRule ^information/contact/?$ info-contact.php [NC,L]
RewriteRule ^information/location/?$ info-locations.php [NC,L]

This works great at redirecting to the URL to the correct PHP file, however in doing this it's broke the links to all images and css files. I understand why it's doing it, the css and images folders don't exist in the path 'about_us/what_we_do/'

If this was running in the root of the domain, I'd simply prepend a '/' to the front of all images/css files i.e. '/css/style.css' rather than how they're currently referenced 'css/style.css'.

Can someone suggest a way in which I can still server css, images and javascript from the folders 'css', 'images' and 'js'? Without me having to prepend the 'buddies' folder to each and every css/image reference.

EDIT: I'm referencing the stylesheet like this;

<!-- Stylesheet -->
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/style-768.css">
<link rel="stylesheet" type="text/css" href="css/style-992.css">

Upvotes: 0

Views: 1058

Answers (2)

Olaf Dietsche
Olaf Dietsche

Reputation: 74028

If all CSS files are in the directory /css, you can just rewrite each to this directory

RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule (css/.*\.css)$ /$1 [L]

The RewriteCond is there to avoid a rewrite loop, if requests are for /css/....

Similar for images and Javascript files. You may even combine all into one rule, if you just look at the directories

RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ((?:css|images|js)/.*)$ /$1 [L]

This looks for any request starting with either css/, images/ or js/.

If the CSS files are not in %{DOCUMENT_ROOT}/css, but %{DOCUMENT_ROOT}/buddies/css, the target must be prefixed accordingly, e.g.

RewriteRule ((?:css|images|js)/.*)$ /buddies/$1 [L]

Upvotes: 1

Mark Valenzuela
Mark Valenzuela

Reputation: 358

Use <base href="http://www.example.com/">so it will redirect your external files to that directory.

Upvotes: 1

Related Questions