How to change the root for links in html - html

I was hoping that adding a <base href="http://www.myweb.com/newroot/" /> tag would cause that links like /link would point to http://www.myweb.com/newroot/link instead of http://www.myweb.com/link.
Soon I realized it does not work that way and it only applies to hrefs which do not start with /.
But is there any way to achieve the behavior I expected before (without the use of JavaScript)?

links with a leading / always point to the root/domain. This is a client-side issue, i think there is no other solution than dropping the / of using js.

You can use the HTML base element like you did. but instead to linking to /link try simply linking to link

Related

PHP and html how do i link to an external URL?

consider the following code:
<a id="alink" href="http://google.com">google</a>
This is a fairly basic link tag. At the top of my html page I have:
<base href="//localhost/website/" />
This creates a problem, when i click my link it brings me to:
//localhost/website/http://google.com
I do not want this, I want it to bring me to a completely different site(google.com for example). How can I fix this problem?
try this one.
<base href="http://localhost/website/" />
on localhost no need for directory or double slashes // !=link.
The effect of the base tag is global to the document, and the only way to override the effect of  is to use absolute URLs.
You can use window.location in JavaScript to get the URL of the page itself, in case the document was retrieved via HTTP. And you could use it to construct absolute URLs.
But It is better to use server-side technologies that let you construct addresses from one or more base addresses. So quite possibly the best approach is to get rid of the tag.

How to go to sub-directory with relative URI

Sorry if it so basic but I could not find the answer by searching.
If we are in the page http://www.example.com/a-dir-without-trailing-slash how we can reach the sub-directory http://www.example.com/a-dir-without-trailing-slash/pic using relative URI? (we do not know the current directory name(i.e. a-dir-without-trailing-slash)
Some more explanation:
a-dir-without-trailing-slash is the name of an article in the website. It is not an actual directory nor an actual file name. Now, I want to get the pictures that are used in this article by addresses like:
http://www.example.com/a-dir-without-trailing-slash/pic/1
http://www.example.com/a-dir-without-trailing-slash/pic/2
,...
and in the webpage html, I would refer to them with something similar to:
<img src="pic/1" />
If the original article address was in the form of http://www.example.com/a-dir-with-trailing-slash/, the above example would work finely. I want to know if is it possible to get a relative URI with current article addresses (without trailing slash)?
Thank you very much
I suppose you want to avoid hard coding "slugs" in the content so that they can be stored and manipulated independent of each other.
One solution is to use the base tag which allows you to specify the prefix that is added to relative URLs instead of typing them all over the place.
Make sure that your website uses absolute URLs where necessary.
Modify your CMS to "generate" and place the following tag inside the head section that contains trailing slash:
<base href="/a-dir-without-trailing-slash/">
Then you can use relative URLs inside the content, for example:
<img src="pic/1">
<!-- http://www.example.com/a-dir-without-trailing-slash.html/pic/1 -->
You need server side scripting to add the filename to urls (or may be just one '> tag in the head). – Salman
Bounty get.

Change all links in a specific web app from root (absolute) to add a subfolder?

I am deploying an app that is designed to run on the root and the html pages have a lot of links in the form:
/something/file.ext
like
/img/logo.png
/css/main.css
/js/app.js
and links too:
/link/to/url
I need to change them all into:
/subfolder/link/to/url
Is there any elegant way to do this without going page by page and changing it by hand?
I used Apache RewriteBase and HTML's base element..
I also read this question and answer which suggests what I'm doing should work:
Change BASE HREF for absolute references?
But it does not work!
I am doing this:
<base href="http://somesitename.com/subfoldername">
What happens is that the links still go to http://somesitename.com/url instead of the desired result.
The best solution I was able to come up with is the following:
Mass search and replace of
<head>
With:
<head><base href="http://newsite.com/newfolder">
and then search and replace
"/ or '/
with
"
Your milage may vary. I also had to replace some urls inside the javascript code.
Anything that started with a forward slash.

HTML anchor and query string

Is it possible to do something like the URL below?
myurl.co.uk/#myAnchor?myQry=this
I'm trying to pass tracking codes while also being able to have multiple links from an email go to relevant parts of my page.
This currently seems to do nothing as it is. Is it actually possible.
The query goes before the anchor, so:
http://example.com/page.php?parameter=value#anchor
Though the query always comes before any anchors, here is the solution for this if required.
One solution for this could be to use Apache HTACCESS and declare #myAnchor in rewrite rules. Then you can use something like this:
myurl.co.uk/#myAnchor?myQry=this
But please remember that in the htaccess the # is also used for commenting so you will have to escape it with a rewrite rule.

Alternatives to base tag

I used mode rewrite on my website
I used the base tag to solve my relative links problem
<base href="/" />
But the problem is absolute link eg. http://www.absolutelinks.com
It changes it to www.mysite.com/http://www.absolutelinks.com
How can i fix this
Base href applies only to the relative URL so if you have got: Google you'll be redirected to Google, not http://mydomain/http://google.com/. Please post the code of your HTML document.
However using base isn't the best practice. Much better approach is to use absolute URLs like: src="/styles/main.css" which always points to mydomain/styles/main.css.
Don't use <base> at all, instead have some server-side config and keep a $base variable there - then, when outputting any URL during your HTML generation use {$base}{$restofurl}.
This works well when you have the same code running in development/test/live environments - you just need to change your server-side $base config.
Using PHP/Smarty syntax above but I'm sure you get the idea.