Ajax URLs without #!, how to prevent falling into single.php on load or reload?

Question

I'm trying to make things properly with a single page ajax powered portfolio. I've read that there is no need of #! to make it crawlable by google. So I have clean URLs that updates with .pushState when I load a post.

My problem is that if you hit F5 or load directly an URL, you fall into the single.php. You can try it yourself here: http://www.youpiemonday.com/

How can I prevent falling into the article page?

I thought about redirecting from the single.php to the home and trigger the opening of the post there. But seing the comments, it doesn't seems to be a great idea. Anyway I'm stuck right now... You can see my thought process on StackOverflow here.

I'd love to here some feedback from Wordpress specialists... :)

---

EDIT: I may have found a simple/quick way to redirect to the homepage if the request is done when on single.php. I simply added this to function.php

add_action('wp', 'RedirecToPost'); 
 function RedirecToPost(){ 
    if($_SERVER['HTTP_X_REQUESTED_WITH']=='' && is_single()){ // if http request AND on single.php 
            wp_redirect( home_url() ); // redirect to home
            // THEN check the post requested AND trigger a click on its thumbnail

        }
  }

But I'm still at the same point. I need a way to check what was the requested post and trigger a click on its thumbnail. Now I'm really stuck by my scripting knowledge. How can I check the last page url (referer?) and find the href pointing to it in the current page?

Answer 1

In short: do not use a single.php. If you only have a index.php, than all posts are displayed with this template because WP can not find any other template to display the content.

Your problem in a human language:

• If the url is www.youpiemonday.com, load the frontpage (index.php, home.php or what else)

• If the url is www.youpiemonday.com with a parameter, than display the single post within the parameter with single.php.

That's what WordPress will do because youpiemonday.com/singlepost/ will be transformed (internaly) by WP into www.youpiemonday.com/?p=123 (where 123 is the post ID of singlepost)

So what you will do is this:

Everytime someone called www.youpiemonday.com, render the frontpage (index.php, home.php, ...) with no single post in the portfolio opened. But if there is a paramter in the url (/singlepost/ ), than render the frontpage and open that single post (if available).

Delete or rename your single.php to force WP to use the index.php of your theme to display every kind of posts. To trigger the click, you can add a switch in your functions.php

add_action( 'wp_head', 'trigger_click_on_single_post' );

function trigger_click_on_single_post(){

$js_template = '

<script type="text/javascript">

jQuery( document ).ready(

  function( $ ){

  // create the js to trigger the link here
     LinktoRef = $(".ProjectWrap" ).find( "a" ).href; // the href in the thumbnail

     if ( "{{link_to_click}}" === LinktoRef ){
       find( "a" ).trigger( "click" );
     }

   }

);

</script>

';


  if( is_single() ){

    global $post;

    $replace = get_permalink(); // create the propper url here

    $js_output = str_replace( '{{link_to_click}}', $replace, $js_template );

    echo $js_output;

  }
}

PS: I don't not why, but the code formatting on WPSE don't like the heredoc syntax. So there is a litte break in the codeblock.