different slider settings for different widget areas

Homepage Community Forums Epik Theme Support different slider settings for different widget areas

Viewing 24 posts - 1 through 24 (of 24 total)
  • Author
    Posts
  • #12448
    Event
    Customer

      Is it possible to have 1 stationary image in the “Slider Wide” area and several slides in the “Slider Area”?

      #12449
      Event
      Customer
        This reply has been marked as private.
        #12450
        Wes
        Moderator

          I’m a little confused, do you want to have a background image for the Slider Wide and then show the regular slider in the “Slider” widget area? If so, yes you can do this. I would add the image in directly instead of running multiple instances of the Genesis Slider since it will only let you use 1 slider I believe.

          #12451
          Event
          Customer
            This reply has been marked as private.
            #12452
            Event
            Customer
              This reply has been marked as private.
              #12465
              Wes
              Moderator

                You should be able to add a background image by using the image uploader in your WP admin under “Customize“. If you want to add it directly to your CSS, you can look around line 1146 for this –

                .slider-wide {	
                    clear: both;
                    width: 100%;
                }

                Then add the link to your background image like this –

                .slider-wide {
                    background-image: url(images/your_image_goes_here.jpg);	
                    clear: both;
                    width: 100%;
                }
                #12501
                Event
                Customer
                  This reply has been marked as private.
                  #12516
                  Event
                  Customer
                    This reply has been marked as private.
                    #12517
                    Wes
                    Moderator

                      You would need to add a widget inside of the Slider Wide widget area in order for it to show up. You can add a slider or you can add a text widget. If you plan on keeping it empty just add a text widget, but you’ll need to increase the padding inside of it, or adjust the height of the widget area (though css) if you want it to display the entire area.

                      #12527
                      Event
                      Customer
                        This reply has been marked as private.
                        #12528
                        Event
                        Customer
                          This reply has been marked as private.
                          #12529
                          Event
                          Customer
                            This reply has been marked as private.
                            #12536
                            Wes
                            Moderator

                              Did your code not show up in reply? I wasn’t sure if you tried to post code here in the forums or not…..but if you ever need to you have to add your code, then highlight it, then click the button that says code and it will show up in the code format for the forum.

                              I’m looking at your site source code, but I can see a lot of code added and I’m not sure what it is, or what it’s supposed to do.

                              “You mentioned I could also add a slider to add it, however I believe only 1 genesis slider can be utilized in the theme and I want use the genesis responsive slider in “Slider Wide”.”

                              Yes only 1 Genesis Slider can be used at a time, I thought that’s what you were doing right? Are you trying to add a background image, and then have the slider on top of that or are you trying to have a full width slider with the slider using the entire width/background?

                              Example: If you look at this demo – http://demo.appfinite.net/insync/ the background image is full width, and the text in the middle is 1140px wide and fits in the center (lets pretend the text is the slider). Is this what you’re trying to achieve? Or did you want the slider itself to be full width?

                              #12537
                              Event
                              Customer
                                This reply has been marked as private.
                                #12538
                                Event
                                Customer
                                  This reply has been marked as private.
                                  #12539
                                  Event
                                  Customer
                                    This reply has been marked as private.
                                    #12540
                                    Event
                                    Customer
                                      This reply has been marked as private.
                                      #12542
                                      Event
                                      Customer
                                        This reply has been marked as private.
                                        #12544
                                        Event
                                        Customer
                                          This reply has been marked as private.
                                          #12560
                                          Wes
                                          Moderator

                                            In your code above, that would add the image “inline” which means it wouldn’t be a “background” image (but it will show up). If you want an actual background image, then you would need to add that in your css to the “slider-wide” on line 1146 – background: url(http://hardmoney.com/wp-content/uploads/2014/05/New-York-Properties2.jpg);. If you’re only planning to add just one image then you don’t need to use a slider, just add the background image from the code above.

                                            Also, in your code above, it probably didn’t show up in your widget because it was missing a " at the end.

                                            Here’s what the end result should look like if you want to add it in your css –

                                            .slider-wide {
                                                background: url(http://hardmoney.com/wp-content/uploads/2014/05/New-York-Properties2.jpg);
                                                clear: both;
                                                width: 100%;
                                            }
                                            #12596
                                            Event
                                            Customer
                                              This reply has been marked as private.
                                              #12606
                                              Wes
                                              Moderator

                                                That’s the background image you added to .slider-wide. You have an inline image added on top of the background image.

                                                #12609
                                                Event
                                                Customer
                                                  This reply has been marked as private.
                                                  #12618
                                                  Wes
                                                  Moderator

                                                    It’s the code that you already added. If you want to remove the background image then remove the code that you added to the .slider-wide in your css (same code we talked about in the above posts) –

                                                    background: url(http://hardmoney.com/wp-content/uploads/2014/05/New-York-Properties2.jpg);

                                                    You won’t need the background image if you’re adding it to your widget area directly/inline, so that’s why I would recommend removing it.

                                                    It should be located around line 1187 in your css.

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