Navigation
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • #1214805
    sonofzell
    Participant

    I love the addition of the Superfly plugin to the X theme, however I’ve noticed that it doesn’t really play nice with ThemePunch shortcodes. I’ve had little success getting Rev Sliders or Essential Grids to display properly (if at all) within Superfly sub-panels.

    Specifically, rev sliders don’t seem to recognize the container dimensions of the sub-panel, and thus do not render properly and are not responsive. I’ve been able to work around this by dropping the z-index of the slider, essentially making it a background element, using the following css:

    .rev_slider_wrapper {
     
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        z-index: 0 !important;
        width: 100% !important;
        height: 100% !important;
        
    }

    While this allows the slider to display properly, it obviously affects ALL elements with the “.rev_slider_wrapper” class, which wreaks havoc on any other sliders on the page(s).

    My strategy now is to create a custom wrapper class that I could assign to specific sliders (the ones that will live within the Superfly panels), and apply the z-index code to it. Unfortunately, I haven’t found any way to assign a custom wrapper class to a slider using the Slider Revolution GUI, and I’m hesitant to edit the ThemePunch css directly, as it’s a bit beyond my comfort level and experience.

    An example of the layout can be seen at http://69.195.124.101/~kirkkwil/ksl/scoreboard/65lb/, although the slider shortcodes are not currently active (Superfly menu is called from the “clubs” link on main nav). It’s not a live site, so I’ll gladly throw the slider shortcodes back in if it will help with troubleshooting!

    I’d appreciate any suggestions you have to allow sliders to display within SF panels without breaking sliders on pages, using custom wrapper classes or any other method. As always, thanks for your time!!

    Best,

    Kirk

    #1215240
    Jade
    Moderator

    Hi Kirk,

    You can add an ID to the slider which you can do in the slider settings. Please refer to the screenshot. Then you can reference the slider through the ID you added.

    Hope this helps.

  • <script> jQuery(function($){ $("#no-reply-1214805 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>