WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] WOWslider page postioning (11 posts)

  1. viensia
    Member
    Posted 1 year ago #

    I am trying to position the wowslider to the right of the text rather than at the bottom (or top) of the page. I am definitely a noob at this and don't know where to begin. I did a search and saw that a DIV code can be used, but nut even sure where to place it. Any help would be appreciated. The page in question is: http://nolagoodeats.com/private-parties

    Thank you so much!

  2. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Yes - assuming you're using a header.php file in your child theme?

    If so, change the code to add a div around the slider code:

    <div id="sliderdiv">
       PUT THE SLIDER CODE IN HERE
    </div>

    Then add to your style.css file:

    #sliderdiv {
         float: right;
         width: 50%;
    }

    Above is a rough start - see if that gets you going on it.

  3. viensia
    Member
    Posted 1 year ago #

    I guess I wasn't clear, sorry about that! The wowslider in the header is fine, there is a 2nd wowslider at the bottom of the page http://nolagoodeats.com/private-parties that is a fade effect. I would like to have it next to the text. Thank you!!

  4. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Ah, okay, sorry about that. So try putting the Wow Slider code in above your text on that page and adding "float: right;" to the slider's CSS:

    #wowslider-container15 {
        border: medium none;
        margin: 0 auto;
        max-width: 150px;
        position: relative;
        text-align: left;
        z-index: 90;
        float: right;
    }

    If that doesn't seem to work, can you post the code for that content - use the code buttons to post it here.

  5. viensia
    Member
    Posted 1 year ago #

    That seems to have worked! Thank you so much, I'm also putting together a (currently hidden) page for another site, this will help me greatly!!

  6. viensia
    Member
    Posted 1 year ago #

    If I could ask one more thing... I know it should be intuitive, but if I want it on the left instead I simply change text-align: left to right and float right to left, correct?

  7. viensia
    Member
    Posted 1 year ago #


  8. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    No problem - that's why we're here :). Just changing the float to "float: left;" should do it.

    To add some space, add a margin to it:

    #wowslider-container15 {
        border: medium none;
        margin: 0 0 0 20px;
        max-width: 150px;
        position: relative;
        text-align: left;
        z-index: 90;
        float: left;
    }
  9. viensia
    Member
    Posted 1 year ago #

    got it! thanks again! Used

    #wowslider-container15 {
        border: medium none;
        padding: 20px;
        max-width: 150px;
        position: relative;
        text-align: right;
        z-index: 90;
        float: left;
    }
  10. viensia
    Member
    Posted 1 year ago #


  11. viensia
    Member
    Posted 1 year ago #

    OK, back to my coffee...

Topic Closed

This topic has been closed to new replies.

About this Topic