.htaccess to redirect images - .htaccess

i'm still new to the redirectrule thing from htaccess and have successfully redirected my pages so that the pretty URL shows up, but is there a way to redirect the images so that it is not relative? Is there a way or function that allows me to redirect images without changing it one by one ?
Like i after redirecting the page, i get relative URL, hence my images are showing something extra in their links.
so this is the actual url to the image
http://www.yousite.com/page/images/this.jpg
but i'm getting stuff like
http://www.yoursite.com/images/page/images/this.jpg

I am not sure this will solve the problem, but instead of modifying all the links you could use the BASE element in each page to define a base URI:
From http://www.w3.org/TR/html4/struct/links.html#h-12.4:
When present, the BASE element must appear in the HEAD section of an
HTML document, before any element that refers to an external source. The
path information specified by the BASE element only affects URIs in the
document where the element appears.
Examples:
<HEAD>
<BASE href="ImagesBasePath">
</HEAD>
Or just:
<HEAD>
<BASE href="/">
</HEAD>

Related

Problem of links when create friendly links with htaccess [duplicate]

I want to make my URL as SEO Friendly URL. I tried editing .htaccess file by rewriting rule
RewriteRule ^swift-details/([0-9]+)/([0-9a-zA-Z_-]+)$ swift-details.php?id=$1 [NC,L]
RewriteRule ^swift-details/(css|js|img)/(.*)?$ /$1/$2 [L,QSA,R=301]
It's routing the correct URL but in that page CSS JS and images are not working.
Example URL:
http://www.example.com/swift-details/2/abblinbb
This is because your relative URIs have their base changed. Originally, the base is / when the page is /swift-details.php?id=foo, and the browser properly fills in relative links with the / base. But when the browser goes to a page like /swift/details/foo the base suddenly becomes /swift/ and it tries to append that in front of all relative URLs and thus none of them load.
You can either make your links absolute, or change the URI base in the header of your pages (inbetween the <head> </head> tags):
<base href="/">
You dont need the second rewrite rule. Your CSS/JS paths are all 'relative' to your current location.
Your CSS exists here:
/css/normalize.css
Your page is looking here:
/swift-details/2/abblinbb/css/normalize.css
All you need is 'forward-slashes' before your CSS/JS paths.

How to set canonical URL for 2 part blog entry?

I have a blog with Photoshop tutorials and because some of my tutorials are quite long I've decided to split the content into parts
http://www.psd-dude.com/tutorials/how-to-make-a-coffee-stain-text-in-photoshop.aspx
http://www.psd-dude.com/tutorials/how-to-make-a-coffee-stain-text-in-photoshop.aspx?part=2
and set the canonical rel for both pages to
http://www.psd-dude.com/tutorials/how-to-make-a-coffee-stain-text-in-photoshop.aspx
Is this better than the option of having 2 canonical links? Please note that I have images and text on both parts that I would like to have indexed.
It’s not allowed to use the canonical link type in that case.
RFC 6596 defines:
The target (canonical) IRI MUST identify content that is either duplicative or a superset of the content at the context (referring) IRI.
But your second page is not included in (or identical to) the first page.
So you have these options:
Introduce a page that contains the whole content, and make this one the canonical target for all paginated pages (but if you do this, you might want to consider to stop offering the paginated versions in the first place). Note that this is only allowed if the paginated pages don’t have separate user comments (or any other unique content).
Use self-referential canonical targets.
Omit canonical.
You can use canonical for pagination for solve that:
In the <head> section of the first page (www.psd-dude.com/tutorials/how-to-make-a-coffee-stain-text-in-photoshop.aspx),
add a link tag pointing to the next page in the sequence, like this:
<link rel="canonical" href="http://www.psd-dude.com/tutorials/how-to-make-a-coffee-stain-text-in-photoshop.aspx">
<link rel="next" href="http://www.psd-dude.com/tutorials/how-to-make-a-coffee-stain-text-in-photoshop.aspx?part=2">
Because this is the first URL in the sequence, there’s no need to add markup for rel="prev".
On the second and third pages, add links pointing to the previous and next URLs in the sequence. For example, you could add the following to the second page of the sequence:
<link rel="prev" href="http://www.psd-dude.com/tutorials/how-to-make-a-coffee-stain-text-in-photoshop.aspx">
<link rel="canonical" href="http://www.psd-dude.com/tutorials/how-to-make-a-coffee-stain-text-in-photoshop.aspx?part=2">
<link rel="next" href="http://www.psd-dude.com/tutorials/how-to-make-a-coffee-stain-text-in-photoshop.aspx?part=3">
On the final page of the sequence (www.psd-dude.com/tutorials/how-to-make-a-coffee-stain-text-in-photoshop.aspx?part=4>), add a link pointing to the previous URL, like this:
<link rel="prev" href="http://www.psd-dude.com/tutorials/how-to-make-a-coffee-stain-text-in-photoshop.aspx?part=3">
<link rel="canonical" href="http://www.psd-dude.com/tutorials/how-to-make-a-coffee-stain-text-in-photoshop.aspx?part=4">
Because this is the final URL in the sequence, there’s no need to add a rel="next" link.

SPA .htaccess breaks JS files after top level [duplicate]

I want to make my URL as SEO Friendly URL. I tried editing .htaccess file by rewriting rule
RewriteRule ^swift-details/([0-9]+)/([0-9a-zA-Z_-]+)$ swift-details.php?id=$1 [NC,L]
RewriteRule ^swift-details/(css|js|img)/(.*)?$ /$1/$2 [L,QSA,R=301]
It's routing the correct URL but in that page CSS JS and images are not working.
Example URL:
http://www.example.com/swift-details/2/abblinbb
This is because your relative URIs have their base changed. Originally, the base is / when the page is /swift-details.php?id=foo, and the browser properly fills in relative links with the / base. But when the browser goes to a page like /swift/details/foo the base suddenly becomes /swift/ and it tries to append that in front of all relative URLs and thus none of them load.
You can either make your links absolute, or change the URI base in the header of your pages (inbetween the <head> </head> tags):
<base href="/">
You dont need the second rewrite rule. Your CSS/JS paths are all 'relative' to your current location.
Your CSS exists here:
/css/normalize.css
Your page is looking here:
/swift-details/2/abblinbb/css/normalize.css
All you need is 'forward-slashes' before your CSS/JS paths.

directory problems when using htaccess

I've figured out how Mod rewrite works now however I've come across a new problem.
htaccess code
RewriteEngine On
RewriteRule ^([A-Za-z0-9-]+)/$ http://localhost/testblog/index.php?category=$1
I now know that this: localhost/testblog/dogs/
is equal to : localhost/testblog/index.php?category=dogs
however, when i put a link on the index.php file; Dogs that page (localhost/testblog/dogs/) now has the stylesheet prefixed with dogs/ so the stylesheet looks like localhost/testblog/dogs/stylesheets/style.css
but when I link with Dogs everything works just fine; localhost/testblog/stylesheets/style.css
I find it confusing because I thought that they now equaled the same thing using the .htaccess file?
how can i rectify this problem with the prefix?
Hopefully I've explained properly
Thanks
I think your issue is probably more the way you're linking the stylesheet. You're re-writing to /dogs/ and I'm guessing your stylesheet is linked like <link href="stylesheets/style.css" rel="stylesheet" type="text/css">. So when you point your browser at /dogs/ it's trying to load a stylesheet in relation to the URL, and it looks like /dogs/ is a folder so it's just appending stylesheets/style.css to your current URL. The best bet in my opinion would be to link absolutely to the stylesheet like: <link href="/testblog/stylesheets/style.css" rel="stylesheet" type="text/css">
Like said Jonathon, the browser compute relative link by appending the href to the url displayed on the adress bar.
To change this, you need to had a base tag
<base href="//localhost/testblog">
So, your browser will compute your link by adding your href to the base href.

Convert to SEO friendly URL

I'm trying to make my website URLs SEO-friendly, and I'm having problems...
How can I change this URL:
http://www.example.com/media.php?album=Album_1&page=1
To this kind of URL:
http://www.example.com/media/Album_1/1
I've tried this code that works, but my CSS seems KO...
RewriteEngine On
RewriteRule ^media/(.*?)/([0-9]+)$ media.php?album=$1&page=$2
Your rule's target doesn't need the &, it should just be &. Apache will propery encode it as needed (like in the anchor link in the HTML returned in a redirect). The reason your css isn't working sounds like a relative vs absolute URL issue. If your css is linked like <link rel=stylesheet href="something.css">, the relative URL resolution ends up being /media/Album_1/something.css.
Try adding this in the headers of your pages:
<base href="/">
Try reading mod_rewrite apache documents or just searching 'mod_rewrite' This specific question was asked many times

Resources