カスタムフィールドにTwitterのユーザー名のみ記入し、タイムラインを表示する方法!

Article views158 VIEW

音楽イベントのWebを作成し出演者の情報を公開しました。

カスタム投稿に【アーティスト】を作成し、プロフィールをカスタムフィールドで流し込む形で作りました。

その際にアーティストオフィシャルTwitterのカスタムフィールドを作成しました。

しかし、Twitterから大量のウィジェットを作るのは大変です。

2016 07 16 2.37.58 1024x590 - カスタムフィールドにTwitterのユーザー名のみ記入し、タイムラインを表示する方法!

ここから一つ一つウィジェットを生成するなんて現実的じゃない!

そこで考えた事です。

カスタムフィールドにユーザー名を入力し、テンプレートのPHP上でTwitterの情報を引っ張ってこれる様に出来るんじゃない!?

Advanced Custom Fieldsを使用。フィールド名は【twitter】としました。

 

テンプレートにPHPに以下を記入

登録したアカウント名の記入方法は@nara_nissinならば@を抜いたnara_nissinのみ記入します。
<?php if( get_field('twitter') ) { ?> //条件分岐部分 twitterというカスタムフィールドに記入がない場合は以下を表示しないように設定
                
<a class="twitter-timeline"
     href="https://twitter.com/<?php the_field('twitter'); ?>" <!-- ここにURLを記入する。後ろに<?php the_field('twitter'); ?>を記入 -->
     height="400"
     data-tweet-limit="3" <!-- タイムラインの投稿を表示する数を設定 -->
>
Tweets by @<?php the_field('twitter'); ?>
</a>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
<?php } ?>

以上です。

下はサンプルだ!CSSで整えるんだ!


これで表示できました。

色々パラメーターも変更できるので、とっても便利です。

https://dev.twitter.com/ja/web/embedded-timelines/parameters

これで各カスタム投稿ページに別アカウントのタイムラインを表示できました!

やったぜ!

Pocket
pinit fg en rect gray 28 - カスタムフィールドにTwitterのユーザー名のみ記入し、タイムラインを表示する方法!
line88x20 - カスタムフィールドにTwitterのユーザー名のみ記入し、タイムラインを表示する方法!
[`evernote` not found]

Posted in PHP

Leave a Comment

CAPTCHA