Home>Support>Page Builder – Fixed position row/widget

Page Builder – Fixed position row/widget

Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

Dear sir/madam

I am new to WordPress and also website building. I have found Site Origin’s Page Builder Plugin very very useful but not without a small learning curve all the same.

Currently I am having trouble creating a fixed or sticky row. I am attempting to create a menu or navigation bar by making one of my Page builder rows sticky or fixed in position.

I do believe this is possible with a very simple addition to the HTML main coding and a small CSS HTML addition which I will probably attempt if I am unable to get find another solution. With my limited HTML coding experience I have been looking for a plugin to use instead but most do not provide the simple feature I require.

I imagine it Would easiest and also very useful for Sight Origin to add a sticky/fixed row function to their Page Builder plugin. This function should also have a simple height from top, height from bottom, etc setting. Perhaps this is something that your team could consider for the future.

In the meantime if possible could you provide custom CSS code that I could use to make a row sticky or in a fixed position? I would be most appreciated.

It should be mentioned that I understand that there are several plugins that are able to do this. Some of them do this quite well. The problem I have is that my theme already has a Sticky menu at the top of the page and adding another, second, sticky menu or element often causes problems with my original sticky menu by knocking it out of place and creating a margin at the top of the page. I am thinking about contacting the plugin creators to also discuss this. What I am looking for is the ability to create a second menu underneath my current sticky menu that comes with my theme. This can be either sticky or fixed. I would prefer to have the ability to create a fixed row on Page Builder where I am able to add simple widgets that display text with URL links as my menu. This is much more preferable to me than creating hundreds of new menu locations, which will only be used once on one page, through my theme’s menu system. Also I have no need for a dropdown function on this menu. This “menu” bar will only appear on small number of selected pages. Also, I am trying to limit the amount of plugins I install on my WordPress site so adding this feature to Site Origin’s page builder seems like a win win. On on a further note if I were able to create sticky or fixed rows I would no longer need my theme to perform this function.

An example of what I am looking for is attached
https://ibb.co/muSmqa

Any assistance or further information on this topic is appreciated

Thanks

Paul

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 8 years, 4 months ago Alex S
    Hi, I Work Here

    Hi Paul,

    So it is possible to sticky things with CSS but I wouldn’t recommend it for your use case as you can’t set things like offsets and when to make things sticky (you can only do that with JavaScript). Instead, I would recommend using Sticky Menu (or Anything!) on Scroll. Once installed, open the widget you wish to sticky and head over to the widget styles sidebar. Open the Attribute settings group and set the class to is_sticky and then save the page. Navigate to WP AdminSettingsSticky Menu (or Anything!) and input .is_sticky into the Sticky Element field. Switch to the Advanced Settings tab and set the z-index to 1000. I would recommend looking over the rest of the settings as there may be a few other things you would like to control.

    I’m going to log this as a feature request.

  2. 8 years, 3 months ago Paul Borkowski

    Hi Alex,

    Thanks for your reply

    Thank for your suggestion.

    I had previously installed the Sticky Menu (Or Anything!) On Scroll plugin but I found that it wasn’t perfectly suited to what I needed as i am only able to make one element “sticky” on my page. I would like the option to stick more than one element and the ability to customize the positioning of these elements individually as opposed to the site wide Sticky Menu (Or Anything!) On Scroll function.

    However, I do not see any alternative at the moment and have been using this plugin and playing around with it over the past week or so. I now have something that is quite similar to what I require.

    The only problem now is my other menu’s dropdown information is hidden behind my Sticky Menu (Or Anything!) On Scroll menu.

    Thank you for your help

    I will continiue to use this plugin until a better alternative comes along or Site Origin adds this feature to their page builder.

    Thanks

    Paul

  3. 8 years, 3 months ago Alex S
    Hi, I Work Here

    Hi Paul,

    I may not be able to help with that, but I can definitely take a look. Do you have a public URL where we can take a look at what’s going on?

  4. 8 years, 3 months ago Paul Borkowski

    Hi Alex.

    Thank you for your reply.

    I have created a temporary page that has both the Sticky Menu (Or Anything!) On Scroll element (a basic menu underneath my theme’s menu) and my theme’s menu (top of the page) as I would like them to appear.

    I have not added links to the Sticky Menu (Or Anything!) On Scroll as of yet.

    I am satisfied with what I have at the moment apart from the fact that I will have to disable the drop down menus from my theme menu as mentioned earlier unless you know of a way to display my theme’s menu in front of the Sticky Menu (Or Anything!) On Scroll menu below.

    below is a link to this temporary page I created
    http://www.gogohopping.com/hopping-vlogs-hopping-vlogs-2/

    Please note that my website may be NSFW for some people.

  5. 8 years, 3 months ago Alex S
    Hi, I Work Here

    Hi Paul Borkowski

    Try adding the following CSS to WP Admin > Appearance > Custom CSS:

    #masthead.site-header {
        z-index: 100000;
    }
    

    You’ll need to move the second navigation down slightly.

    Another option would be to lower the z-index of Sticky Menu (Or Anything!) On Scroll (please refer to my initial post on this for instructions).

    You might also need to install the SiteOrigin CSS Editor.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More