Mixing
Add a Spotify link in an HTML form
It's pretty easy to copy a Spotify song URL and generate the required iframe code to paste into your own HTML code, e.g:
<iframe src="https://open.spotify.com/embed/track/1q8gelFgFYUwoWpQV7WNCe" width="300" height="380" frameborder="0" allowtransparency="true" allow="encrypted-media"></iframe>
just for others' reference, details of how to do this can be found at https://developer.spotify.com/documentation/widgets/generate/play-button/
However, the question I have is about allowing a user to paste this same code into an HTML form, to allow it to show on a user's profile page. The only ways I can think of doing this currently are either:
Use an tag and ask the user to first remove the and " from the link before pasting (e.g. https://open.spotify.com/embed/track/1q8gelFgFYUwoWpQV7WNCe" width="300" height="380" frameborder="0" allowtransparency="true" allow="encrypted-media). Then, using the pasted text as a variable between tags. This method is not preferred as requires action from the user.
Allow the user to paste the entire link, then use a function to remove the /", before following the same approach of using the code as a variable.
Is there a more straightforward approach I am missing here? Is there a way the entire <iframe> code can be pasted into a form to directly appear on the user's profile?
Thanks in advance for any assistance.
javascript html forms iframe
asked Jan 1 at 10:05
MartinMartin
103
add a comment |
It's pretty easy to copy a Spotify song URL and generate the required iframe code to paste into your own HTML code, e.g:
<iframe src="https://open.spotify.com/embed/track/1q8gelFgFYUwoWpQV7WNCe" width="300" height="380" frameborder="0" allowtransparency="true" allow="encrypted-media"></iframe>
just for others' reference, details of how to do this can be found at https://developer.spotify.com/documentation/widgets/generate/play-button/
However, the question I have is about allowing a user to paste this same code into an HTML form, to allow it to show on a user's profile page. The only ways I can think of doing this currently are either:
Use an tag and ask the user to first remove the and " from the link before pasting (e.g. https://open.spotify.com/embed/track/1q8gelFgFYUwoWpQV7WNCe" width="300" height="380" frameborder="0" allowtransparency="true" allow="encrypted-media). Then, using the pasted text as a variable between tags. This method is not preferred as requires action from the user.
Allow the user to paste the entire link, then use a function to remove the /", before following the same approach of using the code as a variable.
Is there a more straightforward approach I am missing here? Is there a way the entire <iframe> code can be pasted into a form to directly appear on the user's profile?
Thanks in advance for any assistance.
javascript html forms iframe
asked Jan 1 at 10:05
MartinMartin
103
add a comment |
It's pretty easy to copy a Spotify song URL and generate the required iframe code to paste into your own HTML code, e.g:
<iframe src="https://open.spotify.com/embed/track/1q8gelFgFYUwoWpQV7WNCe" width="300" height="380" frameborder="0" allowtransparency="true" allow="encrypted-media"></iframe>
just for others' reference, details of how to do this can be found at https://developer.spotify.com/documentation/widgets/generate/play-button/
However, the question I have is about allowing a user to paste this same code into an HTML form, to allow it to show on a user's profile page. The only ways I can think of doing this currently are either:
Use an tag and ask the user to first remove the and " from the link before pasting (e.g. https://open.spotify.com/embed/track/1q8gelFgFYUwoWpQV7WNCe" width="300" height="380" frameborder="0" allowtransparency="true" allow="encrypted-media). Then, using the pasted text as a variable between tags. This method is not preferred as requires action from the user.
Allow the user to paste the entire link, then use a function to remove the /", before following the same approach of using the code as a variable.
Is there a more straightforward approach I am missing here? Is there a way the entire <iframe> code can be pasted into a form to directly appear on the user's profile?
Thanks in advance for any assistance.
javascript html forms iframe
asked Jan 1 at 10:05
MartinMartin
103
It's pretty easy to copy a Spotify song URL and generate the required iframe code to paste into your own HTML code, e.g:
<iframe src="https://open.spotify.com/embed/track/1q8gelFgFYUwoWpQV7WNCe" width="300" height="380" frameborder="0" allowtransparency="true" allow="encrypted-media"></iframe>
just for others' reference, details of how to do this can be found at https://developer.spotify.com/documentation/widgets/generate/play-button/
However, the question I have is about allowing a user to paste this same code into an HTML form, to allow it to show on a user's profile page. The only ways I can think of doing this currently are either:
Use an tag and ask the user to first remove the and " from the link before pasting (e.g. https://open.spotify.com/embed/track/1q8gelFgFYUwoWpQV7WNCe" width="300" height="380" frameborder="0" allowtransparency="true" allow="encrypted-media). Then, using the pasted text as a variable between tags. This method is not preferred as requires action from the user.
Allow the user to paste the entire link, then use a function to remove the /", before following the same approach of using the code as a variable.
Is there a more straightforward approach I am missing here? Is there a way the entire <iframe> code can be pasted into a form to directly appear on the user's profile?
Thanks in advance for any assistance.
javascript html forms iframe
javascript html forms iframe
asked Jan 1 at 10:05
MartinMartin
103
asked Jan 1 at 10:05
MartinMartin
103
edited Jan 1 at 14:03
Martin
asked Jan 1 at 10:05
MartinMartin
103
asked Jan 1 at 10:05
MartinMartin
103
asked Jan 1 at 10:05
MartinMartin
103
103
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
Better approach considering user experience would be ask user to paste spotify uri (using button "Copy Spotify URI")
After that you can format that URI using script to get this part
Then just put that formatted part here:
answered Jan 1 at 14:20
Hlib LiapotaHlib Liapota
586
Thanks for your input! That is a good suggestion as it seems that is the only element of the link that actually changes each time.
– Martin
Jan 2 at 23:39
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53994578%2fadd-a-spotify-link-in-an-html-form%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Better approach considering user experience would be ask user to paste spotify uri (using button "Copy Spotify URI")
After that you can format that URI using script to get this part
Then just put that formatted part here:
answered Jan 1 at 14:20
Hlib LiapotaHlib Liapota
586
Thanks for your input! That is a good suggestion as it seems that is the only element of the link that actually changes each time.
– Martin
Jan 2 at 23:39
add a comment |
Better approach considering user experience would be ask user to paste spotify uri (using button "Copy Spotify URI")
After that you can format that URI using script to get this part
Then just put that formatted part here:
answered Jan 1 at 14:20
Hlib LiapotaHlib Liapota
586
Thanks for your input! That is a good suggestion as it seems that is the only element of the link that actually changes each time.
– Martin
Jan 2 at 23:39
add a comment |
Better approach considering user experience would be ask user to paste spotify uri (using button "Copy Spotify URI")
After that you can format that URI using script to get this part
Then just put that formatted part here:
answered Jan 1 at 14:20
Hlib LiapotaHlib Liapota
586
Better approach considering user experience would be ask user to paste spotify uri (using button "Copy Spotify URI")
After that you can format that URI using script to get this part
Then just put that formatted part here:
answered Jan 1 at 14:20
Hlib LiapotaHlib Liapota
586
answered Jan 1 at 14:20
Hlib LiapotaHlib Liapota
586
answered Jan 1 at 14:20
Hlib LiapotaHlib Liapota
586
answered Jan 1 at 14:20
Hlib LiapotaHlib Liapota
586
586
Thanks for your input! That is a good suggestion as it seems that is the only element of the link that actually changes each time.
– Martin
Jan 2 at 23:39
add a comment |
Thanks for your input! That is a good suggestion as it seems that is the only element of the link that actually changes each time.
– Martin
Jan 2 at 23:39
Thanks for your input! That is a good suggestion as it seems that is the only element of the link that actually changes each time.
– Martin
Jan 2 at 23:39
Thanks for your input! That is a good suggestion as it seems that is the only element of the link that actually changes each time.
– Martin
Jan 2 at 23:39
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53994578%2fadd-a-spotify-link-in-an-html-form%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
