Add Custom Code to Body

[slucide]

Hi there,

I’d like to add these floating social media buttons on my site according to this example:
https://www.w3schools.com/howto/howto_css_sticky_social_bar.asp

I’ve already implemented the CSS but don’t really know how to include the html code in the body to make the buttons appear right.
I tried to implement this code into the child theme’s functions.php but I’m getting an error. The font awesome library was excluded since xtheme is already loading those.

add_action( 'wp_head', 'my_custom_head_output', 99999 );

function my_custom_footer_output() {
  ?>

<!-- The social media icon bar -->
<div class="icon-bar">
  <a href="#" class="facebook"><i class="fa fa-facebook"></i></a>
  <a href="#" class="twitter"><i class="fa fa-twitter"></i></a>
  <a href="#" class="google"><i class="fa fa-google"></i></a>
  <a href="#" class="linkedin"><i class="fa fa-linkedin"></i></a>
  <a href="#" class="youtube"><i class="fa fa-youtube"></i></a>
</div>
  <?php
}

Best regards

[nabeel]

Hi Kosta,

Thank you for reaching out to us. As you need to add the HTML code inside the body, you should use x_after_site_begin action, so you can replace your code with the following code:

function my_custom_body_output() {
  ?>

<!-- The social media icon bar -->
<div class="icon-bar">
  <a href="#" class="facebook"><i class="fa fa-facebook"></i></a>
  <a href="#" class="twitter"><i class="fa fa-twitter"></i></a>
  <a href="#" class="google"><i class="fa fa-google"></i></a>
  <a href="#" class="linkedin"><i class="fa fa-linkedin"></i></a>
  <a href="#" class="youtube"><i class="fa fa-youtube"></i></a>
</div>
  <?php
}
add_action( 'x_after_site_begin', 'my_custom_body_output', 99999 );

To learn more abour actions, filters and hooks please see https://theme.co/docs/actions-filters-and-hooks

Please note that the code provided above serves as a guide only and is to help you in getting started so implementing it and maintaining the code will be out of our support scope and for further maintenance for new possible versions of the theme that may cause the customization to break, you will need to hire a developer.

Hope this helps!