WordPressで閲覧履歴ページを作成して、問い合わせフォームへの導線にする方法を紹介します。
閲覧履歴ページはこちら。
クッキーをセット
get_headerアクションにフックして、クッキーをセットします。
function my_set_cookie() {
if ( is_singular('post') ) {
$post_id = get_queried_object_id();
$expires = time() + 60 * 60 * 24 * 7;
if ( isset($_COOKIE['browsing_history']) ) {
$browsing_histories = explode(':', $_COOKIE['browsing_history']);
// 既に閲覧履歴に存在する場合は一旦削除
if ( in_array($post_id, $browsing_histories) ) {
$index = array_search($post_id, $browsing_histories);
array_splice($browsing_histories, $index, 1);
}
// 先頭に追加
array_unshift($browsing_histories, $post_id);
// 一定数以上の場合末尾から削除
if ( 10 < count($browsing_histories) ) {
array_pop($browsing_histories);
}
$browsing_history = implode(':', $browsing_histories);
setcookie('browsing_history', $browsing_history, $expires, '/');
} else {
setcookie('browsing_history', $post_id, $expires, '/');
}
}
}
add_action('get_header', 'my_set_cookie');
テンプレートを作る
続いて、テンプレートを作成します。
<?php
if ( isset($_COOKIE['browsing_history']) ) :
$browsing_histories = explode(':', $_COOKIE['browsing_history']);
$args = array(
'post__in' => $browsing_histories,
'orderby' => 'post__in'
);
$the_query = new WP_Query($args);
if ( $the_query->have_posts() ) :
?>
<div class="p-history">
<?php
while ( $the_query->have_posts() ) :
$the_query->the_post();
?>
<div class="p-history__item">
<div class="p-history__img">
<?php
if ( has_post_thumbnail() ) {
the_post_thumbnail();
}
?>
</div>
<div class="p-history__text">
<div class="p-history__title"><?php the_title(); ?></div>
<div class="p-history__link">
<a href="<?php the_permalink(); ?>"><i class="fas fa-angle-double-right"></i>この記事を読む</a>
</div>
<div class="p-history__link">
<a href="<?php echo esc_url(add_query_arg('article_id', get_the_ID(), get_permalink(get_page_by_path('contact-article')->ID))); ?> "><i class="fas fa-angle-double-right"></i>この記事に関して問い合わせる</a>
</div>
</div>
</div>
<?php
endwhile;
wp_reset_postdata();
?>
</div>
<?php
endif;
endif;
フォームを作る
最後に、フォームを作ります。今回はContact Form 7を使いました。
記事一覧の出力と初期値の設定はフックを使います。
function my_wpcf7_custom_form_tag_article( $tag ) {
do {
if ( empty($tag) ) break;
if ( $tag['name'] != 'article' ) break;
$args = array(
'posts_per_page' => -1,
);
$articles = get_posts($args);
if ( empty($articles) ) break;
$url_param = '';
if ( !empty($_GET['article_id']) && !is_array($_GET['article_id']) && is_numeric($_GET['article_id']) ) {
$url_param = sanitize_text_field($_GET['article_id']);
}
$i = 1;
foreach ( $articles as $article ) {
$tag['values'][] = $article->ID;
$tag['labels'][] = $article->post_title;
if ( $article->ID == $url_param ) {
$tag['options'][] = 'default:' . $i;
}
$i++;
}
}
while ( FALSE );
return $tag;
}
add_filter('wpcf7_form_tag', 'my_wpcf7_custom_form_tag_article', 10);
以上で実装完了です。
コメント