Deviant Login Shop  Join deviantART for FREE Take the Tour
×



Details

Submitted on
January 6, 2012
File Size
7.1 KB
Link
Thumb

Stats

Views
43,903 (10 today)
Favourites
1,645 (who?)
Comments
365
Downloads
64
×


If you are still uncertain about the steps, scroll down to the author description below to see the link of the video tutorial on how to embed the music/video player on your profile.



Video embedding.



TL;DR: Instructions simplified

Edit: You no longer have to be a Beta Tester in order to use the above code, nor a premium member. Anyone can embed a video onto their profile.


:bulletred:Copy Youtube code.

Use this code for custom boxes. You can change the width and height yourself: (You need to be a premium member to use custom boxes.)

<div class="video"><da:embed profile="youtube" id="YOUR VID-ID GOES HERE" width="500" height="284"></div>

Use this code for journals:

<div class="video"><da:embed profile="youtube" id="yzC4hFK5P3g"></div>

You can substitute "youtube" with "film" or "vimeo" in order to embed dA films or vimeo videos. Simply find the video ID for the video you want that corresponds.

:bulletred:Paste code into Custom Box.

:bulletred:Find video on Youtube.

:bulletred:Look at video's URL in the URL bar above or click on Share.

:bulletred:Find video's ID exactly where it says it should be in instructions.

If link looks like this:

URL ~ youtube.com/watch?feature=player_embedded&v=yzC4hFK5P3g
URL ~ youtube.com/watch?v=yzC4hFK5P3g
Share ~ youtu.be/yzC4hFK5P3g

In which case this video's ID is yzC4hFK5P3g.

:bulletred:Copy ID.

:bulletred:Paste ID in between quotation marks in the code as shown above.
Not the entire link. Just the ID.

It should look like the following (no, the ID does not require being bold and don't forget to paste in BETWEEN the quotation marks):

<div class="video"><da:embed profile="youtube" id="yzC4hFK5P3g" width="500" height="284"></div>
Do not delete the quotation marks. You put the ID in between the quotation marks.


:bulletred:Click on Save. Enjoy video.

:bulletpurple:If you want to put a Youtube video as your journal's header, use the Youtube Journal CSS journal skin.

:bulletpurple:Install the skin and when you edit or create a new journal entry, click on Edit Skin and you will find the same code in the header section of the journal's CSS. Follow instructions as above to continue.

Before you ask, I repeat the quotation mark thing because people keep forgetting that the quotation marks are important and the code won't work without them.

Mini music player embedding



If you are seeing "Please enable Flash Player" :star:

Only premium users can use the compact code as far as I am currently aware. It will not work for none premium users and will usually either only show you the original size video or give you an error message "Please enable Flash".



It has come to my attention that embedding a mini music player is also possible, though the player will only play one song at a time and will not autoplay. The code works exactly like the above code as in that you copy and paste it where you want to feature a song (custom box, journal header/body/footer). You find the song on Youtube and grab the vid ID just like the instructions above and paste it where it tells you to add the vid ID in the code.

Transparent:



<div class="ppp"><div class="pagination f sitback-container talk-post cc-userdetails popup2-clear" id="headMast"><img width="300" height="24" src="http://fc06.deviantart.net/fs71/f/2012/153/f/0/enable_flash_plz_by_fli_c-d51zq3w.png"><div class="sitback-slide flex-bottom popup2-clear"><da:embed width="544" height="340" profile="youtube" id="YOUR VID ID GOES HERE"></div>

This will give you the mini player without any background color or boarder.

Color:



However, if you want to add color around your player, you can do this too.

<div class="thumb-holder"><div class="smbutton smbutton-COLOR smbutton-small smbutton-curvy"><div class="pp"><div class="pagination f sitback-container talk-post cc-userdetails popup2-clear" id="headMast"><img width="300" height="24" src="http://fc06.deviantart.net/fs71/f/2012/153/f/0/enable_flash_plz_by_fli_c-d51zq3w.png">
<da:embed width="544" height="340" profile="youtube" id="YOUR VID ID GOES HERE">
</div>

In the "COLOR" spot, you may add one of the following: normal, blue, deepgreen, white, red, purple, green.

I am certain there are other color/customization possibilities, so for those who are familiar with code, feel free to experiment. If you discover anything worthwhile and would like to share, send me a PM with the code so I can post it here.

Note: Just like the video embed, you can embed more than one music player at a time as well. You can stack them.
Updated! Fixed the CSS.

Just a quick tutorial on how to embed a video on your profile.

VIDEO TUTORIAL

Add a Comment:
 
:iconsharkoy:
Thank you so much for this! Loud MusicNow I know how to add a video to my journal!!
Reply
:iconevodeus:
EvoDeus Apr 1, 2014  Hobbyist General Artist
This guide was very helpful after a friend told me about this new feature, which led me to find out more. Thanks for that.
Reply
:iconkaenali:
kaenali Mar 31, 2014  Hobbyist Digital Artist
I'm seeing "Please Enable Flash Player" but I'm a Premium Member... Halp?
Reply
:icontwilightjoy:
Twilightjoy Apr 3, 2014  Hobbyist General Artist
I use this: <da:embed profile="youtube" id="ID NUMBER GOES HERE" width="180" height="30">
It makes it a bit smaller but it doesnt say "Please Enable Flash Player". If you want it to look a bit more prettier on your profile you can use < div align="center"> and just erease the spaces.
Reply
:iconkaenali:
kaenali Apr 3, 2014  Hobbyist Digital Artist
Thanks!
Reply
:icontwilightjoy:
Twilightjoy Apr 3, 2014  Hobbyist General Artist
You're Welcome! ^^

i know more codes if ya need em
Reply
:iconkaenali:
kaenali Apr 4, 2014  Hobbyist Digital Artist
XD It depends~ I figured out most of them, I believe, but I have a question... Is it possible to embed a full picture into a custom box, like a journal doll or something like that, besides using the thumb (that shrinks it)? I tried using the embed code but it didn't work D:

thankyousomuch
Reply
:icontwilightjoy:
Twilightjoy Apr 4, 2014  Hobbyist General Artist
<img src="IMAGE URL HERE" width="NUMBER GOES HERE" height="NUMBER GOES HERE" align="POSITION GORS HERE">
Reply
:iconkaenali:
kaenali Apr 4, 2014  Hobbyist Digital Artist
Okay... I think I got it... Thanks c:
Reply
:icontwilightjoy:
Twilightjoy Apr 4, 2014  Hobbyist General Artist
No problem! And if you need the font codes...

<font face="FONT NAME GOES HERE"> <font size="NUMBER GOES HERE">


I have no idea how I know all this
Reply
(1 Reply)
Add a Comment: