GLOBIT ProPackage Whitelabel
Client Slider

Kongress 2019

Das sagen unsere Besucher

1. Adding Slider and Slides

Sort of short intro :)

- Add ClientSlider to a page. (only one ClientSlider can exist on one page for now)
- Click on Content Collection (cslider) in the Content Tree of page or directly on the page and add as many Client Slide elements as you need.
- Once finished with adding desired amount of Slides, full page reload in browser is needed for slides to show up and navigation Dots appear at the bottom of Slider.

2. Client Slider

Slider component has two Tabs of options in the Inspector: General and Slider Configuration.
Slider HEADLINE and SUBHEADLINE are inline editable.

a) General tab has three options:
    - Slider Name - name that is shown in the Content Tree
    - Global Image Size - size of 'Author' picture used for every slide by default. If it is set to 0 (zero), the user can alter 'Author' image size for each slide individually.
    - Background Image - slider background image
b) Slider Configuration tab has options, which affect the behavior of Owl Carousel. By default, animation of slides is turned off. Other options that can change the look and feel of slider can be added if needed.

3. Individual Slide

Individual Slide has 4 options in the Inspector.
Rest of fields (Text, Author name and Author position) are inline editable.

- Slide Name - name that is shown in the Content Tree
- Image Size - has effect only if Global Image Size option of Client Slider is set to 0 (zero).
- Author Image - name says it all.
- Background Image - background image of individual slide.

4. Important Notes

4.1. After Client Slider is added, we should normally see and be able to select 'Content Collection (cslider)' element (should appear right below 'Default Headline' text), but in some unpredictable situations - it is not there for some unknown reason. If full page reload is done on this stage, our Content Collection will show up and user is able to select it and add individual Slides. But.... Slides are not be styled (no CSS) and stack below each other until another full page reload is done.

4.2. If Client Slider is added, no full page reload is done and we don't see 'Content Collection (cslider)' on page and then we select 'Content Collection (cslider)' from Content Tree and add individual Slides - there are chances that we might not see those slides until full page reload.

4.3. Clicking on individual slide in the page Content Tree (bottom left of Neos) can (in some situations) do strange things visually - like slide the whole page to the left or right.

4.4. Selecting (clicking on it) individual Slide in Content Tree does not make this slide visible on page. So if user wants to see particular slide or change its inline editable fields, switching slides with Dots (shown under slides) is the only option.

4.5. As of now, only ONE Client Slider element can exist on ONE page.

4.6. If you clear (make empty) Author Name and/or Author Position fields on one slide and for some reason fill them on the other slide then these slides will have different height.

5. Side notes

Currently our Client Slider uses Owl Carousel like the slider sample on relaunch.globit.com.

Client Slider may fail to work due to conflicting calls in main.min.js file or wrong Owl Carousel distribution used. Some site prototypes use Owl 1.2.4 but Client Slider requires Owl v2.3.4.

Working with it at the start is not really user-friendly as it requires full page reload for some changes to take effect. Neos developers say it will require very much effort to make sliders behave nicely in backend.

Potentially, if we try another JavaScript slider (like Flex Slider, which is already used on many of our sites) it might work better from the end-user point of view.

So...