MediaPackの埋め込みコードを利用する方法

概要

株式会社ミックスネットワークが提供しております「MediaPack」をご使用される場合の連携方法についてご説明致します。

基本的にはMediaPackから発行されます「公開タグ」をソーシャルキャストの「埋め込みコード」に登録して頂くことで連携が可能になります。
しかし埋め込みコードで登録された動画の再生回数や視聴履歴は、ソーシャルキャスト上では記録することが出来ません。 そこで、再生回数のカウントをし、視聴履歴を記録するためには、テンプレートの修正を行って頂くことで再生数のカウントが可能になります。

注意

  • 再生数のカウントが不要な場合は以下の作業は必要ありません。
  • MediaPack」専用の対応となります。埋め込みコードに他のサービスを混在して利用する場合にはこの方法は利用出来ません。

MediaPackからタグのコピー

「MediaPack」の管理画面で動画の登録を行って下さい。(動画登録方法は「MediaPack」のマニュアルをご覧ください。)

  1. 動画一覧からソーシャルキャストに登録する動画を開き「公開タグ」をコピーしてください

テンプレートの修正

ソーシャルキャストの管理画面からデザイン管理を開いて下さい。修正が必要なテンプレートはPCとスマートフォンそれぞれで「動画プレイヤー(埋め込みコード)」になりますので開いて頂き、下記のコードで上書き保存して下さい。

PC版 動画プレイヤー(埋め込みコード)

<script type="text/javascript">
  commonData['contentsId'] = {{contents.id}};
</script>
<div>
{{contents.getConfig('embed_code')|replace({'<script>': "<script>var firstPlay = true;__p._player.events = {'play' : function() {if (firstPlay) Socialcast.setPlayCount(commonData['contentsId']);firstPlay = false;}};"})|raw}}
</div>

スマートフォン版 動画プレイヤー(埋め込みコード)

<script type="text/javascript">
  commonData['contentsId'] = {{contents.id}};
</script>
<div>
{% set smtEmbedCode = contents.getConfig('smt_embed_code') %}
{% if smtEmbedCode|length %}
  {{smtEmbedCode|replace({'<script>': "<script>var firstPlay = true;__p._player.events = {'play' : function() {if (firstPlay) Socialcast.setPlayCount(commonData['contentsId']);firstPlay = false;}};"})|raw}}
{% else %}
  {{contents.getConfig('embed_code')|replace({'<script>': "<script>var firstPlay = true;__p._player.events = {'play' : function() {if (firstPlay) Socialcast.setPlayCount(commonData['contentsId']);firstPlay = false;}};"})|raw}}
{% endif %}
</div>

このようにしておくことで、MediaPackの動画の再生数をソーシャルキャスト上でも記録することが出来ます。

テンプレートの修正を行わない場合

たとえば、特定の埋め込みコードの動画のみ再生数、視聴履歴を記録する場合は、MediaPackの「公開タグ」を都度編集して、ソーシャルキャストの埋め込みコードに登録を行って下さい。

<script src='//media-pack.net/library/_vcast/js/p.js'></script>
<script>var firstPlay = true;__p._player.events = {'play' : function() {if (firstPlay) Socialcast.setPlayCount(commonData['contentsId']);firstPlay = false;}};</script>
<script>__p._player.create({m:"XXXXXXXXXXXXXXXX",d:"//media-pack.net",g:"XXXXXXXXXXXXXXXX"});</script>

MediaPackから出力された公開タグを上記のように編集することで連携が可能です。

2行目の編集

<script>var firstPlay = true;__p._player.events = {'play' : function() {if (firstPlay) Socialcast.setPlayCount(commonData['contentsId']);firstPlay = false;}};</script> を挿入して下さい。