Add unique form to dropdown in top bar

[GeorgiaG]

I am sorry. I was unable to communicate for a time. I am writing as a follow-up to an earlier thread: Add dropdown with login form to top bar on X.

I am creating a log-in which will take users to a third-party site that they use to operated and manage their clients though. So it is not a generic login but form code provided by that company. It saves the client a step and adds the feeling of it being a completely integrated service. I have the form working successfully in the footer but they would like it in both locations. Is there a way to add it to a drop-down from the top bar? Login button at top and working form in footer

[basanta]

HI There,

Thanks for writing in!

Regretfully there is no such feature in X to add a dropdown and custom code to the header, But Pro header builder having the feature to make similar kind of drop down.
If you need it in X, you need help if a developer to customize the header code.
We are really sorry but this is something out of our theme support scope.

Thanks for your understanding.

[GeorgiaG]

Is there any information you can point me to accomplish this in Pro? I have a license for that and will change my install today. Thank you! Best. g

[jade]

Hi there,

What you are aiming to do it quite a specific setup and there is currently no element on Pro header builder that creates a dropdown when you click on a button. There are other elements on Pro like the off canvas element but it open a section from the side of the page. This could be possible with custom development, but this would be outside the scope of support we can offer. You may wish to consult a developer to assist you with this. X and Pro are quite extensible with child themes, so there are plenty of possibilities.

Thanks for understanding. Take care!

[GeorgiaG]

I think I was able to do it but I am having an issue with the z-index and getting it to be on top of all else. I added this to the div:

and this to the css:
.login {
position: relative;
z-index:99999!important;}

Is there something I am doing wrong? see the menu It is the button in the top bar “client sign-in”

I have also tried
.hm3 .x-dropdown .hm3 .x-dropdown:active or variations and can not find the magic piece.

Thank you!

[basanta]

Hi There,

Please add this css to your Global or header CSS and let us know how this goes.

.hm1.x-bar {
z-index: 9999 !important;
}

.hm8.x-bar {
z-index: 5 !important;
}

Thanks

[GeorgiaG]

@basanta, that worked. Thank you!

[paul.r]

On behalf of my colleague, you’re welcome. Cheers!