Jak wyeksportować do API WordPressa dane z wtyczki Yoast SEO

Yoast SEO to potężna i must have wtyczka dla wordpressa. Nię będą opisywał do czego ona służy, ale w tym miejscu pokaże ci jak wystawić do API wordpressa takie dane jak meta title i description. Takie dane w API będziesz mógł wykorzystać w swojej stronie np. opartej o Nuxt.js z SSR, czyli jednym słowem masz pełne wsparcie dla SEO.

Wszystko co musisz zrobić do dodać poniższy kod do pliku functions.php w twoim motywie.

add_action( 'rest_api_init', 'slug_register_yoast_seo_meta' );function slug_register_yoast_seo_meta() {
    register_rest_field( 'post',
        '_yoast_wpseo_title',
        array(
            'get_callback'    => 'get_seo_meta_field',
            'update_callback' => null,
            'schema'          => null,
        )
    );
    register_rest_field( 'post',
        '_yoast_wpseo_metadesc',
        array(
            'get_callback'    => 'get_seo_meta_field',
            'update_callback' => null,
            'schema'          => null,
        )
    );
}function get_seo_meta_field( $object, $field_name, $request ) {
    return get_post_meta( $object[ 'id' ], $field_name, true );
}

ten kawałek sprawia, że w API wordpressa pojawią się dwa najważniejsze pola z wtyczki Yoast SEO, czyli meta tytuł i opis, które są mega ważne jeśli chcemy dobrze pozycjonować naszą witrynę.

Kolejnym elementem jest przekazanie tych wartości w naszym projekcie nuxt.js. W moim przypadku w pliku pages/blog/_slug.vue wklejamy kod.

head () {
    return {
      title: this.post._yoast_wpseo_title,
      meta: [
        { hid: 'description', id: 'description', name: 'description', content: this.post._yoast_wpseo_metadesc }
      ]
    }
  }

To sprawi, że każdy nasz post pobierany z wordpressa poprzez bibliotekę axios, będzie zawierał meta dane z wtyczki Yoast SEO. Dane możemy wykorzystać też do tagów Open Graph.

head () {
    return {
        title: this.post._yoast_wpseo_title,
        meta: [
            { hid: 'description', id: 'description', name: 'description', content: this.post._yoast_wpseo_metadesc },
            { hid: 'og:title', name: 'og:title', content: this.post._yoast_wpseo_title },
            { hid: 'og:description', name: 'og:description', content: this.post._yoast_wpseo_metadesc},
        ]
    }
}