Rendere il mio WordPress con AJAX indicizzabile

12 ago 2011, 05:14:30
Visualizzazioni: 4.15K
Voti: 9

Ho letto il seguente documento e sto cercando di applicare questo schema al mio sito che utilizza WordPress: http://code.google.com/intl/fr-CA/web/ajaxcrawling/index.html

Se visiti il mio sito all'indirizzo http://www.visualise.ca/ vedrai che carica i post all'interno della home page e l'URL diventa http://visualise.ca/#!/anne-au-cherry quando questo post viene caricato. Una versione statica dello stesso contenuto è disponibile per i crawler all'indirizzo http://visualise.ca/anne-au-cherry ma se un visitatore con un browser lo visita, verrà reindirizzato a http://visualise.ca/#!/anne-au-cherry (questo viene fatto con JavaScript).

Per fornire al crawler il necessario ?_escaped_fragment_= ho utilizzato un hack per WordPress che ho trovato in rete: http://www.wordpress-fr.net/support/sujet-54810-add-action-parse-request e ora GoogleBot può vedere il contenuto delle mie pagine con AJAX. Pensavo che fosse tutto risolto.

Ma quando incollo un link di un post su Facebook (ad esempio), non è in grado di leggere il contenuto della pagina, quindi ho dedotto che il mio sito non rispetta realmente lo schema descritto nella documentazione di Google dato che Facebook lo supporta (Se incolli http://twitter.com/#!/gablabelle funzionerà). Quindi, dato che utilizzo il plugin jQuery.address per ottenere il mio hashbang (#!), sono andato sul loro sito e ho scaricato i file di esempio per vedere quali fossero le differenze tra i loro file e i miei e mi sono reso conto che probabilmente utilizzano una funzione PHP per creare gli snapshot HTML necessari: https://github.com/bartaz/jquery-address/blob/master/samples/crawling/index.php perché questo è il motivo, credo, per cui Facebook non riesce a leggere i miei.

<?php

    error_reporting(E_ALL ^ (E_NOTICE | E_WARNING));

    $fragment = $_REQUEST['_escaped_fragment_'];
    $file = 'data/' . (isset($fragment) && $fragment != '' && $fragment != '/' ? preg_replace('/\//', '', $fragment) : 'home') . '.xml';
    $re = '/(^<[^>]*>)|(\n|\r\n|\t|\s{2,4})*/';

    $handle = fopen($file, 'r');
    if ($handle != false) {
        $content = preg_replace($re, '', fread($handle, filesize($file)));
        fclose($handle);
    } else {
     $content = 'Pagina non trovata!';
        header(php_sapi_name() == 'cgi' ? 'Status: 404' : 'HTTP/1.1 404');
    }

?>

Quindi credo che potrei utilizzare una funzione PHP simile per servire gli snapshot HTML invece di utilizzare l'hack per WordPress, ma avrei bisogno di adattarla a WordPress. Il problema è che non sono un programmatore e ho fatto del mio meglio finora.

I miei post sono in questo formato: http://visualise.ca/#!/anne-au-cherry e la versione statica è disponibile all'indirizzo http://visualise.ca/anne-au-cherry (dove anne-au-cherry è lo slug del post e cambia a seconda della pagina che stiamo visualizzando).

Quindi la mia domanda è: qualcuno può confermare che sono sulla strada giusta e, se possibile, aiutarmi a creare quella funzione PHP?

Grazie mille per il tuo tempo e il tuo aiuto!

2
Commenti

Hai pensato di generare una sitemap? Ad esempio, Yoast WordPress SEO genera automaticamente una sitemap per i tuoi contenuti e la invia a Bing, Google e Yahoo...

User User
14 set 2011 20:55:18

+1 all'idea della sitemap. Sono ancora confuso riguardo al parametro URL che viene passato per mostrare il sito a Google, però. Potresti incollare un URL che includa sia a) il contenuto della pagina che b) funzioni senza JavaScript? Se non esiste, non c'è nulla che Google o Facebook possano scansionare.

brandwaffle brandwaffle
23 dic 2011 17:43:30
Tutte le risposte alla domanda 3
0

Specificamente EVITA di utilizzare "hashbang" ("!#") per rendere i siti WordPress basati su AJAX indicizzabili.

Non vuoi davvero utilizzare il metodo "hashbang" su un sito WordPress.

Il "!#" è più una soluzione approssimativa per siti che non possono fornire una versione statica analoga alla loro versione AJAX. Il suo utilizzo in generale non è raccomandato da Google a meno che non ci siano alternative disponibili.

Non c'è alcun vantaggio nell'implementare un sistema hashbang in WordPress. Una soluzione AJAX front-end per WordPress dovrebbe funzionare con lo schema di URL esistente (senza hash, senza bang).

Riassunto: WordPress è naturalmente indicizzabile; semplicemente non comprometterlo utilizzando hash-bang.

31 gen 2012 20:44:15
0

Se ti riferisci specificamente al fatto che Facebook non mostra correttamente le meta informazioni della tua pagina, dovresti considerare il plugin OpenGraph per WordPress, poiché aggiungerà gli appropriati metadati og:attribute. http://wordpress.org/extend/plugins/opengraph/

Inoltre, puoi aggiungere un link come questo nell'header

<link rel="canonical" href="link_back_to_real_post_url">

E vedere se questo fa qualcosa.

Devo chiederti però, perché stai facendo questo? Twitter è stato fortemente criticato per questa struttura degli URL proprio perché è difficile da scansionare. Non sto dicendo che non dovresti farlo, ma sono davvero curioso di sapere qual è il motivo :)

23 dic 2011 17:39:07
1

Quello che ho fatto in realtà è non utilizzare gli hashbang come suggerito da WraithKenny.

Utilizzando il plugin jQuery address con il metodo $.address.state(value) per impostare il percorso base del sito web che viene utilizzato nella gestione dello stato HTML5 e il metodo $.address.value(value) per impostare il valore corrente del deep linking, sono riuscito a fare ciò che desideravo.

http://visualise.ca/

I post (clicca su una miniatura dell'immagine) vengono caricati via AJAX e l'URL cambia contemporaneamente, i post esistono autonomamente utilizzando, ovviamente, la stessa struttura di permalink quindi sono completamente indicizzabili.

L'unico problema sarà per i browser più vecchi che, credo (deve essere verificato), vedranno ancora gli hashbang.

Dato che non sono uno sviluppatore mi ci è voluto molto tempo per capire. :-/ Ma ora sono abbastanza soddisfatto dei risultati ;-)

jQuery address: http://www.asual.com/jquery/address/

20 feb 2012 19:28:14
Commenti

Dai un'occhiata al plugin jQuery pjax. https://github.com/defunkt/jquery-pjax È molto simile ma si occuperà di caricare il contenuto per te, ecc. Ecco un esempio di ciò che ho fatto con esso per un tema child di Twenty Eleven https://github.com/chrisguitarguy/pjaxy

chrisguitarguy chrisguitarguy
20 feb 2012 20:19:56