How to add the social icon directly on the menu bar and footer

Hi there,

This should help:
https://docs.generatepress.com/article/adding-icons-to-menu-items/
https://docs.generatepress.com/article/footer-bar-widget-area/

Let me know if this helps :)

Thank you! This is awesome.

No problem :)

Hi Leo,

I realized even though I successfully added 2 social icons on the menu bar, but the whole menu would be minimized if I browse my website via phone. Is it possible/ is there a way for me to make the 2 icons appear even in mobile mode?

https://prnt.sc/rflwzo

Did you decide not to use the mobile header option?

The method to add social icons is a bit different so I need to confirm that first.

The screenshot is using the mobile header but the live site is not.

Let me know :)

Did you decide not to use the mobile header option? => I'm not sure what you meant by that. The mobile version still have the header, it just got minimized so it only showed "Menu" instead of the full version, which is fine. But I just want to see if I can add the social icon beside the "Menu" since there's still lots of space for that. So when one scroll down they can still see the icon along on the menu bar. Does it make sense?

That case you would need to add the social icons using the inside_mobile_menu_bar hook with Hooks elements:
https://docs.generatepress.com/article/hooks-element-overview/