Wikia Developers Wiki


847pages on
this wiki
Add New Page
Talk0 Share

ResponsiveSlider is a slider that automatically adapts itself to the size of any wiki. There is no need of jQuery for this script to run.



Add this line to your wiki's MediaWiki:ImportJS page.


Style (CSS3)

Add this CSS import to the top of your wiki's MediaWiki:Common.css page.

  1. @import url('//');


  1. <div class="jcarousel-wrapper">
  2.     <div class="jcarousel">
  3.         <div class="jcarousel-list">
  5.             <!-- Content Item -->
  6.             <div class="jcarousel-item">
  7.                 <div class="banner-image nomobile">
  8.                     <!-- banner-box-left / banner-box-right -->
  9.                     <div class="banner-box banner-box-left" {{#if:{{{width|}}}|style="width:{{{width}}}"}}>
  10.                         <!-- Banner Title -->
  11.                         <div class="name">[[{{{title}}}|{{{alt-title|{{{title}}}}}}]]</div>
  12.                         <!-- Banner Subtitle -->
  13.                         <div class="type Foleo">[[{{{section-link}}}|{{{section}}}]]</div>
  14.                         <!-- Banner Description -->
  15.                         <div class="quote">[[{{{title}}}|{{{cite}}}]]</div>
  16.                     </div>
  17.                     <!-- Image Slider -->
  18.                     [[File:{{{image-file}}}|frameless|1700px|link={{{title}}}|{{{title}}}]]
  19.                 </div>
  20.             </div>
  21.             <!-- /Content Item -->
  23.         </div>
  24.     </div>
  25.     <span class="jcarousel-control-prev">[[#|<span style="color:#888;text-decoration:none">&lsaquo;</span>]]</span>
  26.     <span class="jcarousel-control-next">[[#|<span style="color:#888;text-decoration:none">&rsaquo;</span>]]</span>
  27.     <p class="jcarousel-pagination"></p>
  28. </div>

Start a Discussion Discussions about ResponsiveSlider

  • Carousel.

    23 messages
    • Yes! I am on Discord! I have tried working with the coding of the slider, but nothing has happened. It would be best to contact someone m...
    • Okey, I'll do that. Thank you very much! :) Tobias Alcaraz ...

Ad blocker interference detected!

Wikia is a free-to-use site that makes money from advertising. We have a modified experience for viewers using ad blockers

Wikia is not accessible if you’ve made further modifications. Remove the custom ad blocker rule(s) and the page will load as expected.