WordPress2019.10

ぱくたそのような画像・写真素材サイトを無料でWordPressとUltimate Memberで1日で作る方法その3

ぱくたそのような画像・写真素材サイトを無料でWordPressとUltimate Memebrで1日で作る方法その1、ぱくたそのような画像・写真素材サイトを無料でWordPressとUltimate Memberで1日 […]

執筆: 株式会社リソース・シェアリング ／公開日: 2019年10月24日

スポンサードサーチ

ぱくたそのような画像・写真素材サイトを無料でWordPressとUltimate Memebrで1日で作る方法その1、ぱくたそのような画像・写真素材サイトを無料でWordPressとUltimate Memberで1日で作る方法その2の続きです。

前回は、寄稿者に画像アップロード機能を追加しましたが、今回はフリー素材のダウンロード数を計測する方法について考えます。

素材のダウンロード数を計測する方法

画像素材のダウンロード数を計測するタイミングとしては、いくつかの方法が考えられます。

画像素材のダウンロードボタンを押された数で計測する
画像素材が実際にダウンロードされた数を計測する

また、カウント方法としても以下の以下の二つが想定されます。

新たにコードを用意して対応する
Google Analyticsを使う

今回は1日でできる内容ということで、Google Analyticsを使ってダウンロードボタンが押されたタイミングを計測する方法で行います。

Google Analyticsでイベントトラッキングを設定する方法

Google Analyticsを使ってダウンロードボタンを押されたタイミングを計測に使うためには、Google Analyticsのイベントトラッキングの機能を使います。

Google Analyticsでイベントトラッキングを設定するには、2つの要素が必要です。

まず最初に、通常のGoogle Analyticsのタグを設定してWebサイトのトラッキングを始める事。

次が、Google Analyticsのイベントトラッキング専用コードの埋め込みです。

Google Analyticsでイベントトラッキングを設定する方法については、以下の記事をご覧ください。

Google Analyticsでリンクなどのクリック計測をするイベントトラッキングの設定方法Google Analyticsでは、Wenサイトのアクセス数や滞在時間、どこのページに遷移したのか、といったデータだけでなく、Webサイト上でユーザーが起こした行動も知ることがで…resource-sharing.co.jp

このイベントトラッキングのコードを、構築した無料(フリー)画像・写真素材サイトに設定していきますが、Google Analyticsのタグは既に設定している前提で進めます。

以前ご紹介した、1日でWordPressで簡単に無料(フリー)画像・写真素材サイトを作る方法その1の中で、S、M、Lの3種類の画像ダウンロードボタンを表示するコードを書いていましたが、それを以下のように変更します。

<?php if (has_post_thumbnail()): ?>
	<?php 
		$thumb_ssize = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'thumbnail');
		if ($thumb_ssize[3]==1): ?>
		<a href="<?php the_post_thumbnail_url( 'thumbnail' ); ?>?dl_file" class="btn btn-info btn-lg" role="button" onclick="ga('send','event','Image','download','<?php the_title(); ?> S', 1);">S<br>横640px画像DL</a>
	<?php endif; ?>

	<?php 
		$thumb_msize = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'medium');
		if ($thumb_msize[3]==1): ?>
		<a href="<?php the_post_thumbnail_url( 'medium' ); ?>?dl_file" class="btn btn-success btn-lg" role="button" onclick="ga('send','event','Image','download','<?php the_title(); ?> M', 1);">M<br>横1200px画像DL</a>
	<?php endif; ?>

	<?php 
		$thumb_lsize = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'large');
		if ($thumb_lsize[3]==1): ?>
		<a href="<?php the_post_thumbnail_url( 'large' ); ?>?dl_file" class="btn btn-danger btn-lg" role="button" onclick="ga('send','event','Image','download','<?php the_title(); ?> L', 1);">L<br>横1920px画像DL</a>
	<?php endif; ?>
<?php endif; ?>

変更したのは、以下のリンク部分。

<a href="<?php the_post_thumbnail_url( 'thumbnail' ); ?>?dl_file" class="btn btn-info btn-lg" role="button">S<br>横640px画像DL</a>

このように、Google Analyticsのイベントトラッキングができるように、変えています。

<a href="<?php the_post_thumbnail_url( 'thumbnail' ); ?>?dl_file" class="btn btn-info btn-lg" role="button" onclick="ga('send','event','Image','download','<?php the_title(); ?> S', 1);">S<br>横640px画像DL</a>

実際にこれで取得したGoogle Analyticsのデータが以下のようになりますが、イベント、アクション、ラベルでのデータを取得できています。