• 0

DMS 2 Placing a vertical menu over a RevSlider


Question

Posted · Report post

I'm using v2.1.1, I am looking for advice about how to place a vertically oriented menu over the top of a RevSlider. I could use Canvas and TextBox to place a coded menu into position, but my concern is that it would not scale with the slider (or maybe I would just need to create many screen size determined CSS rules to accommodate size), but I would prefer to use a WP piece that would be configurable. Anyway, maybe there is a more elegant solution? 

 

Thanks,

Tom

Share this post


Link to post
Share on other sites

6 answers to this question

  • 0

Posted · Report post

Thanks for your advice. I went ahead yesterday and hammered something into place just using a Canvas section below the slider with a TextBox that I manually created a menu for and then used CSS to place it where it needed to be — you can see it here: http://www.heronswoodgarden.org

 

I was hoping I might find an easy WP menu I could place so updating it would be easier for somebody who was uncomfortable with coding, but I think this will be suitable. I hid it on small screens in favor of the default sliding menu.

 

-Tom

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Tom,

 

In order to add something custom like a vertical menu will require you to use the Slider Extra Options panel and use HTML. However, I am not sure if this will work or not, if you want to continue and give it a try, you will need to use the guide from here - http://www.orbis-ingenieria.com/code/documentation/documentation.html

 

You can see my example code here which demonstrates how to add a video to the RevSlider section before the video options were implemented. The priniciple is the same for adding HTML such as a text or a list, so you can use this as a guide.

 

http://forum.pagelines.com/topic/28168-revslider-how-to-add-video-and-have-it-resize-properly/page-2#entry171007

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Looks awesome, nicely done. Also, you could try using this plugin to display a WordPress menu via a shortcode. 

 

https://wordpress.org/plugins/shortcode-menu/

 

Please bear in mind that I haven't tested this plugin personally.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Nice.  So you put the menu code in a text box, in a canvas section below the slider?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Nice.  So you put the menu code in a text box, in a canvas section below the slider?

 

Yes, that is exactly what I did, place the "menu" as html in a Text Box within a Canvas section, and use the LESS css customize area to place the new piece up and over the slider (using negative margin-top and z-index: 200;). 

 

By making this part of a custom template the new vertical navigation is automatically added to new pages—with the tools available it really seems like a very flexible system.

 

-Tom

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

tomtwigg

 

I'm trying to do something similar with a horizontal menu over RevSlider.  I have it in place but can't sort out the Z-index.  Did you go through and assign a Z-index to every section on the page?  I looked at your site and the z-index for the vertical menu seems to be 10 and I couldn't see how the other sections were assigned z-index.

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now