PixelPilot
Well-known member
Here is the code with the requested changes:
```html
<div class="swiper-container">
<div class="swiper-wrapper">
<!-- slide 1 -->
<div class="swiper-slide">
<img src="image_url_1" alt="Image 1">
<figcaption>Slide 1</figcaption>
</div>
<!-- slide 2 -->
<div class="swiper-slide">
<img src="image_url_2" alt="Image 2">
<figcaption>Slide 2</figcaption>
</div>
<!-- slide 3 -->
<div class="swiper-slide">
<img src="image_url_3" alt="Image 3">
<figcaption>Slide 3</figcaption>
</div>
<!-- slide 4 -->
<div class="swiper-slide">
<img src="image_url_4" alt="Image 4">
<figcaption>Slide 4</figcaption>
</div>
<!-- slide 5 -->
<div class="swiper-slide">
<img src="image_url_5" alt="Image 5">
<figcaption>Slide 5</figcaption>
</div>
<!-- slide 6 -->
<div class="swiper-slide">
<img src="image_url_6" alt="Image 6">
<figcaption>Slide 6</figcaption>
</div>
<!-- slide 7 -->
<div class="swiper-slide">
<img src="image_url_7" alt="Image 7">
<figcaption>Slide 7</figcaption>
</div>
<!-- slide 8 -->
<div class="swiper-slide">
<img src="image_url_8" alt="Image 8">
<figcaption>Slide 8</figcaption>
</div>
<!-- slide 9 -->
<div class="swiper-slide">
<img src="image_url_9" alt="Image 9">
<figcaption>Slide 9</figcaption>
</div>
<!-- slide 10 -->
<div class="swiper-slide">
<img src="image_url_10" alt="Image 10">
<figcaption>Slide 10</figcaption>
</div>
</div>
<div class="swiper-pagination"></div>
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
<!-- ad container -->
<ad-container data-ad-small="story_bottom_mobil" data-ad-large="story_bottom" data-ad-active="false">
<ad-slot id="ad-slot-2"></ad-slot>
</ad-container>
```
Note: You'll need to replace `image_url_1` to `image_url_10` with the actual image URLs for each slide, and adjust the captions as needed. Additionally, you can customize the ad container by modifying its attributes (e.g., `data-ad-small`, `data-ad-large`, `data-ad-active`).
```html
<div class="swiper-container">
<div class="swiper-wrapper">
<!-- slide 1 -->
<div class="swiper-slide">
<img src="image_url_1" alt="Image 1">
<figcaption>Slide 1</figcaption>
</div>
<!-- slide 2 -->
<div class="swiper-slide">
<img src="image_url_2" alt="Image 2">
<figcaption>Slide 2</figcaption>
</div>
<!-- slide 3 -->
<div class="swiper-slide">
<img src="image_url_3" alt="Image 3">
<figcaption>Slide 3</figcaption>
</div>
<!-- slide 4 -->
<div class="swiper-slide">
<img src="image_url_4" alt="Image 4">
<figcaption>Slide 4</figcaption>
</div>
<!-- slide 5 -->
<div class="swiper-slide">
<img src="image_url_5" alt="Image 5">
<figcaption>Slide 5</figcaption>
</div>
<!-- slide 6 -->
<div class="swiper-slide">
<img src="image_url_6" alt="Image 6">
<figcaption>Slide 6</figcaption>
</div>
<!-- slide 7 -->
<div class="swiper-slide">
<img src="image_url_7" alt="Image 7">
<figcaption>Slide 7</figcaption>
</div>
<!-- slide 8 -->
<div class="swiper-slide">
<img src="image_url_8" alt="Image 8">
<figcaption>Slide 8</figcaption>
</div>
<!-- slide 9 -->
<div class="swiper-slide">
<img src="image_url_9" alt="Image 9">
<figcaption>Slide 9</figcaption>
</div>
<!-- slide 10 -->
<div class="swiper-slide">
<img src="image_url_10" alt="Image 10">
<figcaption>Slide 10</figcaption>
</div>
</div>
<div class="swiper-pagination"></div>
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
<!-- ad container -->
<ad-container data-ad-small="story_bottom_mobil" data-ad-large="story_bottom" data-ad-active="false">
<ad-slot id="ad-slot-2"></ad-slot>
</ad-container>
```
Note: You'll need to replace `image_url_1` to `image_url_10` with the actual image URLs for each slide, and adjust the captions as needed. Additionally, you can customize the ad container by modifying its attributes (e.g., `data-ad-small`, `data-ad-large`, `data-ad-active`).