Best solution to redirect URLs to an Ajax version?

Question

Further question about Ajax permalink in wordpress Pluto Theme

So it's a fully Ajax Wordpress theme, all URLs appearing in Google are not from the user version website but the 'underneath' version of it.

Example: Link appearing in Google: www.thaiorchid.be/menus/ (strange black page) Compared to the user webpage: www.thaiorchid.be/#menu-item-21

I'm searching for the best way to automatically redirect all pages (like the one /menus to the one /#menu-item-21) to at least have something presentable, any idea what would be the best solution?

Answer 1

Unfortunately I'm currently not able to test the following, but I believe that something like this should work, given that the standard Wordpress menu is used within this theme.

// functions.php
function get_menu_id_for_post($post_id) {
  global $wpdb;
  $query = $wpdb->prepare(
    "
      SELECT post_id 
      FROM $wpdb->postmeta 
      WHERE meta_key = '_menu_item_object_id' 
      AND meta_value = %s
    ", 
    $post_id
  );
  $menu_id = $wpdb->get_var($query);
  return $menu_id;
}

function is_ajax_request() {
  return (!empty($_SERVER['HTTP_X_REQUESTED_WITH']) &&   
          strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest');
}

// partial template, right on the top:
<?php if (!is_ajax_request()): ?>
  <script type="text/javascript"> 
    window.location = "http://www.thaiorchid.be/#menu-item-<?php echo get_menu_id_for_post($post->ID) ?>";
  </script>
<?php endif; ?>

This will determine the correct menu ID based on the current post’s or page’s ID and then redirect using Javascript if the current page as not been loaded via AJAX.

Again, I can’t test this right now at all, but maybe it can help you to go on.

Answer 2

For backwards compatibility write the links in a correct fashion but add a relation/class what ever you feel comfortable with:

<a href="http://example.com/path/to/file.html" rel="ajax" >link</a>

Then from jquery:

$('a[rel=ajax]').click(function(e) {
    //do whatever
    e.preventDefault();
});

In some instances I've skipped adding the rel="ajax" or class="ajax" and just looked for links that point back to the domain of my website:

$('a[href^="http://example.com"]').click(function(e) {
    //do whatever
    e.preventDefault();
});

Usually my do whatever method made an ajax get request to the very same addres that was in the initial link. It just added a parameter ?ajax=1 so the template could skip outputting the header/footer (when I used AHAH) or to json_encode the response (for JSON output).