I build website with all pages in ajax.
The problem is the ajax pages havn't header and footer like index page.
So I want google will index the ajax pages after they inserted to index.
In other words, I want google to index my ajax pages with header and footer.
How can I do that?
Thanks!
You can follow googles instructions on this page: https://developers.google.com/webmasters/ajax-crawling/
This solutions work by making an image of you website specific for Googles searchengine.
Alternatively you could make a mirrorsite available for browsers without JavaScript enabled, which Google easily will index.
Have regular, complete webpages (you can generate them on the server) at the URLs you want the browser to display and link to them as normal
Provide an web api that JavaScript can get the content for a page from
Have your JavaScript:
Bind event handlers to the links
Map the URL in the href attribute of the clicked link onto the web api
Use Ajax to fetch the data from the web api (as mentioned in step 2)
Update the page with that data
Change the URL to the actual page (as mentioned in step 1) using pushState
Related
I am trying to build a site with JQM, JQuery, PHP and MYSQL. The idea is to use ajax to pull information from the database (JSON) to insert it on the page. My only issue is that I am not sure how to implement the ajax in a way that makes it easy to bookmark pages and go back (to the last page) on the JQM site. I was thinking to use pushstate but am not sure on how to implement it. Can anyone point me to a tutorial on how to do this effectively or if they can put up some example code.
Save it in the page url, so lets so your page URL is: test_page.php and json URL is test_json.php. You want to bookmark the page for all with the name "mark". So you bookmark test_page.php?name=mark. Then on page load you define it to your json to get all for mark.
This way you can bookmark the URL and just fetch according to the parameters in the URL.
I have created an ajax driven website which can load any page when given the correct parameters. For instance: www.mysite.com/?page=blog&id=7 opens a blog post.
If I create a sitemap with links to all pages within the website will this be indexed?
Many thanks.
If you provide a url for each page that will actually display the full page, then yes. If those requests are just responding with JSON, or only part of a page, then no. In reality this is probably a poor design SEO wise. Each page should have it's own URL e.g. www.mysite.com/unicorns instead of www.mysite.com/?page=blog&id=1, and the links on the page should point to those. Then you should be using Javascript to capture all the link click events for the AJAX links, and then use Javascript how you like to update the page. Or better yet maybe try out PJAX which will load just the content of a page instead of a full page refresh speeding things up a little without really any changes from your normal site setup.
You do realize that making that sitemap all your search engine links will be ugly.
As Google said a page can still be crawled with nice url if you use fragment identifier:
<meta name="fragment" content="!"> // for meta fragment
and when you generate your page by ajax append the fragment to URL:
www.mysite.com/#!page=blog-7 //(and split them)
The page should load content directly in PHP by using $_GET['_escaped_fragment_']
As I've read that Bing and Yahoo started crawling with same process.
As some of you may know, Google is now crawling AJAX. The implementation is by far something elegant, but at least it still applies to Yahoo and Bing AFAIK.
Context: My site is driven by Wordpress & HTML5. An Custom Post Type has tree types of content, and the contents of these are driven by AJAX. The solution I came for not using hashbangs (#!) until fully understand how to implement them is rather "risqué". Every link as HREF linking to *site.com/article-one/?tab=first_tab*, that shows only the contents of the selected tab (<div>Content...</div>). Like this:
This First Tab
As you may note, data-tab is the value that JavaScript sends with AJAX Get, that gets the related content and renders inside a container. At the other side, the server gets the variable and does a <?php get_template_part('tab-first-tab'); ?> to deliver the content.
About the risqué, well, I can see that Google and other search engines will fetch *http://site.com/article-one/?tab=first_tab* instead of http://site.com/article-one/, making users come to that URL instead of showing the home page with the tab content selected automatically.
The problem now is the implementation to avoid that.
Hashbang: From what I learned, I should do this.
HREF should become site.com/article-one/#!first-tab
JS should extract the "first-tab" of the href and pass it out to $_GET (just for the sake of not using "data-tab").
JS should change the URL to site.com/article-one/#!first-tab
JS should detect if the URL has #!first-tab, and show the selected tab instead of the default one.
Now, for the server-side implementation, here is where I'm kind lost in the woods.
How Wordpress will handle site.com/article-one/?_escaped_fragment_=first-tab?
Do I have to change something in .htaccess?
What should have the HTML snapshot? My guess is all the site, but with the requested tab showing, instead of showing only the content.
I think that I can separate what Wordpress will handle when it detects the _escaped_fragment_. If is requested, like by Google, it will show all the content plus the selected content, and if not, it's because AJAX is requesting it and will show only the content. That should be right?
I'm gonna talk third person.
Since this has no responses, I have a good one why you should not do this. Yes, the same reason why Twitter banged them:
http://danwebb.net/2011/5/28/it-is-about-the-hashbangs
Instead of doing hashbangs, you should make normal URIs. For example, an article with summary tab on should be "site.com/article/summary", and if it is the default one that pops out (or is it already requested) it also should change to that URI using pushState().
If the user selects the tab "exercises", the URL should change to "site.com/article/exercises" using pushState() while the site loads the content throught AJAX, and while you still maintain the original href to "site.com/article/exercises". Without JavaScript the user should still see the content - not only the content, the whole page with the tab selected.
For that to work, some editing to the .htaccess to handle the /[tab] in the URL should be done.
So I understand this may come across as a open question, but I need away to solve this issue.
I can either make the site do ajax request that load the body content, or I can have links that re-loads the whole page.
I need the site to be SEO compliant, and I would really like the header to not re-load when the content changes, the reason is that we have a media player that plays live audio.
Is there away that if Google BOT or someone without ajax enabled it does the site like normal href but if ajax or javascript allowed do it the ajax way.
Build the website without JS first, ensure it works as wished, each link linking a new unique page. Google parses your site without JS, so what you see with JS off is what he sees.
Then add the JS, with click handlers to prevent the default page reload and do your ajax logic instead. You could use JQuery and .load() to do this quite easily.
Other solution, you could use the recommended Google method ( https://developers.google.com/webmasters/ajax-crawling/ ), but it's more work and less effective SEO-wise.
Or you can put your audio player in a iFrame...
I want to put Google Analytics code after people signup AJAX contact form.
If I put this in PHP file that gets submitted by AJAX post request. Do you think this will trigger this javascript codes when it runs?
In theory, you could create a results page that contains your Analytics code. On getting back results from Ajax dynamically create an iFrame that loads your results page. Set the iFrame's display attribute to none (e.g. style="display:none;").
This should have the results page show up in your Analytics stats without visitors to the site seeing it.
Edited to add: Google's official approach is documented here: https://support.google.com/analytics/bin/answer.py?hl=en&answer=1033068
It's less of a hack than the above :-)