Using HTML href="" on section of URL string - html

I have a URL www.foo.com/bar/hello/world Can I use href= in such as way:
LinkText
In other words, because of the versioning repository I use for work, only the sublink /hello/world of the final URL will the same when I push the site live.

For reference, see the docs
However, in href, you can either use an absolute URL, such as https://www.foo.com/bar.html or, relative, something like /bar.html, where / refers to the webserver root (but not webserver's system root), or, you can use bar.html which points to a file in the same directory level.
Basically you want to have a /hello/world link, it will point to www.foo.com/hello/world.
If you want it www.foo.com/hello/world to point at www.foo.com/bar/hello/world, you can either rewrite the URL on the server, or, redirect the users to www.foo.com/bar/hello/world
For URL rewriting, see your appropriate webserver docs

Only if the source code is located in 'http://www.foo.com/bar' and then it needs to be going to a valid file extension to execute an action:
LinksText

Related

Href without http(s) prefix

I just have created primitive html page. Here it is: example
And here is its markup:
www.google.com
<br/>
http://www.google.com
As you can see it contains two links. The first one's href doesn't have 'http'-prefix and when I click this link browser redirects me to non-existing page https://fiddle.jshell.net/_display/www.google.com. The second one's href has this prefix and browser produces correct url http://www.google.com/. Is it possible to use hrefs such as www.something.com, without http(s) prefixes?
It's possible, and indeed you're doing it right now. It just doesn't do what you think it does.
Consider what the browser does when you link to this:
href="index.html"
What then would it do when you link to this?:
href="index.com"
Or this?:
href="www.html"
Or?:
href="www.index.com.html"
The browser doesn't know what you meant, it only knows what you told it. Without the prefix, it's going to follow the standard for the current HTTP address. The prefix is what tells it that it needs to start at a new root address entirely.
Note that you don't need the http: part, you can do this:
href="//www.google.com"
The browser will use whatever the current protocol is (http, https, etc.) but the // tells it that this is a new root address.
You can omit the protocol by using // in front of the path. Here is an example:
Google
By using //, you can tell the browser that this is actually a new (full) link, and not a relative one (relative to your current link).
I've created a little function in React project that could help you:
const getClickableLink = link => {
return link.startsWith("http://") || link.startsWith("https://") ?
link
: `http://${link}`;
};
And you can implement it like this:
const link = "google.com";
<a href={getClickableLink(link)}>{link}</a>
Omitting the the protocol by just using // in front of the path is a very bad idea in term of SEO.
Ok, most of the modern browsers will work fine. On the other hand, most of the robots will get in trouble scanning your site. Masjestic will not count the flow from those links. Audit tools, like SEMrush, will not be able to perform their jobs

Serving Polymer App to a /path not at root

So the first thing I want to do with a new Polymer app is deploy to a directory on an existing website. The only thing that seems to work is deploying to root /.
Let's take the Shop example. I do:
polymer init and choose shop
polymer build
Robocopy.exe .\build\bundled\ C:\inetpub\wwwroot\p\ /MIR
start http://localhost/p/
You see I'm on Windows. I assume that using IIS is irrelevant, since I'm relying on the server just to serve static content.
What do I need to edit in the shop template to make it work at the url http://localhost/p/?
The polymer-cli created apps came with assumption of serving from root level '/'. In generated project index.html you will find two comments
<!--
The `<base>` tag below is present to support two advanced deployment options:
1) Differential serving. 2) Serving from a non-root path.
Instead of manually editing the `<base>` tag yourself, you should generally either:
a) Add a `basePath` property to the build configuration in your `polymer.json`.
b) Use the `--base-path` command-line option for `polymer build`.
Note: If you intend to serve from a non-root path, see [polymer-root-path] below.
-->
<base href="/">
<!-- ... -->
<script>
/**
* [polymer-root-path]
*
* By default, we set `Polymer.rootPath` to the server root path (`/`).
* Leave this line unchanged if you intend to serve your app from the root
* path (e.g., with URLs like `my.domain/` and `my.domain/view1`).
*
* If you intend to serve your app from a non-root path (e.g., with URLs
* like `my.domain/my-app/` and `my.domain/my-app/view1`), edit this line
* to indicate the path from which you'll be serving, including leading
* and trailing slashes (e.g., `/my-app/`).
*/
window.Polymer = {rootPath: '/'};
// ...
</script>
if in this index.html file you comment out base tag and set window.Polymer rootPath to something like '/0/polymer-test/build/es5-bundled/' you will be able to navigate in app on http://localhost/0/polymer-test/build/es5-bundled/
The Polymer shop-app assumes it will be deployed on the server root. Therefore it has all of the links and routes hard-coded to that assumption.
This means, that you will have to change all of the following:
all absolute links between the pages,
all pattern parameters in app-route elements (this is not necessary when useHashAsPath = true),
all absolute imports, including the lazy ones via importHref,
update the absolute locations within the service worker (use instructions from here) and
all references to static content (CSS, images, JS files)
I'm guessing your main goal isn't porting the shop-app, but rather future proofing your own app so that it can also be deployed to non-root locations on the server.
For this, I will mention two ways, depending on which value of useHashAsPath you use for the app-location element. This setting defaults to false, which means that you must use full URLs, instead of the hashbang equivalents.
Scenario 1: useHashAsPath = true
This is the easiest of both approaches, since you simply treat all URLs between the pages as absolute links. For example: Tabs.
The next step is to reference all static content and imports via relative links.
The last step is to update your service worker as shown here.
Scenario 2: useHashAsPath = false
If you dislike the hashbang URLs, go for this scenario. As you can figure out, this approach is a bit more difficult, but still manageable (especially when you start from scratch).
Firstly, you should still use absolute links, since relative links between a complex routing scheme can quickly cause problems (e.g. when not all pages are on the same directory level).
But since absolute links are a no-go, you will have to add some additional pre-processing upon build time. The point is to prefix all links with, say __ROOT__, and then replace all of those values with your actual document root. The links would then look like something this:
Some page
And you would use gulp-replace or something similar to replace __ROOT_ with /your-document-root across all of your source files in order to produce something like this:
Some page
At this point, you've got your links fixed. But this is only part of the problem. You must also apply the same fix to all of your app-route elements. For example:
<app-route pattern="__ROOT__/some/page" [...]></app-route> // Other parameters ommited
As with other resources, such as images and CSS files, you can also include them as absolute links and add the __ROOT__ prefix, but I would advise against this and would rather use relative paths.
The last step is to update your service worker as shown here.
Read more about routing: https://www.polymer-project.org/1.0/blog/routing

Url redirection error in AngularJs

google
when i clicked on this tag than i redirected to
http://localhost:55943/www.google.com
I tried below code also,
$window.location.href = "www.google.com";
but both case I redirected to
http://localhost:55943/www.google.com page.
A href without a protocol definition will always be treated as a relative URL. You need to type http://www.google.com in order for it to be understood as an absolute URL.
Update your HTML to:
google
Also take a look at the W3 explanation of the HREF attribute.
As GordyD says, if you don't define any protocol it will be treated as a relative URL.
You need to prefix external URLs with http://, https:// or //
// will open the external url using the same protocol as your current application is running

form action="your-shop" : what does this mean without file extension?

I have seen filename(with file extension) or URL inside action attribute but never seen anything like this code below.
<form action="your-shop" name="shop_name_form" id="shop_name_form" method="post" onsubmit="return check_shopname(this);">
</form>
Here action attribute contains may be a file name but no file name extension.
What will it do when i press submit button?please explain it in details
It's a relative URL and will be resolved against the current URL. E.g. If the page is located at http://example.com/current/path/foo, the from will be submitted to http://example.com/current/path/your-shop.
File extensions have no meaning in a URL, how the path is processed depends on the server implementation.
At first it calls the Javascript function check_shopname();.
If it returns false, the submit will be canceled, so maybe there is no case where true is returned, because the Admin handles all the things on the client side!
The second possibility is, that the url of the sites are modified by mod_rewrite, and you get redirected to another file, for example, by adding a .html or .php extension.
If you will take you to the following link for form submission.
www.yourwebsite.com/your-shop. your-shop will be appeneded to the website's URL. Since there is no folder or other directory included. As Felix has mentioned already in comments, the File extension like .html has no meaning here in this context of action.

Django how to specify a base url

So there should be a very basic way to do this, but unfortunately I don't seem to be able to find it.
How can one set an Href link to point to the 'base website url' + the 'link', rather than adding the link to the current page.
I.e. if I'm at www.example.com/content1/
I want the search function to go to www.example.com/search/
and not www.example.com/content1/search
I could just specify "www.example.com/search/" but then if it page is deployed locally I end up with a bunch of links to non-existent pages or vice versa. How can I specify the The Base hosting URL using DJango (whichever the server is running, whether the hostname, the current server ip, localhost etc.).
The best way to do this is the name your urls and then use the url template tag. Example below:
First, name your views. Use something like:
urlpatterns = [
...
url(r'^search/$', views.search_view, name="search"),
...
]
In this example, you've got your url for your example.com/search/ view. It is named 'search', which can be used url template tags and using the reverse() function.
Next, in your template, use the url tag with your url name:
Search
You shouldn't need to add 'base website url' to your href, it is implied. Make sure href is prefixed with '/' to set and absolute path and no '/' for relative.
home
is the same as
home
and will work no matter which sub directory you are in
If you are on the homepage and you use the link:
sample
it will effectively equal:
sample
but that same link used on the page http://www.mywebsite.com/sample will equate to:
sample
using:
sample
Will always equate to the following no matter where on the site it is used:
sample
If you are using django consider using the url template tag as Alex suggested:
https://docs.djangoproject.com/en/dev/ref/templates/builtins/#url
Make the link point to /search.
Any link that starts with / is relative to the domain root (say, http://example.com/) whereas any other relative link is relative to the current URL.