Question

I’m using the .htaccess file to make my URLs SEO friendly, but when I add a folder in URL the CSS and Javascript stops loading.

If I use this url it works (where id=”123″ and str=”some-package-name”):
http://www.mysite.com/package123_some-package-name

RewriteRule package(.*)_(.*)$ packages.php?id=$1&str=$2

But if I use this URL, it doesn’t (where id=”123″ and str=”some-package-name”):
http://www.mysite.com/package123/some-package-name

RewriteRule package(.*)/(.*)$ packages.php?id=$1&str=$2

I’d prefer to use the directory-based URL if possible.

Also, is there any way to submit a form through .htaccess via the POST method to any other file?

Can anyone help please…thanks in advance!

Answer 1

You prefer to use use directory based url. Thats ok.

The problem is you are most likely using relative url-s for the css. Try to use domain relative or absolute url-s to css.

The reference for the css is probably relative in your header, so pointing to “style/asdf.css” results in “http://www.mysite.com/style/asdf.css” the first time, and “http://www.mysite.com/package123/style/asdf.css” the second time, as the browser searches for the css relative to the location of the current document. And the browser thinks that is’s in a folder.

Use absolute or domain-relative urls for the css.

Absolute, starting with a protocol like http:// (good):

<­link rel="stylesheet" type="text/css" href="http://www.mysite.com/style/asdf.css">

Domain-relative, starting with / (good):

<­link rel="stylesheet" type="text/css" href="/style/asdf.css">

Relative, starting with something else (in most cases bad):

<­link rel="stylesheet" type="text/css" href="style/asdf.css">

This is also true for javascripts.

EDIT: Since I have checked your site, I have seen that every url suffers from this problem there. Try to click “Single user package” for a few times and see what it does to the url. That is the problem with relative urls. When you are using relative urls, the same url used form different folders points to different places.

If you are planning to use virtual folders in mod rewrite you must not use relative urls.

That means that lines like these will result in errors:

<li><a href="package3/night-delight">Night delight</a></li>

and

<li><a href="book-your-demo">Book your demo</a></li>

or

<script type="text/javascript" src="js/validations-compressed.js"></script>

or

<li class="slct"><a href="index">Home</a></li>

also

<a href="index.php" id="logo" title="CGBroadband.com">
<link rel="icon" type="image/png" href="images/template/fav.png" />

these will point elswhere from every page. So it’s not just a css problem, it’s a problem with every single link on the page.

In your case the easiest solution would be putting a / before all your urls.

Edit: Also check out this: I have found an other working solution that might be even easier: https://developer.mozilla.org/en/HTML/Element/base

That means if you put

<base href="http://www.mysite.com/" />

in your <­head>, then all the relative urls will be relative to that! Neat isn’t it? But I have heard someone complain about IE compatibility on this one so check it out on all browsers.