解説
指定されたYoutubeURLをサイト内インライン・フレームでポップアップ表示させる。更新日：2017年2月9日
ショート・コード タイプ
自己完結型
使用方法
「Post Snippets」に登録しておくことで、投稿画面から簡単に呼び出すことができるようになる。
[ins_popup_youtube_link yotube_url="{yotube_url}" image_url="{image_url}" title="{title}" class_name="{class_name}"]
パラメタ
- yotube_url
- Youtube URL
- image_url
- Image URL
- class_name
- 適用されるクラス名称。
- title
- タイトル
コード(PHP)
[Wordpress] ショートコード・ライブラリ
1 file(s) 5.15 KB
下記コードを「function.php」に記載することで利用可能となる。
function popup_youtube_link_shortcode( $atts )
{
$param = shortcode_atts
(
array
(
'yotube_url' => '',
'image_url' => '',
'class_name' => '',
'title' => ''
),
$atts
);
if( !wp_is_mobile() )
{
$result = sprintf( '<a class="fancybox-iframe %s" href="%s" alt="%s">', $param['class_name'], $param['yotube_url'], $param['title'] );
$result .= sprintf( '<img src="%s" alt="%s" />', $param['image_url'], $param['title'] );
} else {
$result = sprintf( '<a class="%s" href="%s" alt="%s" target="_blank">', $param['class_name'], $param['yotube_url'], $param['title'] );
$result .= sprintf( '<img src="%s" alt="%s" />', $param['image_url'], $param['title'] );
}
$result .= sprintf( '</a>' );
return do_shortcode( $result );
}
add_shortcode( 'ins_popup_youtube_link', 'popup_youtube_link_shortcode' );
サンプル
上記画像をクリックすると、Youtube再生画面がポップアップ表示されます。
上記サンプル・コード
[ins_popup_youtube_link yotube_url="//www.youtube.com/embed/MRQwjAkyXsk" image_url="/wp-content/uploads/2017/02/no_image.jpg" title="TEST" class_name="sample_youtube_image"]
.sample_youtube_image
width: 50%;
display: block;
注意事項
重要
なし。
更新履歴
- 2016/11/12 … 浅野 利博
- 新規作成