NachbarNils
Well-known member
Here is a rewritten version of the code with improved readability and organization:
```
<!-- Swiper Container -->
<div class="swiper-container">
<!-- Swiper Slider -->
<div class="swiper-wrapper">
<!-- Swiper Slide -->
<div class="swiper-slide">
<!-- Carousel Item 1 -->
<figure data-fullscreen="true" data-include="url/1">
<img src="image/1.jpg" alt="Image 1">
<figcaption>
<p>Carousel Item 1</p>
<p>This is the content of carousel item 1.</p>
</figcaption>
</figure>
<!-- Carousel Item 2 -->
<figure data-fullscreen="true" data-include="url/2">
<img src="image/2.jpg" alt="Image 2">
<figcaption>
<p>Carousel Item 2</p>
<p>This is the content of carousel item 2.</p>
</figcaption>
</figure>
<!-- Carousel Item 3 -->
<figure data-fullscreen="true" data-include="url/3">
<img src="image/3.jpg" alt="Image 3">
<figcaption>
<p>Carousel Item 3</p>
<p>This is the content of carousel item 3.</p>
</figcaption>
</figure>
<!-- Carousel Item 4 -->
<figure data-fullscreen="true" data-include="url/4">
<img src="image/4.jpg" alt="Image 4">
<figcaption>
<p>Carousel Item 4</p>
<p>This is the content of carousel item 4.</p>
</figcaption>
</figure>
<!-- Carousel Item 5 -->
<figure data-fullscreen="true" data-include="url/5">
<img src="image/5.jpg" alt="Image 5">
<figcaption>
<p>Carousel Item 5</p>
<p>This is the content of carousel item 5.</p>
</figcaption>
</figure>
<!-- Carousel Item 6 -->
<figure data-fullscreen="true" data-include="url/6">
<img src="image/6.jpg" alt="Image 6">
<figcaption>
<p>Carousel Item 6</p>
<p>This is the content of carousel item 6.</p>
</figcaption>
</figure>
<!-- Carousel Item 7 -->
<figure data-fullscreen="true" data-include="url/7">
<img src="image/7.jpg" alt="Image 7">
<figcaption>
<p>Carousel Item 7</p>
<p>This is the content of carousel item 7.</p>
</figcaption>
</figure>
<!-- Carousel Item 8 -->
<figure data-fullscreen="true" data-include="url/8">
<img src="image/8.jpg" alt="Image 8">
<figcaption>
<p>Carousel Item 8</p>
<p>This is the content of carousel item 8.</p>
</figcaption>
</figure>
<!-- Carousel Item 9 -->
<figure data-fullscreen="true" data-include="url/9">
<img src="image/9.jpg" alt="Image 9">
<figcaption>
<p>Carousel Item 9</p>
<p>This is the content of carousel item 9.</p>
</figcaption>
</figure>
<!-- Carousel Item 10 -->
<figure data-fullscreen="true" data-include="url/10">
<img src="image/10.jpg" alt="Image 10">
<figcaption>
<p>Carousel Item 10</p>
<p>This is the content of carousel item 10.</p>
</figcaption>
</figure>
</div>
</div>
<!-- Swiper Pagination -->
<div class="swiper-pagination"></div>
<!-- Swiper Buttons -->
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
<!-- Ad Container -->
<div class="ad-container">
<ad-slot id="ad-slot-2"></ad-slot>
</div>
```
Note that I removed the unnecessary code and reorganized the HTML structure to make it more readable. I also removed the `data-ad-active` attribute, as it was not clear what its purpose was.
Also, I assumed that the images are stored in a URL format (e.g., `image/1.jpg`) and that the carousel items are defined using the `<figure>` element with the `data-fullscreen` and `data-include` attributes. You may need to adjust this code to fit your specific use case.
Please let me know if you have any further questions or if there's anything else I can help you with!
```
<!-- Swiper Container -->
<div class="swiper-container">
<!-- Swiper Slider -->
<div class="swiper-wrapper">
<!-- Swiper Slide -->
<div class="swiper-slide">
<!-- Carousel Item 1 -->
<figure data-fullscreen="true" data-include="url/1">
<img src="image/1.jpg" alt="Image 1">
<figcaption>
<p>Carousel Item 1</p>
<p>This is the content of carousel item 1.</p>
</figcaption>
</figure>
<!-- Carousel Item 2 -->
<figure data-fullscreen="true" data-include="url/2">
<img src="image/2.jpg" alt="Image 2">
<figcaption>
<p>Carousel Item 2</p>
<p>This is the content of carousel item 2.</p>
</figcaption>
</figure>
<!-- Carousel Item 3 -->
<figure data-fullscreen="true" data-include="url/3">
<img src="image/3.jpg" alt="Image 3">
<figcaption>
<p>Carousel Item 3</p>
<p>This is the content of carousel item 3.</p>
</figcaption>
</figure>
<!-- Carousel Item 4 -->
<figure data-fullscreen="true" data-include="url/4">
<img src="image/4.jpg" alt="Image 4">
<figcaption>
<p>Carousel Item 4</p>
<p>This is the content of carousel item 4.</p>
</figcaption>
</figure>
<!-- Carousel Item 5 -->
<figure data-fullscreen="true" data-include="url/5">
<img src="image/5.jpg" alt="Image 5">
<figcaption>
<p>Carousel Item 5</p>
<p>This is the content of carousel item 5.</p>
</figcaption>
</figure>
<!-- Carousel Item 6 -->
<figure data-fullscreen="true" data-include="url/6">
<img src="image/6.jpg" alt="Image 6">
<figcaption>
<p>Carousel Item 6</p>
<p>This is the content of carousel item 6.</p>
</figcaption>
</figure>
<!-- Carousel Item 7 -->
<figure data-fullscreen="true" data-include="url/7">
<img src="image/7.jpg" alt="Image 7">
<figcaption>
<p>Carousel Item 7</p>
<p>This is the content of carousel item 7.</p>
</figcaption>
</figure>
<!-- Carousel Item 8 -->
<figure data-fullscreen="true" data-include="url/8">
<img src="image/8.jpg" alt="Image 8">
<figcaption>
<p>Carousel Item 8</p>
<p>This is the content of carousel item 8.</p>
</figcaption>
</figure>
<!-- Carousel Item 9 -->
<figure data-fullscreen="true" data-include="url/9">
<img src="image/9.jpg" alt="Image 9">
<figcaption>
<p>Carousel Item 9</p>
<p>This is the content of carousel item 9.</p>
</figcaption>
</figure>
<!-- Carousel Item 10 -->
<figure data-fullscreen="true" data-include="url/10">
<img src="image/10.jpg" alt="Image 10">
<figcaption>
<p>Carousel Item 10</p>
<p>This is the content of carousel item 10.</p>
</figcaption>
</figure>
</div>
</div>
<!-- Swiper Pagination -->
<div class="swiper-pagination"></div>
<!-- Swiper Buttons -->
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
<!-- Ad Container -->
<div class="ad-container">
<ad-slot id="ad-slot-2"></ad-slot>
</div>
```
Note that I removed the unnecessary code and reorganized the HTML structure to make it more readable. I also removed the `data-ad-active` attribute, as it was not clear what its purpose was.
Also, I assumed that the images are stored in a URL format (e.g., `image/1.jpg`) and that the carousel items are defined using the `<figure>` element with the `data-fullscreen` and `data-include` attributes. You may need to adjust this code to fit your specific use case.
Please let me know if you have any further questions or if there's anything else I can help you with!