Logo scroller: how to use
Each section is a full-bleed Row with one variant class in Advanced › CSS Classes: logo-scroller-white, logo-scroller-light-slate or logo-scroller-light-blue. The Row holds a subtitle Text, the Heading, an intro Text, then a Container with one Image per logo, then a Buttons element. Copy the whole row onto your page, then change the text, links and logos.
Logos
- Add or remove Image elements inside the Container; there is no limit. Six fit across on desktop, so the arrows only appear when there are more than six (the samples below repeat the six logos twice to show this). The site turns the Container into a sliding strip with previous/next arrows and faded edges, and it can also be dragged or swiped.
- Each logo shows in a 175 × 110 px box, so logos of very different shapes still line up.
What to ask your designer for
- Logo file: PNG with a transparent background, exactly 350 × 220 px, the logo centred with a little breathing room, full colour as the brand supplies it. Name it
logo-<company>-350x220.png. On the blue background use a white or light version of the logo. - Reference files in
media/wysiwyg/components/logoscroller/:logo-ryanair-350x220.png,logo-msd-350x220.png,logo-meta-350x220.png,logo-lilly-350x220.png,logo-google-350x220.png,logo-microsoft-350x220.png.
