画像掲載(その4:Word Pressのスライドショー)

WordPressのスライドショーを挿入する。

  • うろこ雲(駿河台大学第二講義棟とともに)

編集画面ではマークアップを変更できません。つぎが、ページに書き出されるマークアップです。

<div class=”wp-container-3 wp-block-group”> <div class=”wp-container-2 wp-block-columns”> <div class=”wp-container-1 wp-block-column” style=”flex-basis:100%”> <div class=”wp-block-jetpack-slideshow aligncenter” data-effect=”slide” data-jetpack-block-initialized=”true”> <div class=”wp-block-jetpack-slideshow_container swiper-container swiper-container-initialized swiper-container-horizontal swiper-container-pointer-events wp-swiper-initialized” style=”cursor: grab;”> <ul class=”wp-block-jetpack-slideshow_swiper-wrapper swiper-wrapper” style=”width: 6896px; transition-duration: 0ms; transform: translate3d(-862px, 0px, 0px); height: 636px;” id=”swiper-wrapper-b49cf2a6d7a8ca90″ aria-live=”polite”> <li class=”wp-block-jetpack-slideshow_slide swiper-slide swiper-slide-duplicate swiper-slide-prev” data-swiper-slide-index=”5″ style=”width: 862px;” aria-hidden=”true” role=”group” aria-label=”1 / 8″><figure><img loading=”lazy” width=”1200″ height=”800″ alt=”うろこ雲(駿河台大学第二講義棟とともに)” class=”wp-block-jetpack-slideshow_image wp-image-73″ data-id=”73″ src=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv151121a.jpg” srcset=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv151121a.jpg 1200w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv151121a-300×200.jpg 300w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv151121a-1024×683.jpg 1024w” sizes=”(max-width: 1200px) 100vw, 1200px”></figure></li> <li class=”wp-block-jetpack-slideshow_slide swiper-slide swiper-slide-active” data-swiper-slide-index=”0″ style=”width: 862px;” aria-hidden=”false” tabindex=”-1″ role=”group” aria-label=”2 / 8″><figure><img loading=”lazy” width=”800″ height=”1200″ alt=”” class=”wp-block-jetpack-slideshow_image wp-image-139″ data-id=”139″ src=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620b.jpg” srcset=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620b.jpg 800w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620b-200×300.jpg 200w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620b-683×1024.jpg 683w” sizes=”(max-width: 800px) 100vw, 800px”></figure></li> <li class=”wp-block-jetpack-slideshow_slide swiper-slide swiper-slide-next” data-swiper-slide-index=”1″ style=”width: 862px;” aria-hidden=”true” role=”group” aria-label=”3 / 8″><figure><img loading=”lazy” width=”1200″ height=”800″ alt=”” class=”wp-block-jetpack-slideshow_image wp-image-138″ data-id=”138″ src=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620c.jpg” srcset=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620c.jpg 1200w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620c-300×200.jpg 300w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620c-1024×683.jpg 1024w” sizes=”(max-width: 1200px) 100vw, 1200px”></figure></li> <li class=”wp-block-jetpack-slideshow_slide swiper-slide” data-swiper-slide-index=”2″ style=”width: 862px;” aria-hidden=”true” role=”group” aria-label=”4 / 8″><figure><img loading=”lazy” width=”1200″ height=”800″ alt=”” class=”wp-block-jetpack-slideshow_image wp-image-137″ data-id=”137″ src=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620a.jpg” srcset=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620a.jpg 1200w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620a-300×200.jpg 300w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620a-1024×683.jpg 1024w” sizes=”(max-width: 1200px) 100vw, 1200px”></figure></li> <li class=”wp-block-jetpack-slideshow_slide swiper-slide” data-swiper-slide-index=”3″ style=”width: 862px;” aria-hidden=”true” role=”group” aria-label=”5 / 8″><figure><img loading=”lazy” width=”800″ height=”1200″ alt=”” class=”wp-block-jetpack-slideshow_image wp-image-123″ data-id=”123″ src=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620e.jpg” srcset=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620e.jpg 800w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620e-200×300.jpg 200w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620e-768×1152.jpg 768w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620e-683×1024.jpg 683w” sizes=”(max-width: 800px) 100vw, 800px”></figure></li> <li class=”wp-block-jetpack-slideshow_slide swiper-slide” data-swiper-slide-index=”4″ style=”width: 862px;” aria-hidden=”true” role=”group” aria-label=”6 / 8″><figure><img loading=”lazy” width=”1200″ height=”800″ alt=”” class=”wp-block-jetpack-slideshow_image wp-image-114″ data-id=”114″ src=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620d.jpg” srcset=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620d.jpg 1200w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620d-300×200.jpg 300w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620d-768×512.jpg 768w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620d-1024×683.jpg 1024w” sizes=”(max-width: 1200px) 100vw, 1200px”></figure></li> <li class=”wp-block-jetpack-slideshow_slide swiper-slide swiper-slide-duplicate-prev” data-swiper-slide-index=”5″ style=”width: 862px;” aria-hidden=”true” role=”group” aria-label=”7 / 8″><figure><img loading=”lazy” width=”1200″ height=”800″ alt=”うろこ雲(駿河台大学第二講義棟とともに)” class=”wp-block-jetpack-slideshow_image wp-image-73″ data-id=”73″ src=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv151121a.jpg” srcset=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv151121a.jpg 1200w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv151121a-300×200.jpg 300w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv151121a-1024×683.jpg 1024w” sizes=”(max-width: 1200px) 100vw, 1200px”></figure></li> <li class=”wp-block-jetpack-slideshow_slide swiper-slide swiper-slide-duplicate swiper-slide-duplicate-active” data-swiper-slide-index=”0″ style=”width: 862px;” aria-hidden=”true” role=”group” aria-label=”8 / 8″><figure><img loading=”lazy” width=”800″ height=”1200″ alt=”” class=”wp-block-jetpack-slideshow_image wp-image-139″ data-id=”139″ src=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620b.jpg” srcset=”https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620b.jpg 800w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620b-200×300.jpg 200w, https://hustlemouse.com/wp160211/wp-content/uploads/2016/02/unv150620b-683×1024.jpg 683w” sizes=”(max-width: 800px) 100vw, 800px”></figure></li> </ul> <a class=”wp-block-jetpack-slideshow_button-prev swiper-button-prev swiper-button-white” role=”button” style=”top: 318px;” tabindex=”0″ aria-label=”Previous slide” aria-controls=”swiper-wrapper-b49cf2a6d7a8ca90″></a> <a class=”wp-block-jetpack-slideshow_button-next swiper-button-next swiper-button-white” role=”button” style=”top: 318px;” tabindex=”0″ aria-label=”Next slide” aria-controls=”swiper-wrapper-b49cf2a6d7a8ca90″></a> <a aria-label=”Pause Slideshow” class=”wp-block-jetpack-slideshow_button-pause” role=”button”></a> <div class=”wp-block-jetpack-slideshow_pagination swiper-pagination swiper-pagination-white swiper-pagination-clickable swiper-pagination-bullets”> <button class=”swiper-pagination-bullet swiper-pagination-bullet-active” tabindex=”0″ role=”button” aria-label=”Go to slide 1″></button> <button class=”swiper-pagination-bullet” tabindex=”0″ role=”button” aria-label=”Go to slide 2″></button> <button class=”swiper-pagination-bullet” tabindex=”0″ role=”button” aria-label=”Go to slide 3″></button> <button class=”swiper-pagination-bullet” tabindex=”0″ role=”button” aria-label=”Go to slide 4″></button> <button class=”swiper-pagination-bullet” tabindex=”0″ role=”button” aria-label=”Go to slide 5″></button> <button class=”swiper-pagination-bullet” tabindex=”0″ role=”button” aria-label=”Go to slide 6″></button> </div> <span class=”swiper-notification” aria-live=”assertive” aria-atomic=”true”></span> </div></div></div></div></div>