Support » Plugin: Smart Slider 3 » Gap between Smart Slider 3 and Main menu

  • Resolved fh4545

    (@fh4545)


    Hello,

    we have installed the Smart Slider 3 at a new website and via the Widget have it now set up in the header. It is working fine, but there is an issue in the Firefox browser and the Microsoft Edge browser; between the slider and the main menu, there is a white gap. At Google Chrome it is OK.

    We have tried with some different code in our additional CSS file, it has made the gap smaller but there is still a gap.

    We have also search to see if we could find a solution but no luck so far.

    Please help us out.

    Thank you and best regards,
    Finn

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Support Laszlo

    (@laszloszalvak)

    Hi @fh4545

    I checked out the Free version of your theme:
    https://themeegg.com/downloads/multicommerce/
    and I put a slider into the “Header Area” widget position.

    The gaps between the slider and the menu are coming from two places:
    1.) From the .widget class:

    .widget {
        margin: 0 0 1.5em;
    }

    from this file: https://flashportals.com/eflash/wp-content/themes/multicommerce/assets/css/main.min.css?ver=1.0.2

    2.) From the padding of the div with the class: navigation-wrapper:

    .navigation-wrapper {
        padding-top: 20px;
    }

    coming from this file:
    https://flashportals.com/eflash/wp-content/themes/multicommerce/assets/css/main.min.css?ver=1.0.2

    So I would suggest reverting all the other custom codes that were inserted to fix this problem and you could use this custom CSS code instead:

    aside.widget_smartslider3{
      margin: 0px;
    }
    
    div.navigation-wrapper{
      padding-top: 0px;
    }

    what you could insert at your slider’s Slider Settings > Developer tab > CSS:
    https://smartslider3.helpscoutdocs.com/article/1294-slider-settings-developer

    Hi @laszloszalvak,

    Thank you for your reply.

    I have followed your suggestions and it made it happen. So no more gap at the bottom.

    I decided to run the slider up to the top menu which I did by adding 50px to the height of the slider, and as there also here was a small gap I used the top margin in the settings at the slider with -25px. There is properly a better way to do this. If so please provide me with the code.

    One more question, please. If I want to only have this slider (ID3) at the home page and insert other Smart Sliders at other pages how is this possible? I found this support post; https://wordpress.org/support/topic/display-smart-slider-3-slider-only-of-the-home-page-of-twenty-seventeen-theme/ – It looks like it is possible to use a shortcode ([smartslider3 slider=3 page=home]) – but where shall I insert this shortcode to be able to get the slider in the header? In a page I can use the Gutenberg shortcode box, but this is not possible in the header.

    Regards,
    Finn

    Plugin Support Ramona (from Nextend)

    (@nextend_ramona)

    Hi @fh4545

    The remaining space above the slider is caused by the site logo’s container, which is empty, so simply hiding it (without having to use negative margins) seems to be a much better solution. Try this code:

    .site-logo {
        display: none;
    }

    For instance, at the Customizer > Additional CSS.

    Gutenberg block doesn’t support shortcode parameters. But you should be able to edit your other pages with Gutenberg (including the part where the slider is on the homepage) so you could put a different Gutenberg module to each page.

    Judging by the codes of your page, you’re using a widget to publish the slider not Gutenberg editor. Widget positions are created and handled by the theme, so it depends on the theme where the widget position shows up. WordPress by default shows all widgets added to a widget position to all pages where this widget position is called by the theme.

    You can use a plugin like Widget Options: https://wordpress.org/plugins/widget-options/
    to have better control over the location of individual widgets.

Viewing 3 replies - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.