badget

Biggest Sale! Special Offer!

Get 30% discount on all of our single themes with this coupon code: #30%SALE

Hurry up! *Limited time offer*

Extending Revolution Slider across full width

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #6011
    rwendeln
    Member

    I am trying to set up different Revolution Sliders on different pages. In order to do so, I’m pasting the various Slider IDs and page locations/IDs into the header.php file and that works just fine, except for one hitch. It appears that because the Slider is placed within the “container,” it’s width is decreased to 94%, i.e., 978px rather than the full 1038px–leaving white borders on left and right of the slider.

    Is there a way to remove those borders for the Revolution Slider only? (If I change the “container” in style.css from 978 to 1038, it moves over the other header information, such as top menus and titles.)

    Note: I’ve tried placing the Revolution Slider various ways, using the widget and entering the slider ID directly into page contents, but alignments are always off. I get the best results coding the header.php file directly, and setting Slider settings to “Full Width” in the Edit Slider Settings and “Center” in the Position Settings.

    Thanks.

    #6029
    Sanjip Shah
    Participant

    @ Try the following setting
    Slider Type: Fixed Responsive (Check here) Full Width
    Slider Size:
    Slider Width: 1038 Slider Height: 460
    Responsive Sizes:
    Screen Width1: 1078 Slider Width1: 708
    Screen Width2: 767 Slider Width2: 450
    Screen Width3: 479 Slider Width3: 300

    If you see the demo here https://www.themehorse.com/preview/attitude-pro/ we have not put the slider container class.
    You can do the same and place it just below the menu.

    #6038
    rwendeln
    Member

    Thanks, Sanjip. It looks like it’s working great now. Here’s the sample site, if you want to check it out:

    http://prescienceassoc.wanderingjoy.com/front-page/strategic-planning/

    And here’s where I inserted the test Revolution Slider in header.php through the editor:

    `<head>

    <?php
    /**
    * attitude_title hook
    *
    * HOOKED_FUNCTION_NAME PRIORITY
    *
    * attitude_add_meta 5
    * attitude_show_title 10
    *
    */
    do_action( ‘attitude_title’ );

    /**
    * attitude_meta hook
    */
    do_action( ‘attitude_meta’ );

    /**
    * attitude_links hook
    *
    * HOOKED_FUNCTION_NAME PRIORITY
    *
    * attitude_add_links 10
    * attitude_favicon 15
    * attitude_webpageicon 20
    *
    */
    do_action( ‘attitude_links’ );

    /**
    * This hook is important for wordpress plugins and other many things
    */
    wp_head();
    ?>

    </head>

    <body <?php body_class(); ?>>

    <?php
    /**
    * attitude_before hook
    */
    do_action( ‘attitude_before’ );
    ?>

    <div class=”wrapper”>
    <?php
    /**
    * attitude_before_header hook
    */
    do_action( ‘attitude_before_header’ );
    ?>

    <header id=”branding” >
    <?php
    /**
    * attitude_header hook
    *
    * HOOKED_FUNCTION_NAME PRIORITY
    *
    * attitude_headerdetails 10
    */
    do_action( ‘attitude_header’ );
    ?>

    </header>

    <?php
    /**
    * attitude_after_header hook
    */
    do_action( ‘attitude_after_header’ );
    ?>

    <?php
    /**
    * attitude_before_main hook
    */
    do_action( ‘attitude_before_main’ );
    ?>

    <?php putRevSlider(“Planning Services Slider”,”131″) ?>

    <div id=”main” class=”container clearfix”>

    #6054
    Sanjip Shah
    Participant

    @rwendeln It looks that you have edited the theme file directly. You will lose the changes when you update the theme so be careful when you update the theme. Also, in our theme options->slider options. There you can choose the revolution slider and set it in the header part, please try using that as well. It may be easier for you that to edit the code.

    #7882
    Gregory
    Member

    I’m having the same issue as rwendeln and your solution didn’t work for me. In fact, my options in the Edit Slider section are not the options you suggest above:

    @ Try the following setting
    Slider Type: Fixed Responsive (Check here) Full Width
    Slider Size:
    Slider Width: 1038 Slider Height: 460
    Responsive Sizes:
    Screen Width1: 1078 Slider Width1: 708
    Screen Width2: 767 Slider Width2: 450
    Screen Width3: 479 Slider Width3: 300

    My options are:

    Slider Layout: •Fixed •Custom •Auto Responsive •Full Screen

    So i’m not sure what you mean by “Slider Type: Fixed Responsive (Check here) Full Width”

    Also, the only option out of those four that allows for entering your dimensions above is “custom”. I tried that, with your dimensions and it did not work. Seems like anything I adjust in the Edit Slider section just effects the image within the slider and not the div that the slider is contained in.

    I also don’t completely follow this instruction:

    “If you see the demo here https://www.themehorse.com/preview/attitude-pro/ we have not put the slider container class.
    You can do the same and place it just below the menu.”

    Do you mean remove the the class designation from the slider container? Or move the div for the slider outside the container div?

    Anything else you can suggest to help?

    #7938
    Sanjip Shah
    Participant

    @Gregory After the updates looks like settings are changed. You can try the auto responsive and force full width option.

    #7970
    Gregory
    Member

    All that the auto responsive and force full width option seem to do is effect the image inside the slider, not the box/div/container holding the image. how did you guys get the box holding the slider to be the width of the main container without having all the divs move out to the main container? unless you went back in and added padding to all the dives except the slider div?

    #8035
    Sanjip Shah
    Participant

    @Gregory If you could also provide a link to the exact page where you are trying to adjust this, I could look deeper into it.

    #8058
    Gregory
    Member

    http://wordpress.thepit-bbq.com/

    just trying to get the slider image to go to the edge of the main container div like you have it in your demo page. Not sure how to do that since all the main content is housed inside the wrapper div inside that main container dive.

    Thanks

    #8082
    Sanjip Shah
    Participant

    @Gregory Just checked your site and I see that you have included the rev slider in the content part. But in our demo we have added it in the header. You can also do the same. To do that, in the dashboard, go to Appearance->Theme Options->Slider Options Tab->Slider Options. There enable the slider and choose the rev slider. And also in the Revolution Slider Options bar, choose the rev slider there and click on ‘Save all Changes’. Hope this helps.

    #8099
    Gregory
    Member

    Looks like that was it. Thanks so much.

    #8117
    Sanjip Shah
    Participant

    @Gregory Welcome.

    #28130
    Jasyn
    Participant

    Hi,

    I’m having trouble making my homepage revolution slider full width. I have the same problem where there is a small white border around my slider.

    When I click on Ambition theme options there isn’t any ‘slider options tab’?

    Thanks,

    Jasyn

    #28164

    Hi Jasyn,

    For Ambition theme Go to Appearance > Customize > Ambition theme Option > Featured Content Setting > Choose Slider type to Revolution Slider and save it and go back to main option and now you will see the revolution option there you can set the revolution slider that you have created. Now you can see the homepage revolution slider with full width as per your settings.

    Thank you!

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