100% wide slider below menu (with sidebar)
First post and everything, wow. Well, I have a question to all of you brilliant people: how do I add a slider below my menu?
How can I add a slider of 100% width in between the header and the main content, when I also have a sidebar, such that the slider comes above the sidebar and content?
I want to add a slider of 100% width, that appears right above the main content area and sidebar. I’m thinking this would be part of the header then (unless, of course, I add another div in between), but I’m not quite sure how I would do this, any ideas?
To clarify my layout, I want:
1. A header image at the very top
2. The navigation right beneath that
3. A full-width slider beneath that
4. The standard layout with a sidebar and main content area.
The theme I am modifying is TwentyTwelve. I consider myself to be very good at CSS and HTML, fairly good at JS, and completely fine with PHP. However, I am a complete beginner as far as WordPress goes, and so I would appreciate it if you would take an extra minute to explain to me what I would need to add to, for example, enable for a slider, and how I would add it through the CMS would also be appreciated.
So far, the only things I’ve been able to think of is either changing the header-file to add for another image (possibly by adding a div after the nav), or adding a div right after the header (in the main template) with 100% width that would accept a slider or image. However, I am not quite sure of how I would do any of this, so all help is appreciated, even if you don’t have an exact solution to my problem!
The theme I am modifying is TwentyTwelve
Make VERY sure you are using a child theme to make changes to the theme – otherwise all your changes will be lost when WP is updated.
If you want the slider on all pages, it would go in the header.php file – in a modified COPY of that file in the child theme. Generally, you would use a plugin for the slider code – which would go in the header.php file.
Same with the other changes – they’d involved moving the HTML elements of the header.php file. This thread explains moving the navigation below the header image:
No, sorry for not mentioning that; the slideshow should only be on the static front page, so would it then be better to make a first-page template by editing the existing default template? But I still do not know how I would use the slider here, unless you were to make the top div of the first page display content from another hidden page, in which case I suppose I could just place the slider there.
Yes, in that case, you can make a custom template in the child theme – and add the slider code to the template:
Thanks a lot!
Got it to display the way I want, but I can’t seem to get the slideshow itself, and no js errors are popping up. Might be that I’m just tired, but I can’t find anything myself, would you mind looking through it?
The slideshow lies at eypeast.rs, currently being the image right below the nav.
Really appreciate all the help so far, thanks a lot!
- The topic ‘100% wide slider below menu (with sidebar)’ is closed to new replies.