Home Forums Weaver Xtreme Theme Background Image Slider

Topic Resolution: Answered
Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #65548
    Answered
    Caetlyn
    Participant

    I’m trying to set up a photography site and I want to be able to have an image slider on the front page. However, is it possible to set the slider up as background images rather than just a slider on front page?

    Thanks in advance!

    #65554
    scrambler
    Moderator

    You would need to provide a link to the page with the slider in as content and explain exactly under what it would, like whole browser, just content or header etc…

    Depending on the exact situation, we could move some content over the slider with CSS, but it may also require a plugin.

    #65555
    Caetlyn
    Participant

    The best example I can give for exactly what I’m looking for can be found on this website:

    https://www.dk-photography.com.au/

    So far, all I’ve been able to achieve is this, using the Site Origin plugin.

    Home

    #65556
    Best Answer
    scrambler
    Moderator

    This reply has been accepted as the best answer.

    If you are going to want the slider to cover the whole browser area in a responsive way, which means not with a fixed aspect ratio, but a ratio that will adapt to the browser, then I suspect you will need a dedicated plugin. There are plugins out there to do that with Video and sliders, but I don’t have specific knowledge.

    A quick search returned this one

    https://www.wonderplugin.com/wordpress-slider-plugin/how-to-create-a-wordpress-full-screen-background-slider/

    Or these

    https://wordpress.org/plugins/tags/background-slider/

    If you could do with just a full browser width slider on a page with only the menu at the top could be done this way.

    • Create a page and select the Blank template for it,
    • Use the page Visibility option tab to hide all the site pieces you don’t want that are visible on other pages like footer, widget area…
    • Use the page Layout tab to select no sidebars if not the default
    • Use the page Misc options tab to select “allow raw HTML and Script” So the editor is HTML only if using the classic editor, or use an HTML block editor if using the block editor
    • Put the content below in the HTML content area
    <div class="wvrx-expand-full">
    Your slider shortcode (make sure the slider is created for a 100% width)
    </div>

    That will expand the container of the slider to the full browser width

    #65564
    Caetlyn
    Participant

    I’ve tried to follow the steps you have outlined but nothing happened.

    I setup a slider with the shortcode [show_slider name=nature] which I added into the HTML content area as you have instructed and came up with a blank page. What am I missing?

    For now, I’ve added the slider in the actual editor using Smart Slider 3 but it still isn’t quite the affect I’m looking for.

    #65565
    scrambler
    Moderator

    Please be specific.

    What editor are you using (default WP block editor, or classic editor)

    Give me a link to the test page you created with the HTML I gave you and and Slider shortcode inserted

    Create a new test page and simply type the slider shortcode in the content area and give me a link to that page too.

    Also which slider plugin are you using, because the shortcode syntax you gave me looks exactly like the Weaver Show Slider plugin. is that the one you are using?

    Because you mention Smart slider 3, and if they use the same syntax that could be a problem if you also have the weaver show slider installed.

    #65571
    Caetlyn
    Participant

    I use WP classic editor but have the Site Origin Page Builder plugin installed as well.

    I’ve created a new test page in which I’ve used the Weaver Show slider plugin shortcode only [show_slider name=nature]. Here I’ve gone through all steps you have instructed in your previous post.

    Test

    I’ve somewhat managed to create a full width slider using Smart Slider (but not a background slider) by adding Smart Slider Widget into the Site Origin Page Builder. The shortcode for that particular slide show is [smartslider3 slider=”2″].

    Home

    I hope that is clear enough. 🙂

    #65572
    Caetlyn
    Participant

    Update. After some thought, I’ve decided to use the Wonder Slider Plugin as your first suggestion. That seems to do exactly what I’m looking for. Thank for you help. 🙂

    #65575
    scrambler
    Moderator

    I think a real background slider is the right choice 🙂

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