Php variable in meta tag

Asked

Viewed 231 times

0

The thing is, I have an audio player on Html5 and javascript, when I try to share a song on the face for example, the post does not go with the title of the audio, but only with the title of the page, my question is how can I do so that when sharing is shown also the name of the audio being shared.

I tried using a variable that takes the name of the running song, but the "og" tag does not recognize html:

<?php $description = '<span class="center" id="npTitle"></span>';?>

I tried to call her that:

<meta property="og:description" content="<?php echo $description;?>" />

But it doesn’t work, any suggestions, is it possible to solve without having to reformulate the whole player? Thank you!

My player: http://leituracrista.com/audioplayer/player.php?ip=hinosSalmosCanticos#0

php javascript html5

  • The question is: why are you trying to put an HTML code inside the tag? It should not only receive the text referring to the variable $description?

  • Hello @Andersoncarloswoss, thank you for asking, is because this description text is dynamic and changes according to the url, is an audio player on Html5, so when you click to share it should take the value of the tag Description, which changes according to the audio that’s playing. If you want to take a look, anyway thank you & #Xa; http://leituracrista.com/audioplayer/player.html?ip=hinosSalmosCanticos#0

1 answer

1


Look, from what I’ve seen you want to share the songs by the site’s own buttons, apparently this is going to be an Android app made in HTML5, it’s not necessary to follow the Title or Description, can make it possible for Javascript variables that define a variable in the URL and for PHP to start with the music pointed by this.

I didn’t scan your HTML code to see how it’s actually done, but I’ll make a simple example of how I would do it.

<!DOCTYPE html>
<html>
<head>
<style>
.playlist{
    display:block;
    width:100%;
    text-align:center;
    background-color: blue;
}
audio{
    display:block;
    width:32px;
    height:32px;
    background-color: grey;
}
</style>
<script>
<?php
if(isset($_GET['ip']) && !empty($_GET['ip'])){
    echo "var ip = '".$_GET['ip']."';\n"; //Pegar nome da playlist
    if(isset($_GET['tck']) && !empty($_GET['tck'])){
        echo "var tck = ".$_GET['tck'].";\n";
    }else{
        echo "var tck = 1;\n";
    }
?>
function playAudio(tgt){
    tck = tgt; //Alterar variavel Global para compartilhamento
    var tracks = document.getElementsByTagName('audio');
    for(t=0;t<tracks.length;t++){
        tracks[t].pause();
        tracks[t].currentTime = 0;
        tracks[t].style.backgroundColor = "grey";
    }
    tracks[tgt-1].play();
    tracks[tgt-1].style.backgroundColor = "yellow";
}

function shareTrack(s){
    var url = "http://www.meusite.com/player/?ip="+ip+"&tck="+tck;
    alert("\nCompartilhando no "+s+" o link\n\n"+url);
}
</script>
</head>
<body onload="playAudio(tck)">
<a class="playlist" href="#" id="1" onclick="playAudio(this.id)"><audio src="http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_(1).ogg"></audio>Audio 1</a>
<br />
<a class="playlist" href="#" id="2" onclick="playAudio(this.id)"><audio src="http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_(1).ogg"></audio>Audio 2</a>
<br />
<a class="playlist" href="#" id="3" onclick="playAudio(this.id)"><audio src="http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_(1).ogg"></audio>Audio 3</a>
<br />
<a class="playlist" href="#" id="4" onclick="playAudio(this.id)"><audio src="http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_(1).ogg"></audio>Audio 4</a>
[<a onclick="shareTrack(this.innerHTML)">Facebook</a>][<a onclick="shareTrack(this.innerHTML)">Whatsapp</a>]
<?php
}else{
?>
</script>
</heead>
<body>
<a href="?ip=playlist1">Playlist1</a><br />
<a href="?ip=playlist2">Playlist2</a><br />
<a href="?ip=playlist3">Playlist3</a><br />
<?php }?>
</body>
</html>

  • I’ll test it here, thank you!

  • Sorry, I misspelled one of the variables. Fix, please check.

  • In this format it works, but when I use it like this: <span class="center" id="npTitle"></span> does not work, but anyway thank you.

  • Could clearly explain the use of an html tag within the attribute of another?

  • The use is for sharing via facebook and Whatsapp I have an audio player and a face button for sharing, it seems that the face does not allow use of dynamic tag. follows the link to the audio player in javascript and Html5 When clicking the share button the description tag should contain the name of the audio being shared, but it is not working http://leituracrista.com/audioplayer/player.html?ip=3minMateus#0

  • But these social networks don’t interpret these tags even if you encode them with encodeURIComponent

  • In that case I no longer know what to do, Thank you Rpgboss

  • @Miguelsilva makes no sense to add HTML in Opengraph tags (og), tools like facebook and Whatsapp (which use opengraph) will not recognize HTML.

  • @Guilherme Nascimento would export the style of the page to social networks. But in Whatsapp the only way would be using their default formatting. I’ll put in the answer so he can see.

  • @Rpgboss this I believe to be for text messages, Opengraph is neither text nor message, Opengraph is used to feed "Bots" and the like, Whatsapp and Facebook (unshared) will generate the box, but will not format with neither HTML nor markdown (text, ~text~, etc.). Details of what is Opengraph at: http://ogp.me and https://developers.facebook.com/docs/sharing/opengraph

  • @I don’t think I’ve been able to make myself clear in what I intend to do, I’m sorry. Here’s the thing, I have an audio player on Html5 and javascript, when I try to share a song on the face for example, the post does not go with the title of the audio, but only with the title of the page, my question is how can I do so that when sharing is shown also the name of the audio being shared. Anyway thank you very much for your comment. Follow my player page: http://leituracrista.com/audioplayer/player.html?ip=hinosSalmosCanticos#0

  • @Miguelsilva edits the question please, as the HTML span part there is unrelated to the current doubt.

  • @Guilhermenascimento edited, could check if it is clear?

  • Look, I’m really having a hard time understanding what he wants, even if it’s redacted. I will edit the answer once again showing how to put the song name in the title dynamically with PHP through # or ?.

  • @Rpgboss that’s right, your answer is on the right track, I just couldn’t make your code work: here it is online: http://leituracrista.com/audioplayer/test/

  • Did you remember to put the ? and the variables? I edited the code for more clarity.

  • No need to use isset together with Empty, Empty is language constructor, just like isset, you can dry the code a little.

  • @Rpgboss now gone, the variables were missing, now I will try to adapt to my player, break a little the head, if I get put here the results. Thank you very much.

Show 13 more comments

Browser other questions tagged php javascript html5

You are not signed in. Login or sign up in order to post.