web-dev-qa-db-fra.com

Cacher les styles de Facebook

Certaines de mes pages/publications ont des feuilles de style personnalisées très courtes au début. Je sais que ce n'est pas une bonne pratique, mais cela a très bien fonctionné jusqu'à présent. Le problème, toutefois, concerne les liens sur Facebook: Facebook génère automatiquement un aperçu de la page, qui inclut une image, le titre de la page et un extrait du début du contenu du message. L'extrait de contenu de la publication ne montre que la feuille de style que j'ai directement dans la publication. Facebook n'ignore pas le fait qu'il s'agisse de HTML. Que puis-je faire à la fin de WordPress pour vraiment cacher ce code? Dois-je mettre tous ces styles dans mon CSS personnalisé, puis donner à chaque classe la classe appropriée? (Pour clarifier, la balise <style> n'apparaît pas, mais uniquement le contenu de la feuille de style. Elle n'apparaît pas sur la page dans WordPress, mais uniquement dans l'extrait de Facebook. Il s'agit d'un blog auto-hébergé.)

facebookstylesheetcodestyles
1
vaindil

Vous pouvez utiliser Open Graph Protocol pour définir les données extraites par Facebook de votre site:

http://developers.facebook.com/docs/opengraphprotocol/

La métabalise pour la description a cette forme:

<meta property="og:description" content="my custom description for single post" />

Vous pouvez utiliser des plugins, comme

http://wordpress.org/extend/plugins/wp-facebook-open-graph-protocol/

le faire pour vous.

Vous pouvez alors déboguer votre page ici:

http://developers.facebook.com/tools/debug

pour voir comment Facebook récupère votre page.

ps: Si vous aimez les exemples de code, j'ai extrait l'extrait de code suivant à partir du plug-in ci-dessus (protocole WP Facebook Open Graph) qui gère la partie og:description et l'injecte dans l'en-tête via le wp_head crochet:

// do descriptions
if ( is_singular() ) {
    if ( has_excerpt( $post->ID ) ) {
        $wpfbogp_description = strip_tags( get_the_excerpt( $post->ID ) );
    } else {
        $wpfbogp_description = str_replace( "\r\n", ' ' , substr( strip_tags( strip_shortcodes( $post->post_content ) ), 0, 160 ) );
    }
} else {
    $wpfbogp_description = get_bloginfo( 'description' );
}
echo '<meta property="og:description" content="' . esc_attr( apply_filters( 'wpfbogp_description', $wpfbogp_description ) ) . '"/>' . "\n";
1
birgire

Utiliser Open Graph devrait résoudre ce problème pour vous. Lorsque vous utilisez Open Graph, vous indiquez essentiellement aux réseaux sociaux quel titre, description, image, etc. utiliser.

J'utilise WordPress SEO by Yoast , et cela fonctionne à merveille car vous pouvez également inclure les balises Open Graph supplémentaires nécessaires pour les cartes Twitter.

J'espère que ça aide.

1
Eric Binnion