Hash (#
) is a possible solution.
Changing the hash does not make the browser trigger a new request.
You can change the hash in two ways:
- Via links:
<a href="#noticias">Notícias</a>
- Via Javascript:
window.location.hash = "noticias";
It is possible to fire an event every time the hash is changed:
// usando jQuery
$(window).on("hashchange", function() {
alert(window.location.hash);
});
If the user directly accesses a hashed URL such as:
https://www.seu-site.com/#noticias
The ideal is to create an event that loads the requested content:
// novamente com jQuery
$(document).on("ready", function() {
var pagina = windows.location.hash;
if (pagina === "#noticias") {
// carrega "Notícias"
}
}
To stay more DRY, you can create a function that loads the correct page and fire it at both events (domready and hashchange):
var carregaPagina = function() {
var pagina = windows.location.hash;
if (pagina === "#noticias") {
// carrega "Notícias"
}
};
$(document).on("ready", carregaPagina);
$(window).on("hashchange", carregaPagina);
I rode a basic example in Jsfiddle.
About Google Analytics
My experience with Google Analytics is zero. But this answer do Stack-EN suggests manually inform the page request at the event hashchange
. I didn’t test it, but I believe this page informs you exactly how to do this.
There is also the History API
I’m not going to talk about it much, because I’ve never used it in practice. (It would be nice for someone with experience to give an answer about it).
Basically it provides a means to artificially manipulate the browser history, in conjunction with the URL, via Javascript, without the use of the hash. This is a new HTML5 feature, and will not work in old browsers:
Useful links
Is the entire site contained on this page? There is nothing loaded via Ajax or anything like that?
– mgibsonbr
The question is good. If you don’t mind, put the relevant code snippets so we understand how you’re trying to do this. You already know how it works Location hash and History API?
– user7261
@Andrey Great suggestion from History API, I didn’t know! Maybe with this and more the use of
analytics.js
there is some viable solution. (and to think that 10 minutes ago I was safe that what the AP wanted was impossible... : P)– mgibsonbr
@mgibsonbr The History API is new to HTML5 and doesn’t work in all browsers, but big companies like Google, Facebook and Twitter use it. Related to the question: http://answall.com/q/26078/7261
– user7261
@mgibsonbr there is a part of the site that has loading via Ajax. Andrey I will update the question including some snippets of code.
– Felipe Viero Goulart
@Felipestoker Disregard my first comment. For a moment I thought your question was about SEO (and if it was, it would be a bit more complicated), but if the case is "inform Analytics that the user has accessed such content" then it is much quieter... I don’t have firsthand experience to give an answer now (nor am I having time at the moment), but later if no solution has arisen I return to this question.
– mgibsonbr
All right. Anyway, I edited the question and put an example of how is my structure.
– Felipe Viero Goulart