this works using android and apple phone and most tablets, Ubunto and windows desktops ,Also works using firefox, chrome,edge and opera browsers demo is on https://www.mypoppy.uk/blog/
first find and edit the file /fp-interface/themes/YOUR THEME/static.tpl and find this line
{/static}
paste the following code below it then save the file back to your server
Code: Select all
<input type="button" value="Share this page" class="the-share-button" onclick="shareTheLink()" />
<script {literal}src="https://unpkg.com/share-api-polyfill/dist/share-min.js">">{/literal}</script>
<!-- <script src="../dist/share-min.js"></script> -->
<script>{literal}
function shareTheLink () {
navigator.share({
title: 'view this post',
text: 'I thought you might like this.',
url: location.href,
fbId: '',
hashtags: ['javascript', 'shareAPI']
},
{
// change this configurations to hide specific unnecessary icons
copy: true,
email: true,
print: true,
sms: true,
messenger: true,
facebook: true,
whatsapp: true,
twitter: true,
linkedin: true,
telegram: true,
skype: true,
language: 'en-gb'
})
.then( _ => console.log('Yay, you shared it :)'))
.catch( error => console.log('Oh noh! You couldn\'t share it! :\'(\n', error));
}{/literal}
</script>
</div>
To add webshare API to all your posts your must edit the file /fp-interface/themes/YOUR THEME/entry-default.tpl
find the line
<p class="postmetadata">{if ($categories)} Published by {$author} in {$categories|@filed}|{/if} <a href="{$id|link:comments_link}#comments">{$comments|tag:comments_number}</a> </p>
and paste the following code below it
Code: Select all
<input type="button" value="Share this page" class="the-share-button" onclick="shareTheLink()" />
<script {literal}src="https://unpkg.com/share-api-polyfill/dist/share-min.js">">{/literal}</script>
<!-- <script src="../dist/share-min.js"></script> -->
<script>{literal}
function shareTheLink () {
navigator.share({
title: 'view this post',
text: 'I thought you might like this.',
url: location.href,
fbId: '',
hashtags: ['javascript', 'shareAPI']
},
{
// change this configurations to hide specific unnecessary icons
copy: true,
email: true,
print: true,
sms: true,
messenger: true,
facebook: true,
whatsapp: true,
twitter: true,
linkedin: true,
telegram: true,
skype: true,
language: 'en-gb'
})
.then( _ => console.log('Yay, you shared it :)'))
.catch( error => console.log('Oh noh! You couldn\'t share it! :\'(\n', error));
}{/literal}
</script>
</div>
now all your posts will have a webshareAPI button