Skip to content
Grav 2.0 is officially stable. Read the announcement →

Community guidelines

Please keep discussions civil and on-topic. Repeated violations may lead to a temporary ban.

General

Shortcode Owl Carousel integration in Editorial and Future2021 themes

Started by Pedro M 3 years ago · 0 replies · 880 views
3 years ago

Hello.

Recently, I've been researching why the owl carousel shortcode plugin doesn't integrate well with themes like Editorial or Future2021. Both themes have a sidebar and the mentioned plugin does not integrate well, causing the sidebar to shrink and not display correctly.

This is the result of inserting the shortcode owl carousel plugin into Future2021:

owlcarousel1|690x322

I have made a copy of the owl-carousel.html.twig file in the templates\partials folder and included the following modification:

TWIG
{% block stylesheets %}
     <style>
         .wrapper-carousel-{{ owl_id }} {
             display: flex;
             width: 100%;
             }
         .carousel-{{ owl_id }} {
             width: 0;
             margin-bottom: 2rem;
             flex-basis: 100%;
                     }
     </style>

{% endblock %}

<div class="wrapper-carousel-{{ owl_id }}">
     <div class="carousel-{{ owl_id }}">
         <div class="owl-carousel owl-theme" id="{{ owl_id }}">
             {{ owl_items|regex_replace('(^\n?<p>|<\/p>$)','')|raw }}
         </div>
     </div>
</div>

Adding this small modification, the shortcode owl carousel plugin is inside a flex container, which means that it doesn't push the sidebar outside of the main template container (Future2021 in this case).

This is what the plugin looks like with this modification:

owlcarousel2|690x329

I hope this modification can help those people who are currently using the Editorial and Future2021 themes, and others experiencing the same problem.
Also, I will try to create a Pull Request to the development branch of the plugin on GitHub, so that the developers of the plugin can integrate these modifications and this make the plugin more versatile.

last edited 03/13/23 by Pedro M

Suggested topics

Topic Participants Replies Views Activity
General · by Jerry Hunt, 4 days ago
2 76 8 hours ago
General · by pamtbaau, 13 hours ago
1 47 13 hours ago
General · by Andy Miller, 1 day ago
0 44 1 day ago
General · by Marcel, 12 months ago
6 346 5 days ago
General · by Duc , 5 days ago
3 40 5 days ago