{"id":23438,"date":"2023-10-07T12:01:15","date_gmt":"2023-10-07T03:01:15","guid":{"rendered":"https:\/\/motoki-design.co.jp\/wordpress\/?p=23438"},"modified":"2024-09-05T15:18:25","modified_gmt":"2024-09-05T06:18:25","slug":"swell-post-slider","status":"publish","type":"post","link":"https:\/\/motoki-design.co.jp\/wordpress\/swell-post-slider\/","title":{"rendered":"SWELL\u2502\u8a18\u4e8b\u30b9\u30e9\u30a4\u30c0\u30fc\u3092\u8a18\u4e8b\u3067\u8868\u793a\u3059\u308b\u65b9\u6cd5"},"content":{"rendered":"\n

\u30c8\u30c3\u30d7\u30da\u30fc\u30b8\u306e\u76ee\u7389\u6a5f\u80fd\u3067\u3042\u308b\u8a18\u4e8b\u30b9\u30e9\u30a4\u30c0\u30fc\u3092\u4f7f\u3063\u305f\u3053\u3068\u304c\u3042\u308a\u307e\u3059\u3067\u3057\u3087\u3046\u304b\uff1f<\/p>\n\n\n\n

SWELL\u306e\u30c7\u30e2\u30b5\u30a4\u30c8<\/a>\u3067\u3082\u4f7f\u308f\u308c\u3066\u3044\u308b\u3001\u8a18\u4e8b\u3092\u30b9\u30e9\u30a4\u30c9\u8868\u793a\u3055\u305b\u308b\u6a5f\u80fd\u3067\u3059\u304c\u3001\u30c8\u30c3\u30d7\u30da\u30fc\u30b8\u306b\u3057\u304b\u4f7f\u3048\u307e\u305b\u3093\u3002<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

\u3053\u306e\u8a18\u4e8b\u30b9\u30e9\u30a4\u30c0\u30fc\u3092\u901a\u5e38\u8a18\u4e8b\u3067\u3082\u4f7f\u3048\u308b\u3088\u3046\u306b\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3057\u3066\u307f\u307e\u3057\u305f\u3002<\/p>\n\n\n\n

\u30b7\u30e7\u30fc\u30c8\u30b3\u30fc\u30c9\u306b\u3057\u3066\u3044\u308b\u306e\u3067\u30a6\u30a3\u30b8\u30a7\u30c3\u30c8\u7b49\u306b\u3082\u4f7f\u3048\u307e\u3059\u3002<\/p>\n\n\n\n

\u8a18\u4e8b\u30b9\u30e9\u30a4\u30c0\u30fc\u3068\u306f\uff1f<\/h2>\n\n\n\n

\u30c8\u30c3\u30d7\u30da\u30fc\u30b8\u3067\u4f7f\u3046\u3053\u3068\u304c\u3067\u304d\u308b\u8a18\u4e8b\u30ab\u30fc\u30c9\u3092\u30b9\u30e9\u30a4\u30c9\u3055\u305b\u308b\u6a5f\u80fd\u3067\u3059\u3002<\/p>\n\n\n

\t\t\t
\n\t\t\t\t
\n\t\t\t\t\tSWELL<\/span>\n\t\t\t\t\t
\"\"<\/figure><\/div>\t\t\t\t\t
\n\t\t\t\t\t\t\u8a18\u4e8b\u30b9\u30e9\u30a4\u30c0\u30fc\u306e\u8a2d\u5b9a\u65b9\u6cd5 | WordPress\u30c6\u30fc\u30de SWELL<\/a>\n\t\t\t\t\t\t\u3053\u306e\u30da\u30fc\u30b8\u3067\u306fSWELL\u3067\u7c21\u5358\u306b\u8a2d\u7f6e\u3067\u304d\u308b\u300e\u8a18\u4e8b\u30b9\u30e9\u30a4\u30c0\u30fc\u300f\u306b\u3064\u3044\u3066\u306e\u8a2d\u5b9a\u65b9\u6cd5\u3092\u89e3\u8aac\u3057\u3066\u3044\u304d\u307e\u3059\u3002 \u8a18\u4e8b\u30b9\u30e9\u30a4\u30c0\u30fc\u3068\u306f\u3044\u308f\u3086\u308b\u300e\u30d4\u30c3\u30af\u30a2\u30c3\u30d7\u30b9\u30e9\u30a4\u30c0\u30fc\u300f\u306a\u3069\u3068\u3082\u547c\u3070\u308c…<\/span>\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\n

\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u304b\u3089\u7d30\u304b\u304f\u8a2d\u5b9a\u3082\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

SWELL\u306e\u8a18\u4e8b\u30b9\u30e9\u30a4\u30c0\u30fc\u3092\u8a18\u4e8b\u3067\u8868\u793a\u3059\u308b\u65b9\u6cd5<\/h2>\n\n\n\n

\u3084\u308a\u65b9\u306f\u30b7\u30f3\u30d7\u30eb\u3067SWELL\u3067\u4f7f\u308f\u308c\u3066\u3044\u308b\u30b3\u30fc\u30c9\u3092\u4f7f\u3063\u3066\u3001\u30b7\u30e7\u30fc\u30c8\u30b3\u30fc\u30c9\u3092\u4f7f\u3063\u3066\u8a18\u4e8b\u3067\u8868\u793a\u3059\u308b\u3060\u3051\u3067\u3059\u3002<\/p>\n\n\n\n

\u8a18\u4e8b\u30b9\u30e9\u30a4\u30c0\u30fc\u3092\u8868\u793a\u3059\u308b\u30b3\u30fc\u30c9<\/h3>\n\n\n\n

PHP\u3001CSS\u3001JS\u306e\u30b3\u30fc\u30c9\u3092\u633f\u5165\u3057\u3066\u3044\u304d\u307e\u3059\u3002<\/p>\n\n\n\n

functions.php<\/h4>\n\n\n\n

$SETTING<\/code> \u301c <?php<\/code> \u307e\u3067\u30b3\u30fc\u30c9\u306fSWELL\u306e\u4e0b\u8a18\u306e\u30b3\u30fc\u30c9\u3092\u53c2\u7167\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n

wp-content\/themes\/swell\/parts\/top\/post_slider.php<\/code><\/p>\n\n\n\n

\n
functions.php<\/span><\/i><\/i><\/span><\/summary>
\n

\u7ba1\u7406\u753b\u9762 \uff1e \u5916\u89b3 \uff1e \u30c6\u30fc\u30de\u30a8\u30c7\u30a3\u30bf\u304b\u3089\u4e0b\u8a18\u306e\u30b3\u30fc\u30c9\u3092\u633f\u5165\u3057\u3066\u304f\u3060\u3055\u3044<\/p>\n\n\n\n

\u3061\u306a\u307f\u306b\u30c8\u30c3\u30d7\u30da\u30fc\u30b8\u3067\u65e2\u306b\u4f7f\u3063\u3066\u3044\u308b\u5834\u5408\u306f\u4ee5\u4e0b\u306e\u30b3\u30fc\u30c9\u306f\u524a\u9664\u3057\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n

\/\/ \u30b9\u30e9\u30a4\u30c0\u30fc\u304cON\u306b\u8a2d\u5b9a\u3055\u308c\u3066\u3044\u306a\u3044\u5834\u5408\u306f\u4f55\u3082\u8868\u793a\u3057\u306a\u3044\nif ($SETTING['show_post_slide'] !== 'off') {\n\treturn '';\n}<\/code><\/pre><\/div>\n\n\n\n
\u30c8\u30c3\u30d7\u30da\u30fc\u30b8\u3067\u306f\u8a18\u4e8b\u30b9\u30e9\u30a4\u30c0\u30fc\u3092\u4f7f\u308f\u306a\u3044\u524d\u63d0\u3067\u306e\u30b3\u30fc\u30c9\u3067\u3059\u3002<\/p>\n\n\n\n
wp_enqueue_script('swell_swiper');\nwp_enqueue_style('swell_swiper');\n\nfunction render_post_slider() {\n    ob_start();\n\n$SETTING = SWELL_Theme::get_setting();\n$q_args  = [\n\t'post_type'           => 'post',\n\t'post_status'         => 'publish',\n\t'no_found_rows'       => true,\n\t'posts_per_page'      => 8,\n\t'ignore_sticky_posts' => true,\n];\n\n\/\/ \u30b9\u30e9\u30a4\u30c0\u30fc\u304cON\u306b\u8a2d\u5b9a\u3055\u308c\u3066\u3044\u306a\u3044\u5834\u5408\u306f\u4f55\u3082\u8868\u793a\u3057\u306a\u3044\nif ($SETTING['show_post_slide'] !== 'off') {\n\treturn '';\n}\n\t\n\/\/ \u9664\u5916\u30bf\u30b0\n$exc_tag = explode( ',', $SETTING['exc_tag_id'] );\nif ( ! empty( $exc_tag ) ) {\n\t$q_args['tag__not_in'] = $exc_tag;\n}\n\n\/\/ \u4e26\u3073\u9806\n$the_orderby = $SETTING['ps_orderby'];\nif ( 'meta_value_num' === $the_orderby ) {\n\t$q_args['orderby']  = 'meta_value_num';\n\t$q_args['meta_key'] = SWELL_CT_KEY;\n\t$q_args['order']    = 'DESC';\n} else {\n\t$q_args['orderby'] = $the_orderby;\n}\n\nif ( 'tag' === $SETTING['ps_pickup_type'] ) {\n\t\/\/ \u30bf\u30b0\u3092\u6307\u5b9a\n\t$pickup_tag = $SETTING['pickup_tag'];\n\tif ( ! empty( $pickup_tag ) ) {\n\t\t$q_args['tag'] = $pickup_tag;\n\t}\n} else {\n\t\/\/ \u30ab\u30c6\u30b4\u30ea\u30fc\u3092\u6307\u5b9a\n\t$pickup_cat = $SETTING['pickup_cat'];\n\tif ( ! empty( $pickup_cat ) ) {\n\t\t$q_args['cat'] = (int) $pickup_cat;\n\t}\n}\n\n\/\/ \u30d4\u30c3\u30af\u30a2\u30c3\u30d7\u30bf\u30a4\u30c8\u30eb\n$pickup_title = $SETTING['pickup_title'];\n\n\/\/ \u30b9\u30e9\u30a4\u30c0\u30fc\u30af\u30e9\u30b9\n$slider_class = ( 'normal' === $SETTING['ps_style'] ) ? '-ps-style-normal' : '-ps-style-img';\n\n\/\/ \u8868\u793a\u679a\u6570\n$slide_num_pc = $SETTING['ps_num'];\n$slide_num_sp = $SETTING['ps_num_sp'];\n\n$slider_class .= ' -num-pc-' . str_replace( '.', '_', $slide_num_pc );\n$slider_class .= ' -num-sp-' . str_replace( '.', '_', $slide_num_sp );\n\n\/\/ float\u306b\u3057\u3066\u8a08\u7b97\n$slide_num_pc = (float) $slide_num_pc;\n$slide_num_sp = (float) $slide_num_sp;\n\nif ( $slide_num_pc <= 2 ) {\n\t$slider_class .= ' -fz-pc-l';\n};\nif ( $slide_num_sp >= 2 ) {\n\t$slider_class .= ' -fz-sp-s';\n};\n\n\/\/ \u30b9\u30bf\u30a4\u30c0\u30fc\u30a4\u30f3\u30ca\u30fc\u30af\u30e9\u30b9\n$inner_class = ( 'wide' === $SETTING['pickup_pad_lr'] ) ? ' l-container' : '';\n\n\/\/ \u30b5\u30e0\u30cd\u30a4\u30eb\u30b5\u30a4\u30ba\n$pc_size     = round( 100 \/ $slide_num_pc, 1 ) . 'vw';\n$sp_size     = round( 100 \/ $slide_num_sp, 1 ) . 'vw';\n$thumb_sizes = '(min-width: 960px) ' . $pc_size . ', ' . $sp_size;\n\n\/\/ \u80cc\u666f\u753b\u50cf\n$bgimg     = '';\n$bgimg_url = SWELL_Theme::get_setting( 'bg_pickup' );\n$bgimg_id  = SWELL_Theme::get_setting( 'ps_bgimg_id' );\n$style     = 'opacity: ' . $SETTING['ps_img_opacity'] . ';';\n\nif ( $bgimg_id ) {\n\t$bgimg = SWELL_Theme::get_image( $bgimg_id, [\n\t\t'class'       => 'p-postSlider__imgLayer c-filterLayer__img u-obf-cover',\n\t\t'alt'         => '',\n\t\t'loading'     => apply_filters( 'swell_post_slider_lazy_off', true ) ? 'none' : SWELL_Theme::$lazy_type,\n\t\t'style'       => $style,\n\t\t'decoding'    => 'async',\n\t\t'aria-hidden' => 'true',\n\t]);\n} elseif ( $bgimg_url ) {\n\t$bgimg = '<img src="' . esc_attr( $bgimg_url ) . '" class="p-postSlider__imgLayer c-filterLayer__img u-obf-cover" decoding="async" style="' . esc_attr( $style ) . '">';\n}\n\n?>\n<div id="post_slider" class="p-postSlider c-filterLayer <?=esc_attr( $slider_class )?>">\n\t<?php echo $bgimg; \/\/phpcs:ignore?>\n\t<div class="p-postSlider__inner<?=esc_attr( $inner_class )?>">\n\t\t<?php if ( $pickup_title ) : ?>\n\t\t\t<div class="p-postSlider__title">\n\t\t\t\t<?=wp_kses( $SETTING['pickup_title'], SWELL_Theme::$allowed_text_html )?>\n\t\t\t<\/div>\n\t\t<?php endif; ?>\n\t\t<div class="p-postSlider__swiper swiper">\n\t\t\t<?php\n\t\t\t\tSWELL_Theme::get_parts( 'parts\/post_list\/loop_by_slider', [\n\t\t\t\t\t'query_args'  => $q_args,\n\t\t\t\t\t'thumb_sizes' => $thumb_sizes,\n\t\t\t\t] );\n\t\t\t?>\n\t\t\t<?php if ( $SETTING['ps_on_pagination'] ) : ?>\n\t\t\t\t<div class="swiper-pagination"><\/div>\n\t\t\t<?php endif; ?>\n\t\t\t<?php if ( $SETTING['ps_on_nav'] ) : ?>\n\t\t\t\t<div class="swiper-button-prev" tabindex="0" role="button" aria-label="<?=esc_attr__( '\u524d\u306e\u30b9\u30e9\u30a4\u30c9', 'swell' )?>"><\/div>\n\t\t\t\t<div class="swiper-button-next" tabindex="0" role="button" aria-label="<?=esc_attr__( '\u6b21\u306e\u30b9\u30e9\u30a4\u30c9', 'swell' )?>"><\/div>\n\t\t\t<?php endif; ?>\n\t\t<\/div>\n\t<\/div>\n<\/div>\n<?php \n    return ob_get_clean(); \n}\n\nadd_shortcode('post_slider', 'render_post_slider'); <\/code><\/pre><\/div>\n\n\n\n
\u8a18\u4e8b\u30b9\u30e9\u30a4\u30c0\u30fc\u306eCSS\u3067\u3059<\/p>\n<\/div><\/details>\n<\/div>\n\n\n\n
CSS<\/h4>\n\n\n\n
\u7d9a\u3044\u3066CSS\u3092\u8ffd\u52a0\u3057\u307e\u3059\u3002style.css\u306a\u3069\u597d\u304d\u306a\u5834\u6240\u306b\u5165\u308c\u3066\u304f\u3060\u3055\u3044<\/p>\n\n\n\n
wp-content\/themes\/swell\/build\/css\/modules\/parts\/post-slider.css<\/code><\/p>\n\n\n\n
\n
css<\/span><\/i><\/i><\/span><\/summary>
\n
.p-postSlider {\n    --swiper-nav-size: 32px;\n    overflow: hidden;\n    padding-bottom: var(--swl-post_slide_padY,16px);\n    padding-top: var(--swl-post_slide_padY,16px);\n    position: relative\n}\n\n.p-postSlider .swiper {\n    position: relative;\n    z-index: 1\n}\n\n.p-postSlider .swiper-pagination {\n    bottom: 0;\n    line-height: 1\n}\n\n.p-postSlider .swiper-pagination-bullet {\n    background: currentcolor;\n    color: inherit\n}\n\n.p-postSlider .swiper-button-prev {\n    left: var(--ps_space)\n}\n\n.p-postSlider .swiper-button-next {\n    right: var(--ps_space)\n}\n\n.p-postSlider .swiper-button-next svg,.p-postSlider .swiper-button-prev svg {\n    display: none\n}\n\n.p-postSlider__swiper:not(.swiper-initialized) {\n    visibility: hidden\n}\n\n.p-postSlider__title {\n    font-size: 4.5vw;\n    font-weight: 700;\n    letter-spacing: var(--swl-letter_spacing,1px);\n    margin-bottom: .75em;\n    position: relative;\n    text-align: center;\n    z-index: 1\n}\n\n.postSlider__postList {\n    align-items: stretch;\n    display: flex;\n    flex-wrap: nowrap\n}\n\n.p-postSlider .p-postList__item {\n    height: auto;\n    padding: 0 var(--ps_space);\n    position: static;\n    width: var(--swl-post_slide_width--pc,100%)\n}\n\n.p-postSlider .p-postList__link {\n    color: inherit;\n    height: 100%;\n    position: relative\n}\n\n.p-postSlider .p-postList__body {\n    color: inherit\n}\n\n.p-postSlider .p-postList__title {\n    font-size: 3.6vw;\n    overflow: hidden\n}\n\n.p-postSlider.-ps-style-normal .p-postList__title {\n    line-height: 1.4;\n    max-height: 4.2em\n}\n\n.p-postSlider.-ps-style-normal .p-postList__body {\n    margin-top: .75em\n}\n\n.p-postSlider.-ps-style-img .p-postList__thumb {\n    z-index: 0\n}\n\n.p-postSlider.-ps-style-img .p-postList__body {\n    bottom: 0;\n    color: #fff;\n    left: 0;\n    margin-top: 0;\n    padding: 2em .75em .5em;\n    position: absolute;\n    width: 100%;\n    z-index: 2\n}\n\n.p-postSlider.-ps-style-img .p-postList__body:before {\n    background: linear-gradient(transparent,rgba(0,0,0,.4));\n    bottom: 0;\n    content: "";\n    display: block;\n    height: 100%;\n    left: 0;\n    position: absolute;\n    transition: none;\n    width: 100%;\n    z-index: -1\n}\n\n.p-postSlider.-ps-style-img .p-postList__title {\n    line-height: 1.2;\n    max-height: 3.6em\n}\n\n@media not all and (min-width: 600px) {\n    .p-postSlider {\n        padding-bottom:var(--swl-post_slide_padY--mb,16px);\n        padding-top: var(--swl-post_slide_padY--mb,16px)\n    }\n\n    .p-postSlider .swiper-pagination-bullet {\n        height: 6px;\n        margin: 0 3px;\n        width: 6px\n    }\n\n    .p-postSlider {\n        --swiper-nav-border-width: 1px\n    }\n\n    .p-postSlider.-fz-sp-s .p-postList__title {\n        font-size: 3vw\n    }\n\n    .p-postSlider.-ps-style-img.-fz-sp-s .p-postList__body {\n        padding: 2em .5em .5em\n    }\n}\n\n@media not all and (min-width: 960px) {\n    .p-postSlider__inner {\n        padding-left:0;\n        padding-right: 0\n    }\n\n    .p-postSlider .p-postList__item {\n        width: var(--swl-post_slide_width--sp,100%)\n    }\n\n    .p-postSlider.-num-sp-1.-ps-style-normal .p-postList__body {\n        padding: .25em 1em 0\n    }\n}\n\n@media (min-width: 600px) {\n    .p-postSlider__title {\n        font-size:24px\n    }\n\n    .p-postSlider .p-postList__title {\n        font-size: 15px\n    }\n\n    .p-postSlider.-fz-pc-l .p-postList__title {\n        font-size: 18px\n    }\n}\n\n@media (min-width: 960px) {\n    .p-postSlider.-num-pc-1.-ps-style-normal .p-postList__body {\n        padding:.25em 1em 0\n    }\n}<\/code><\/pre><\/div>\n<\/div><\/details>\n<\/div>\n\n\n\n
Javascript<\/h4>\n\n\n\n
\u6700\u5f8c\u306bJavascript\u3067\u3059\u3002\u3053\u3061\u3089\u3082\u7ba1\u7406\u753b\u9762 \uff1e \u5916\u89b3 \uff1e \u30c6\u30fc\u30de\u30a8\u30c7\u30a3\u30bf\u304b\u3089\u4e0b\u8a18\u306e\u30b3\u30fc\u30c9\u3092\u633f\u5165\u3057\u3066\u304f\u3060\u3055\u3044<\/p>\n\n\n\n
\n
Javascript<\/span><\/i><\/i><\/span><\/summary>
\n
function post_swiper_js() {\n    \/\/ \u73fe\u5728\u306e\u30da\u30fc\u30b8\u304c\u30c8\u30c3\u30d7\u30da\u30fc\u30b8\u3067\u306a\u3044\u5834\u5408\u306b\u306e\u307f\u30b9\u30af\u30ea\u30d7\u30c8\u3092\u51fa\u529b\n    if ( ! is_front_page() ) {\n        echo <<< EOM\n<script>\nvar swiper = new Swiper('.swiper', {\n  loop: true, \/\/\u6700\u5f8c\u306b\u9054\u3057\u305f\u3089\u5148\u982d\u306b\u623b\u308b\u304b\u3069\u3046\u304b\n  slidesPerView: 2, \/\/\u4e00\u753b\u9762\u3067\u306e\u8868\u793a\u30b9\u30e9\u30a4\u30c9\u679a\u6570\uff08\u30b9\u30de\u30db\uff09\n  spaceBetween: 5, \/\/\u5404\u30b9\u30e9\u30a4\u30c9\u9593\u306e\u4f59\u767d\u306e\u9593\u9694\uff08\u30b9\u30da\u30fc\u30b9\uff09\uff08\u30b9\u30de\u30db\uff09\n  centeredSlides: false, \/\/\u5bfe\u8c61\u306e\u30b9\u30e9\u30a4\u30c9\u3092\u4e2d\u592e\u5bc4\u305b\u3059\u308b\u304b\u3069\u3046\u304b\n  speed: 1200, \/\/\u5404\u30b9\u30e9\u30a4\u30c9\u9593\u306e\u79fb\u52d5\u901f\u5ea6\n  breakpoints: {\n    769: {\n      slidesPerView: 5, \/\/\u4e00\u753b\u9762\u3067\u306e\u8868\u793a\u30b9\u30e9\u30a4\u30c9\u679a\u6570\uff08PC\uff09\n      spaceBetween: 5 \/\/\u5404\u30b9\u30e9\u30a4\u30c9\u9593\u306e\u4f59\u767d\u306e\u9593\u9694\uff08\u30b9\u30da\u30fc\u30b9\uff09\uff08PC\uff09\n    }\n  },\n  autoplay: {\n    delay: 2000, \/\/\u81ea\u52d5\u518d\u751f\u306e1\u679a\u306e\u30b9\u30e9\u30a4\u30c9\u3092\u5f85\u6a5f\u3059\u308b\u901f\u5ea6\n    disableOnInteraction: false, \/\/Swiper\u306eautoplay\u304c\u30af\u30ea\u30c3\u30af\u30fb\u30d5\u30ea\u30c3\u30af\u5f8c\u3082\u6b62\u307e\u3089\u306a\u3044\u3088\u3046\u306b\u3059\u308b\n  },\n  pagination: {\n    el: '.swiper-pagination', \/\/\u30da\u30fc\u30b8\u30cd\u30fc\u30b7\u30e7\u30f3\u306e\u8981\u7d20\n    type: 'bullets', \/\/\u30da\u30fc\u30b8\u30cd\u30fc\u30b7\u30e7\u30f3\u306e\u7a2e\u985e\n    clickable: true, \/\/\u30af\u30ea\u30c3\u30af\u306b\u53cd\u5fdc\u3055\u305b\u308b\n  },\n  \/\/\u30ca\u30d3\u30b2\u30fc\u30b7\u30e7\u30f3\u30dc\u30bf\u30f3\uff08\u77e2\u5370\uff09\u8868\u793a\u306e\u8a2d\u5b9a\n  navigation: {\n    nextEl: '.swiper-button-next', \/\/\u300c\u6b21\u3078\u30dc\u30bf\u30f3\u300d\u8981\u7d20\u306e\u6307\u5b9a\n    prevEl: '.swiper-button-prev', \/\/\u300c\u524d\u3078\u30dc\u30bf\u30f3\u300d\u8981\u7d20\u306e\u6307\u5b9a\n  },\n});\n<\/script>\nEOM;\n    }\n}\nadd_action('wp_print_footer_scripts', 'post_swiper_js');\n\n<\/code><\/pre><\/div>\n<\/div><\/details>\n<\/div>\n\n\n\n
\u8a18\u4e8b\u30b9\u30e9\u30a4\u30c0\u30fc\u306e\u8868\u793a<\/h3>\n\n\n\n
\u3042\u3068\u306f\u8a18\u4e8b\u306b\u4e0b\u8a18\u306e\u30b7\u30e7\u30fc\u30c8\u30b3\u30fc\u30c9\u3092\u633f\u5165\u3059\u308c\u3070\u8868\u793a\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n
[post_slider]<\/code><\/pre><\/div>\n\n\n\n
\u30b5\u30f3\u30d7\u30eb<\/p>\n\n\n\n
\u30c7\u30b6\u30a4\u30f3\u306f\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u306e\u8a2d\u5b9a\u304b\u3089\u5909\u66f4\u3067\u304d\u307e\u3059\u304c\u3001\u30b9\u30e9\u30a4\u30c9\u306e\u8a2d\u5b9a\u306fJavaScript\u306e\u30b3\u30fc\u30c9\u3092\u5909\u66f4\u3059\u308b\u5fc5\u8981\u304c\u3042\u308a\u307e\u3059\u3002<\/p>\n\n\n
\n\t\t
\n\t\t\t\t
\n\t\t\t