Welcome to Gaia! ::

Just BLESSED's avatar

Blessed Girl

I was wondering what is the code used to make the media panel (white box) transparent?
reIax bear's avatar

Newb

      User Image - Blocked by "Display Image" Settings. Click to show._For a current (v2) profile, and if your talking about the panel itself, you would use:


      .media_panel{background: transparent!important;}
Knight Yoshi's avatar

Loyal Gaian

reIax bear
      User Image - Blocked by "Display Image" Settings. Click to show._For a current (v2) profile, and if your talking about the panel itself, you would use:


      .media_panel{background: transparent!important;}
"!important" is not necessary.
Just BLESSED's avatar

Blessed Girl

reIax bear
      User Image - Blocked by "Display Image" Settings. Click to show._For a current (v2) profile, and if your talking about the panel itself, you would use:


      .media_panel{background: transparent!important;}

Actually, i just want the white box disappear and leave the you tube button still there. How do I do that?
reIax bear's avatar

Newb

HoneyLovesRamen
reIax bear
      User Image - Blocked by "Display Image" Settings. Click to show._For a current (v2) profile, and if your talking about the panel itself, you would use:


      .media_panel{background: transparent!important;}

Actually, i just want the white box disappear and leave the you tube button still there. How do I do that?
      User Image - Blocked by "Display Image" Settings. Click to show._You'd use just that. o:

      .media_panel{background: transparent; }
reIax bear's avatar

Newb

Knight Yoshi
reIax bear
      User Image - Blocked by "Display Image" Settings. Click to show._For a current (v2) profile, and if your talking about the panel itself, you would use:


      .media_panel{background: transparent!important;}
"!important" is not necessary.
      User Image - Blocked by "Display Image" Settings. Click to show._The coding still works though xP
Just BLESSED's avatar

Blessed Girl

reIax bear
HoneyLovesRamen
reIax bear
      User Image - Blocked by "Display Image" Settings. Click to show._For a current (v2) profile, and if your talking about the panel itself, you would use:


      .media_panel{background: transparent!important;}

Actually, i just want the white box disappear and leave the you tube button still there. How do I do that?
      User Image - Blocked by "Display Image" Settings. Click to show._You'd use just that. o:

      .media_panel{background: transparent; }

When I used it, it made my whole profile white, especially my background Dx
reIax bear's avatar

Newb

HoneyLovesRamen
When I used it, it made my whole profile white, especially my background Dx
      User Image - Blocked by "Display Image" Settings. Click to show._What do you have used for your background coding? o_o

      Are you using this?
      body{background: url(URLHERE) }
spookchu's avatar

Obsessive Sweetheart

reIax bear
      User Image - Blocked by "Display Image" Settings. Click to show._For a current (v2) profile, and if your talking about the panel itself, you would use:


      .media_panel{background: transparent!important;}


It still shows the header title of the media when you use that code. o.o
Then if you remove the title of that panel, it just shows a rectangle above it.
-screenshot so you understand what I mean. Is there a way to get rid of the rectangle?
kittymmeow's avatar

Fashionable Fatcat

Dashiechu
reIax bear
      User Image - Blocked by "Display Image" Settings. Click to show._For a current (v2) profile, and if your talking about the panel itself, you would use:


      .media_panel{background: transparent!important;}


It still shows the header title of the media when you use that code. o.o
Then if you remove the title of that panel, it just shows a rectangle above it.
-screenshot so you understand what I mean. Is there a way to get rid of the rectangle?

Add:
.media_panel h2{
display:none;
}
spookchu's avatar

Obsessive Sweetheart

kittymmeow
Dashiechu
reIax bear
      User Image - Blocked by "Display Image" Settings. Click to show._For a current (v2) profile, and if your talking about the panel itself, you would use:


      .media_panel{background: transparent!important;}


It still shows the header title of the media when you use that code. o.o
Then if you remove the title of that panel, it just shows a rectangle above it.
-screenshot so you understand what I mean. Is there a way to get rid of the rectangle?

Add:
.media_panel h2{
display:none;
}


Thank you! c: Would you happen to know the code for coloring the play button?
Some people have it white. o.o Or placing an image on the panels?
kittymmeow's avatar

Fashionable Fatcat

Dashiechu
kittymmeow
Dashiechu
reIax bear
      User Image - Blocked by "Display Image" Settings. Click to show._For a current (v2) profile, and if your talking about the panel itself, you would use:


      .media_panel{background: transparent!important;}


It still shows the header title of the media when you use that code. o.o
Then if you remove the title of that panel, it just shows a rectangle above it.
-screenshot so you understand what I mean. Is there a way to get rid of the rectangle?

Add:
.media_panel h2{
display:none;
}


Thank you! c: Would you happen to know the code for coloring the play button?
Some people have it white. o.o Or placing an image on the panels?

They've used Google APIs' youtube player parameters. You most likely have your URL in the Google APIs version if it's working for a button, but I might as well start from just a regular video URL to minimize confusion if you plan on changing the which video it is later.

Take your original youtube URL that looks something like this
http://www.youtube.com/watch?v=VIDEO_ID
for example:
www.youtube.com/watch?v=g0XpNvLWimo


And change it to look like this (the red is the part that you change)::
http://youtube.googleapis.com/v/VIDEO_ID&version=2&color1=BORDER_COLOR&color2=MAIN_COLOR
for example:
http://youtube.googleapis.com/v/g0XpNvLWimo&version=2&color1=AAAAAA&color2=CCCCCC


Replace BORDER_COLOR and MAIN_COLOR with the hex code (#xxxxxx) of the color you want but without the #. The example I've given will be this video, with a light gray (#AAAAAA) border and an even lighter gray (#CCCCCC) background. It's a little annoying to have to keep saving it and then going to view if you want to see what it looks like, but it's a good idea because it may not turn out exactly how you expect, depending on the colors.

For placing an image in the panels... Do you mean a background image? Or what?...
spookchu's avatar

Obsessive Sweetheart

kittymmeow
Dashiechu
kittymmeow
Dashiechu
reIax bear
      User Image - Blocked by "Display Image" Settings. Click to show._For a current (v2) profile, and if your talking about the panel itself, you would use:


      .media_panel{background: transparent!important;}


It still shows the header title of the media when you use that code. o.o
Then if you remove the title of that panel, it just shows a rectangle above it.
-screenshot so you understand what I mean. Is there a way to get rid of the rectangle?

Add:
.media_panel h2{
display:none;
}


Thank you! c: Would you happen to know the code for coloring the play button?
Some people have it white. o.o Or placing an image on the panels?

They've used Google APIs' youtube player parameters. You most likely have your URL in the Google APIs version if it's working for a button, but I might as well start from just a regular video URL to minimize confusion if you plan on changing the which video it is later.

Take your original youtube URL that looks something like this
http://www.youtube.com/watch?v=VIDEO_ID
for example:
www.youtube.com/watch?v=g0XpNvLWimo


And change it to look like this (the red is the part that you change)::
http://youtube.googleapis.com/v/VIDEO_ID&version=2&color1=BORDER_COLOR&color2=MAIN_COLOR
for example:
http://youtube.googleapis.com/v/g0XpNvLWimo&version=2&color1=AAAAAA&color2=CCCCCC


Replace BORDER_COLOR and MAIN_COLOR with the hex code (#xxxxxx) of the color you want but without the #. The example I've given will be this video, with a light gray (#AAAAAA) border and an even lighter gray (#CCCCCC) background. It's a little annoying to have to keep saving it and then going to view if you want to see what it looks like, but it's a good idea because it may not turn out exactly how you expect, depending on the colors.

For placing an image in the panels... Do you mean a background image? Or what?...


I'll need to try it tomorrow since I am no longer on computer, but thank you.
And, basically, yes. Like for the panels where there is text and etc,
how do you put a background image? Say, you wanted lined paper or stripes, etc.
Not the background for your profile itself, but for all of the panels.
kittymmeow's avatar

Fashionable Fatcat

Dashiechu

I'll need to try it tomorrow since I am no longer on computer, but thank you.
And, basically, yes. Like for the panels where there is text and etc,
how do you put a background image? Say, you wanted lined paper or stripes, etc.
Not the background for your profile itself, but for all of the panels.

Ah, okay, then it's this:
.panel{
background: url('your image url') ;
}.panel is the selector for all the panels on the page, and the background property gives it a background. Just paste the URL of your image where it says your image url, making sure to keep the single quotes ( ' ' )
spookchu's avatar

Obsessive Sweetheart

kittymmeow
Dashiechu

I'll need to try it tomorrow since I am no longer on computer, but thank you.
And, basically, yes. Like for the panels where there is text and etc,
how do you put a background image? Say, you wanted lined paper or stripes, etc.
Not the background for your profile itself, but for all of the panels.

Ah, okay, then it's this:
.panel{
background: url('your image url') ;
}.panel is the selector for all the panels on the page, and the background property gives it a background. Just paste the URL of your image where it says your image url, making sure to keep the single quotes ( ' ' )

Both of the codes work, thank you. I appreciate it.
But how do you know so many codes? o: I'm quite the noob at profile coding.

Quick Reply

Submit
Manage Your Items
Other Stuff
Get GCash
Offers
Get Items
More Items
Where Everyone Hangs Out
Other Community Areas
Virtual Spaces
Fun Stuff
Gaia's Games