Sticky Header + Padding Issues

Hey! Wonderful theme. Heres my progress:
http://www.rodrigo.wtf/undo/unload/

Questions:
1. I don’t want the sticky header to get less tall, essentially I want the normal header and sticky header to be identical, no change in height. How can I do that?

2. Is there a way to make the BG of the header semi transparent? Like if I wanted to make it 50% white instead of a solid white.

3. There seems to be something pushing my footer down, how can I fix that?

http://imgur.com/a/OHWFB

4. How do I make my newsletter suscribe button align next to the input box like in the demo? Also how do I add the little icon like you have?

http://www.rodrigo.wtf/undo/home-watches/

vs http://demo.xtemos.com/basel/watch-demo/

Hello,

Thank you very much for using our theme and contacting us!

Your web-site looks very nice so far 🙂

1. Add the following code snippet to the Custom CSS section in Theme Settings to make your sticky header have the same height as your default header

.header-shop.act-scroll .main-nav .menu>li>a {
    line-height: 105px;
    height: 105px;
}

2. Here is a code for this task

.main-header, .sticky-header.header-clone {
    background: rgba(255,255,255,.7);
}

3. We don’t see the problem with footer on your web-site. Did you fix it?

4. This issue is already fixed also, right?

Regards

Hey guys! I tried adding the code and neither 1 or 2 seemed to do anything?

Still changing height and its not transparent.

Not sure whats going on.

http://imgur.com/a/bKuxP

I got it working! Had to add !important tags on there.

Ok one last request I think.

1. Would it be possible to add social icons on the right hand side header next to where the shopping card/wishlist/search buttons would normally be?

2. Is it possible to temporarily hide the “account login/signup” text links on the right of the header? Dont want people clicking that just yet till we get the actual store up. Is there any css code we can use to hide it?

1. There is no such option in our theme. But if you want to we can provide you with this customization for free. Just install a child theme from the downloaded package and provide us your FTP access.

2. Yes, you can disable them in Theme Settings -> Shop -> My account.

Regards

Great! I will be getting you that info in a bit.

Got most changes made, the other question I had is, is it possible to get the header to behave the way it does here?

https://www.thereformation.com/

Transparent at first, if you mouse over the opacity comes up, and if you scroll down the white stays there.

Try to use the following code

.main-header:not(.act-scroll){
    background: rgba(255,255,255,0)!important;
    transition: .2s all;
}
.main-header:not(.act-scroll):hover {
    background: rgba(255,255,255,.8)!important;
}

That worked perfect! Thanks a ton.
Providing you with FTP info below so we can add social buttons to the top right header next to where cart/search would normally be.

Hi,

Sorry, but it is necessary to set up child theme before doing changes to prevent losing any customization after the update. You will find the child theme in the downloaded package from themeforest.

I went ahead and installed and activated the child theme!

Can you make it work now?

Done, please check now.

Beautiful! Perfect.

I think my final question is, I want to add a fullscreen background to the entire content area of this page: http://www.rodrigo.wtf/undo/unload/

But I cant add a bg through visual composter to the entire page, just to specific rows or columns. Any idea how I can do this?

The only one way to place video on background is to use Visual Composer video feature. We don’t know other ways to do it with our theme, sorry.

No not a video! Just a simple IMAGE background to that entire page. Like this:
http://www.rodrigo.wtf/undo/unload/

Oops, I mean like this, fullscreen bg image like this:
https://www.thereformation.com/whoweare

If you scroll down you see how its a full bg image for the entire content areas

Ah, sorry. You can place the following custom code snippet to the custom CSS area in Visual Composer for this page

.website-wrapper {
    background-image: url(https://assets2.thereformation.com/assets/who-we-are/main-section-f9784cb59f477019eb6f641180307770.jpg);
    background-size: cover;
    background-repeat: no-repeat;
}

[Author]

Posts