We’ve added standardized CSS classes to different elements in the Media Slider widget, to give you virtually infinite ways to customize this widget’s design and every element it includes. If your agency likes to apply custom CSS code to widgets, this one’s for you.
These additional classes (see below) don’t just give your agency more super-granular design freedom than before, but will also ensure any CSS customizations you make to Media Sliders in your sites will be maintained as we update this widget in the future—so you can customize away with confidence.
The CSS classes we added
The list of classes below follows the popular Block Element Modifier (BEM) front-end methodology:
- d-ext-mediaSlider-slidesContainer
- d-ext-mediaSlider-slide__contentContainer
- d-ext-mediaSlider-contentContainer__title
- d-ext-mediaSlider-contentContainer__description
- d-ext-mediaSlider-contentContainer__button
- d-ext-mediaSlider-slidesContainer__slide
- d-ext-mediaSlider-slidesContainer__slide--active
See this quick demo as an example:
How to get started?
When editing a Media Slider on a site, open Dev Mode and enter the CSS classes you want to apply and customize. And remember you can always preview your changes before making them live.
Was this article helpful?
That’s Great!
Thank you for your feedback
Sorry! We couldn't be helpful
Thank you for your feedback
Feedback sent
We appreciate your effort and will try to fix the article