Twenty Eleven Slider Positioning

guitarwizard93 · Member · Aug 27, 2013 at 3:00 pm
Copy link

Add topic to favorites
Is it possible, with the Custom Design upgrade, to reposition the featured post slider in Twenty Eleven so that it appears below the static content of my front page?

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Aug 27, 2013 at 4:08 pm
Copy link
Yes, it is possible to reposition the slider. Right now I’m seeing the page content above the slider on your main page and I see that you have hidden the “Recent Posts” section, which did appear below the slider. Were you wanting the slider below the Recent Posts section (now hidden)?
guitarwizard93 · Member · Aug 27, 2013 at 4:10 pm
Copy link
I don’t want the “Recent Posts” section on the front page at all, hence its removal, but yes I would like the slider below where the Recent Posts section should be.

I’d like the page to be menu, slider, static content as you scroll down.

Thanks!
thesacredpath · Member · Aug 27, 2013 at 4:32 pm
Copy link
Ok, so you want the slider above the static content. The following moves the content below the slider using position absolute. That means that if the content length changes on your main page, you will need to adjust the height for #primary.
```
.home #primary {
    height: 457px;
    position: relative;
}

.home article.intro {
    left: 0;
    margin-left: 0;
    margin-right: 0;
    position: absolute;
    top: 375px;
}
```
justpi · Member · Aug 27, 2013 at 4:40 pm
Copy link
There’s a safer alternative: edit the page, cut the static content, paste it into a Text widget in the first Footer Area, set the Visibility of the widget so that it shows on the showcase page only. (You can then use some CSS to change the styling of the text, if necessary.)
guitarwizard93 · Member · Aug 27, 2013 at 4:41 pm
Copy link
Ok, so is the height of #primary the height of the slider from the bottom of the page?

(That works perfectly by the way, thanks, just trying to understand it properly so I can adjust later if necessary)
thesacredpath · Member · Aug 27, 2013 at 4:58 pm
Copy link
The height of #primary is from the top of the featured slider (nearly the bottom of the menu bar) to the top of the footer.

@justpi’s solution is worth considering also, but if your main page content is going to remain fairly static, the CSS solution will work as well.
guitarwizard93 · Member · Aug 27, 2013 at 5:02 pm
Copy link
I plan to put some other stuff in the footer area, so the “safer alternative” wouldn’t really solve much for me unfortunately. Plus, when I tried it with no content it still had the big grey text box across the screen.

Thanks though, it’s looking great!
thesacredpath · Member · Aug 27, 2013 at 5:30 pm
Copy link
You are welcome.
justpi · Member · Aug 27, 2013 at 11:15 pm
Copy link
For the record, my alternative doesn’t exclude “other stuff in the footer area”: each footer widget area accepts as many widgets as you like. (And grey boxes can always be removed.)
guitarwizard93 · Member · Aug 27, 2013 at 11:17 pm
Copy link
I know, but my ideal configuration has all 3 footer areas occupied with their own list of links, rather than a full width text box. But thanks anyway!
aboughtin · Member · Sep 10, 2013 at 4:13 pm
Copy link
Hi guys! I followed your advice to switch the positioning of slider, but now my widgets are being cut off. How can I fix this? Thanks in advance for the help.

http://aboughtin.wordpress.com/
designsimply · Member · Sep 16, 2013 at 11:34 pm
Copy link
I looked at http://aboughtin.wordpress.com/ and the widgets look okay to me.

@aboughtin, would you mind starting a separate help request at https://en.forums.wordpress.com/forum/css-customization/#postform and explain in a little more detail about exactly what is being cut off?

No items found.