Shortcode APIを使用したFlickr画像ギャラリー

 /** * Enqueue scripts and styles. * * @since Twenty Fifteen 1.0 */ function twentyfifteen_scripts() { // Add custom fonts, used in the main stylesheet. wp_enqueue_style( 'twentyfifteen-fonts', twentyfifteen_fonts_url(), array(), null ); // Add Genericons, used in the main stylesheet. wp_enqueue_style( 'genericons', get_template_directory_uri() . '/genericons/genericons.css', array(), '3.2' ); // Load our main stylesheet. wp_enqueue_style( 'twentyfifteen-style', get_stylesheet_uri() ); // Load the Internet Explorer specific stylesheet. wp_enqueue_style( 'twentyfifteen-ie', get_template_directory_uri() . '/css/ie.css', array( 'twentyfifteen-style' ), '20141010' ); wp_style_add_data( 'twentyfifteen-ie', 'conditional', 'lt IE 9' ); // Load the Internet Explorer 7 specific stylesheet. wp_enqueue_style( 'twentyfifteen-ie7', get_template_directory_uri() . '/css/ie7.css', array( 'twentyfifteen-style' ), '20141010' ); wp_style_add_data( 'twentyfifteen-ie7', 'conditional', 'lt IE 8' ); wp_enqueue_script( 'twentyfifteen-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array(), '20141010', true ); if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) { wp_enqueue_script( 'comment-reply' ); } if ( is_singular() && wp_attachment_is_image() ) { wp_enqueue_script( 'twentyfifteen-keyboard-image-navigation', get_template_directory_uri() . '/js/keyboard-image-navigation.js', array( 'jquery' ), '20141010' ); } wp_enqueue_script( 'twentyfifteen-script', get_template_directory_uri() . '/js/functions.js', array( 'jquery' ), '20150330', true ); wp_localize_script( 'twentyfifteen-script', 'screenReaderText', array( 'expand' => '<span class="screen-reader-text">' . __( 'expand child menu', 'twentyfifteen' ) . '</span>', 'collapse' => '<span class="screen-reader-text">' . __( 'collapse child menu', 'twentyfifteen' ) . '</span>', ) ); wp_register_script( 'galleria', '//cdn.jsdelivr.net/g/galleria@1.4.2(galleria.min.js+plugins/flickr/galleria.flickr.js)', false, false, false ); //     Galleria } add_action( 'wp_enqueue_scripts', 'twentyfifteen_scripts' ); 

 // Add Shortcode function flickr_gallery_shortcode( $atts ) { // Attributes extract( shortcode_atts( array( 'set' => '', ), $atts ) ); // Code return '<div style="position: relative; padding-bottom: 71%; height: 0; overflow: hidden;"> <div id="galleria"></div> </div> <script> var speed = 5000; var clickNext = true; Galleria.loadTheme("//cdn.jsdelivr.net/galleria/1.4.2/themes/classic/galleria.classic.js"); Galleria.on("image", function(e) { var img = e.imageTarget; var picSource = $(img).attr("src"); if (picSource == undefined) { picSource = $("img:first").attr("src"); } var slashPieces = picSource.split("/"); var lastSlash = (slashPieces[slashPieces.length - 1]); var lastPieces = lastSlash.split("_"); }); Galleria.run("#galleria", { responsive: true, preload: 4, initialTransition: "fade", debug: true, idleMode: false, pauseOnInteraction: true, fullscreenDoubleTap: true, backlink: false, transition: "fadeslide", showInfo: true, showCounter: true, clicknext: clickNext, thumbnails: true, flickr: "set:' . $set . '", height: 0.7, flickrOptions: { description: true, max: 100, imageSize: "big", sort: "interestingness-desc", thumbSize: "thumb", }, extend: function() { var gallery = this; this.$("image-nav-right").click(function() { if (speed) { if (!gallery.isPlaying() && !clickNext) { gallery.play(); } else if (clickNext) { if (!gallery.isPlaying()) { gallery.play(); } } } }); this.$("thumb-nav-left, thumb-nav-right").click(function() { if (gallery.isPlaying()) { gallery.pause(); } }); $("#flick").click(function() { gallery.pause(); }); } }); $(document).ready(function() { var iOS = (navigator.userAgent.match(/(iPad|iPhone|iPod)/g) ? true : false); var layout = "responsive"; }); </script>'; } add_shortcode( 'flickr', 'flickr_gallery_shortcode' );