Following on from yesterdays post, I have created a partial with the share buttons like so: It encodes the url with the php urlencode function and links to the social media giants share pages. This converts

https://allotmentandy.github.io/blog/2022-04-12-Adding-share-buttons-for-twitter-facebook-and-linkedin/

into

https%3A%2F%2Fallotmentandy.github.io%2Fblog%2F2022-04-12-Adding-share-buttons-for-twitter-facebook-and-linkedin%2F

<div class='flex items-center justify-center gap-4'>
    <div class="p-4">
    <?php
    $shareURL = urlencode(url()->current());
    ?>
    Share this page on:

    <a href="https://www.facebook.com/sharer/sharer.php?u=<?php echo $shareURL; ?>" target="_blank" class="bg-blue-100 rounded p-4 m-2 border-1 border-black rounded-full  hover:bg-indigo-200 hover:text-black">
    <img class="inline" width=25 src="/images/facebook.svg"> Facebook</a>

    <a href="https://twitter.com/intent/tweet?text=my share text&amp;url=<?php echo $shareURL; ?>"  target="_blank"  class="bg-blue-100 rounded p-4 m-2 border-1 border-black rounded-full  hover:bg-indigo-200 hover:text-black">
    <img class="inline" width=25 src="/images/twitter.svg"> Twitter</a>

    <a href="http://www.linkedin.com/shareArticle?mini=true&amp;url=<?php echo $shareURL; ?>" target="_blank" class="bg-blue-100 rounded p-4 m-2 border-1 border-black rounded-full  hover:bg-indigo-200  hover:text-black" >
    <img class="inline" width=25 src="/images/linkedin.svg"> LinkedIn </a>

  </div>
</div>

This is what it looks like (adapted slightly for this blog)

Share this page on: Facebook Twitter LinkedIn

I need to publish it to test it out, now, fingers crossed

If you would like to contact me with this form on londinium.com, ilminster.net or via Twitter @andylondon