One of the most frustrating aspects of using free WordPress themes is that the one feature you would like is only available in the Pro version. Sydney (the theme that I use for this website) is an exception to that. Thank you Sydney Developers!
A particular favourite of mine is Astra. Its lightweight, well-written and an excellent starting point for a website. However, the stick header option is only available in the Pro version.
Well, I have found the perfect way out. Adding the following Additional CSS to the free Astra theme will give you the sticky header you were looking for for free!
/*Make Header Sticky*/
.main-header-bar {
position: fixed;
top: 0;
width: 100%;
}
/*Adjust Content Padding*/
.site-content {
padding-top: 75px;
}
/*Adjust Content Padding for Mobile*/
@media (max-width: 800px) {
.site-content {
padding-top: 175px;
}
}
/*Adjust Content Padding for Mobile*/
@media (max-width: 650px) {
.site-content {
padding-top: 200px;
}
}
/*Make Header White and Transaprent*/
.main-header-bar {
background: rgba(255,255,255,.75);
}I wouldn’t advise doing this if you wanted other Pro features of Astra, but if all you want is a sticky header, its just the ticket.
