facebook share widget issue with dynamic pages

Hi all,

I am wanting to add a facebook like and share buttons widget to my pages.  The required code provided by facebook is

<div id="fb-root"></div>
 
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v3.2"></script>
<div class="fb-like" data-href="https://bridlington.net" data-layout="button" data-action="like" data-size="large" data-show-faces="true" data-share="true"></div>

The above code works fine however and produces the link

https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fbridlington.net%2F&display=popup&ref=plugin&src=like&kid_directed_site=0

I would like to add this code to dynamically created pages which would mean that data-href value needs to be a variable containing the page url.

I assumed that replacing the static url with

<?php echo urlencode(thisPageUrl()) ?>

would do the trick but when the share button is pressed having replaced the static url with the above code I get a 404 error and the link produced looks like this

https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fbridlington.net%2Fhttps%253A%252F%252Fbridlington.net%252Findex.php&display=popup&ref=plugin&src=like&kid_directed_site=0

It looks like the domain value is being screwed up but I cannot understand why as using the same urlencode code to create a direct link in the "tell a friend" email facility works fine. If I just use the code to display the value on a page it displays the URL as

https%3A%2F%2Fbridlington.net%2Findex.php

and is not displaying the url values of : and / which I am assuming is the issue

Does anyone know how I can generate a variable I can use that will produce the url in a way that it will display with the : and // instead of %3A and %2F to work with the facebook code.

Thanks in advance for any help provided.