Skip to content

Conversation

@CySSoO
Copy link
Contributor

@CySSoO CySSoO commented Jan 22, 2026

Motivation

  • The existing Prettyblocks "Simple Image" template rendered a Bootstrap grid inside slider mode so the existing everblock-slider.js never initialized the slider.
  • The goal is to align the TPL strictly with the slider DOM expected by the vanilla JS and disable the slider when the configured visible items are greater or equal to the number of visible states.

Description

  • Replaced the slider markup in views/templates/hook/prettyblocks/prettyblock_img.tpl to render the exact structure expected by the JS: a wrapper .ever-slider with data-* attributes, a .ever-slider-track.d-flex and child .ever-slider-item.flex-shrink-0 elements, navigation buttons .ever-slider-prev / .ever-slider-next and .ever-slider-dots.
  • Removed Bootstrap grid classes from slider rendering and removed extra wrapper classes so the JS can initialize the slider; preserved the existing item inner HTML (<a>, <picture>, <img>, lazyload, texts and inline spacing styles) unchanged.
  • Added server-side logic to compute the maximum configured items per view across desktop/tablet/mobile and only render the slider when visibleStatesCount is strictly greater than that maximum, effectively disabling the slider when all items already fit in view.
  • Kept non-slider modes (grid / columns) unchanged and did not modify any JavaScript or configuration files.

Testing

  • No automated tests were executed for this change.

Codex Task

@CySSoO CySSoO merged commit 8c49828 into master Jan 22, 2026
2 of 6 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants