❤ [2014] The Profile Help Thread [Post Any Issues!] ❤

[xtars]

Is it possible to add a loopable motion video as a background?

[Fredy-san]

xtars

Is it possible to add a loopable motion video as a background?

If it is a direct swf flash then yes it is possible. Just set into a media panel then throw the media panel as your page background by using fixed position and negative z-index. Note that you also have to set the page background to none transparent in most cases.

Make sure the flash itself has a keyframe / function to loop back after it finishes.

However if you asked about video which embedded on a player (ie: Youtube) then you also have to set the loop parameter which does not always available in all media provider. But big media provider like Youtube and such should have the loop function on their embed player.

example code for theme override
====

.media_panel object {
position:fixed;
left:0px;
top:0px;
height:100%;
width:100%;
z-index:-9999;
}

html, body {
background:none transparent;
}

====

Notes for v1 Classic profile:
There is an issue with the multimedia section on the Classic profile. Since Gaia does not set the wmode on Classic. Then z-index (and few other properties) can not be used thus the flash will always placed on most top above everything else. Practically making the media as background is not viable / possible option since it will overlaps everything above it.

[ll akuma ll]

'ello, I was wondering if someone could help with my profile.

I'm not that extremely great with coding and this is my first time making a profile like this one. Usually I can end up making something that looks good on my computer screen and browser (I'm using Chrome). However, I know not everyone has the same screen resolution and uses the same browser and things just vary....so I'm sure my profile looks a bit off to the rest of you.

Here's how my profile looks to me if it helps at all. || Click Click

Any help would be most appreciated

[Veravore]

ll akuma ll

'ello, I was wondering if someone could help with my profile.

I'm not that extremely great with coding and this is my first time making a profile like this one. Usually I can end up making something that looks good on my computer screen and browser (I'm using Chrome). However, I know not everyone has the same screen resolution and uses the same browser and things just vary....so I'm sure my profile looks a bit off to the rest of you.

Here's how my profile looks to me if it helps at all. || Click Click

Any help would be most appreciated

This is how it looks for me, I think you did pretty swell. 3nodding
Profile Screenshot
Mind you; the screen I'm currently using (one of many) is very small, its like a 12-inch. xD
Anyways, my screen-resolution is only 1366x768.

[ll akuma ll]

Veravore

ll akuma ll

'ello, I was wondering if someone could help with my profile.

I'm not that extremely great with coding and this is my first time making a profile like this one. Usually I can end up making something that looks good on my computer screen and browser (I'm using Chrome). However, I know not everyone has the same screen resolution and uses the same browser and things just vary....so I'm sure my profile looks a bit off to the rest of you.

Here's how my profile looks to me if it helps at all. || Click Click

Any help would be most appreciated

This is how it looks for me, I think you did pretty swell. 3nodding
Profile Screenshot
Mind you; the screen I'm currently using (one of many) is very small, its like a 12-inch. xD
Anyways, my screen-resolution is only 1366x768.

So other than the scroll bar it looks okay? Only reason I was looking into it was because I asked me friend to look at it and the column was pushed up far enough to block the text.

[Veravore]

ll akuma ll

Veravore

ll akuma ll

'ello, I was wondering if someone could help with my profile.

I'm not that extremely great with coding and this is my first time making a profile like this one. Usually I can end up making something that looks good on my computer screen and browser (I'm using Chrome). However, I know not everyone has the same screen resolution and uses the same browser and things just vary....so I'm sure my profile looks a bit off to the rest of you.

Here's how my profile looks to me if it helps at all. || Click Click

Any help would be most appreciated

This is how it looks for me, I think you did pretty swell. 3nodding
Profile Screenshot
Mind you; the screen I'm currently using (one of many) is very small, its like a 12-inch. xD
Anyways, my screen-resolution is only 1366x768.

So other than the scroll bar it looks okay? Only reason I was looking into it was because I asked me friend to look at it and the column was pushed up far enough to block the text.

Yeah pretty much.

#column_2{
width: 325px;
margin-left: 380px;
height: 400px;
overflow-y: scroll;
padding-right: 25px;
}

#columns{
position: absolute;
margin-top: -15px;
}

Messing with the margin-left, and width and what not I think is what you'd want to do.
You could try like.. width: auto; but, I'm not too positive on how to optimize the sizing for most resolutions.
If nothing I've said works, someone more experienced will help. 3nodding

[Lady Saxophone]

▧▧▧ ♬ ▧▧▧

ll akuma ll

Another thing to mention regarding your background image --
background-position: center left;
You might want to change that to "top" instead, since the vertical "center" of the page varies depending on how high your screen is, which is probably what your friends were talking about with the column being up too high. Meanwhile, the top and left sides of the page are the same for everyone, so it's easier to base your calculations off of them.

And then in order to re-adjust your columns (in case they get misaligned) :
#columns{
position: absolute;
margin-top: -15px; /*You can just use "top: ##px" instead... margin isn't necessarily needed */
}

▧▧▧▧▧▧▧

[ll akuma ll]

Lady Saxophone

I'm not 100% show, but I think it works now. Thanks o much. ^_^

[Fredy-san]

ll akuma ll

Lady Saxophone

I'm not 100% show, but I think it works now. Thanks o much. ^_^

Something to fix up your profile
http://pastebin.com/bgvdpWVh

[ll akuma ll]

Fredy-san

ll akuma ll

Lady Saxophone

I'm not 100% show, but I think it works now. Thanks o much. ^_^

Something to fix up your profile
http://pastebin.com/bgvdpWVh

I need to come to this thread more often....
Thanks. ^-^;;;;

(well..hope not to make a habit of it, but still extremely helpful)

[Vallyyn]

Hello I was wondering if someone can help me? I wanted to get into making profiles (v2) for friends and everything. How am I supposed to know what sectors, goes where. Do I just change the background and all of the sectors so that they can arrange them, themselves? Also what is the best way to make a layout. Using a PSD as a background and matching everything up. Or doing it all by coding. Also, I don't understand how does hover work. Say I want something barley visible but when you go over it with you mouse it highlights and become easier to read.

[Knight Yoshi]

Space Butterfly

Hello I was wondering if someone can help me? I wanted to get into making profiles (v2) for friends and everything. How am I supposed to know what sectors, goes where. Do I just change the background and all of the sectors so that they can arrange them, themselves? Also what is the best way to make a layout. Using a PSD as a background and matching everything up. Or doing it all by coding. Also, I don't understand how does hover work. Say I want something barley visible but when you go over it with you mouse it highlights and become easier to read.

In Firefox and Chrome, you can right click and select the Inspect Element context menu option.
You can see the panel's ID from there, custom and media panels you can just hover the panel and see it's ID in edit mode.
Code the profile. You can use an image as a concept, but the final outcome, I strongly recommend not making it background dependent for alignment and scalability reasons. Hover is simple. The static state goes into the non-hover declaration block and the properties you want to change go into the hover declaration block.

[Fredy-san]

Space Butterfly

Hello I was wondering if someone can help me? I wanted to get into making profiles (v2) for friends and everything. How am I supposed to know what sectors, goes where. Do I just change the background and all of the sectors so that they can arrange them, themselves? Also what is the best way to make a layout. Using a PSD as a background and matching everything up. Or doing it all by coding. Also, I don't understand how does hover work. Say I want something barley visible but when you go over it with you mouse it highlights and become easier to read.

Yeah as Yoshi said, the easiest one to figure it out is by using element inspector. But easy as I write it, the actual process doing it in correct way is pretty hard if you dont have the knowledge about it. Some common mistakes are due to those "Yui-gen" ID stuffs and when determining an element selector without any ID or class.

As for the best way of doing a layout, it would be by both of them. Just depends on what is your needs. If you just need creating a simple transparent background layer over a background, it is best using code to do that by utilizing RGBa. However, few tricks like multi color background is best done using graphic. Example of my work which utilize both graphics and coding layout
http://www.gaiaonline.com/profiles/29353933/

The top header utilize white border using code and at the same time created that "see-through hole" effect using image. The panels are simple stuff so I just used RGBa background code

But take my word: Codes > images

===
As for how hover function works. Basically the CSS only triggers on mouse hover an element and its child-element. Then it will return to default state on mouse-out. Be careful though, many things do not always appear as you see in your monitor.