Tagged: enfold, shrinking header
Hi – I want to add either some text or an image to my header (to the right of the logo) and I’m using the Shrinking Header, and was wondering how I would make that content either shrink when scrolling down.
Is that possible at all?
Thanks!
John
Hi sundialstudios!
Thank you for using Enfold.
Please add this on functions.php:
function add_stuff_to_header_func() {
?>
<div id="header-right">PUT ANY CONTENT HERE</div>
<?php
}
add_action('ava_main_header', 'add_stuff_to_header_func')
Use the #header-right selector on Quick CSS to stylize the new container.
Best regards,
Ismael
Thanks!
If I wanted to add another element and have it disappear when the header begins to shrink, is that doable?
Cheers!
John
Hey!
You can try to use the header-scrolled class to hide your element if the header shrinks. Use it like:
#header.header-scrolled .my-css-class{
display: none !important;
}
and replace my-css-class with the css class of your html element you want to add to the header.
Regards,
Peter
Thanks Dude – exactly what I was looking for!