Sticky header for OceanWP is not available for free version, and you are demanded to buy the premium version or partially buy the extension.
But if you want to avoid it and to create the Sticky header on your free OceanWP-website, this post is for you.
OceanWP theme is definitely one of the best free WordPress theme that provide more features. From its customize menu, you can mazimize all the features to create a stunning website.
Moreover, if you install Elementor Page Builder, you can design the website as you want.
Like most themes out there, OceanWP comes with both free and paid versions, but even it gives you most complete feature than the other free WordPress themes have, the free version of OceanWP theme doesn’t have Sticky Header.
So, let’s use an alternative way by adding the CSS codes.
Sticky Header for OceanWP Free Version
CSS code to create a Sticky header for free OceanWP free version can be added through a custom CSS/JS option in customize menu.
The code is for the transparent and primary header. You must add CSS code separetely.
CSS Code for Sticky Transparent Header OceanWP Free
To make your transparent header sticky, you can use the CSS code below.
@media only screen and (min-width: 768px) {
#site-header.transparent-header {
position: fixed;
transition: background-color .15s ease-in;
}
}CSS Code for Primary Header
The following CSS code for primary (Site-header) sticky header should be added separately with the transparent one. You may copy the code below and paste it within the Custom/JSS field.
@media only screen and (min-width: 768px) {
#site-header {
position: fixed;
transition: background-color .15s ease-in;
}
}The next step is to publish and check it whether your website header has changed to be sticky or not.
OceanWP keeps updating regularly. It means that some codes in the theme may be changed. So you may regularly check the theme changelog if there is
But we definetely urge you buy the Ocean WP Header extension to make it easy for setting up your header.
That’s how to create sticky header for OceawnWP free WordPress theme. It’s easy, isn’t?
