-
AuthorPosts
-
May 1, 2024 at 6:22 pm #1441623
Hello everyone,
I am looking at adding a PNG image to the bottom of the header, which would act as an extension of the latter (it would be stuck to it, and would have the same length).
I’m unsure of how to approach this – I imagine that I could use a PHP script. But, I’m honestly not great at this coding language.
If anyone knows what code I could use, or another way of doing this, I will appreciate it!
Thank you in advance,
- This topic was modified 6 months, 4 weeks ago by marccat.
May 2, 2024 at 6:30 am #1441771Hey marccat,
Thank you for the inquiry.
You can add this code in the functions.php file to insert a container below the header:
add_action('ava_after_main_menu', function() { echo "<div class='av-bottom-header'></div>"; }, 10);
Then use this css code to adjust its style.
#top .av-bottom-header { width: 100vw; height: 20px; background: red; bottom: -20px; position: absolute; margin-left: -80px; }
Adjust the background property if you need to display an image:
background: url('image-url-here');
Best regards,
IsmaelMay 7, 2024 at 6:17 pm #1442593Hi Ismael,
Thanks a lot for your reply!
I tried using the code you provided, and the image does appear. But, I can’t adjust it so that it shows as it should.
I noticed that the issue could probably be solved easily if the <div> you suggest I add, was added after <div> with id ‘header_main’ and classes ‘container_wrap’ and ‘container_wrap_logo’.
Is there any way I can attach the image after said <div>
Thank you,
Marc
May 8, 2024 at 8:51 am #1442644Hi,
Thank you for the update.
was added after
with id ‘header_main’ and classes ‘container_wrap’ and ‘container_wrap_logo’.Try to replace the hook with “ava_main_header”.
add_action('ava_main_header', function() { echo "<div class='av-bottom-header'></div>"; }, 10);
Best regards,
IsmaelMay 9, 2024 at 5:57 pm #1442827Hi Ismael,
This worked wonderfully! I changed the hook and after amending the styles, it’s looking exactly how I wanted.
Thanks a lot!
Marc
May 9, 2024 at 7:27 pm #1442835Hi,
Glad Ismael could help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.Best regards,
Mike -
AuthorPosts
- The topic ‘Adding image to the bottom of the header’ is closed to new replies.