PDA

View Full Version : Profile Fields & CSS


grey_goose
01-06-2013, 03:25 PM
I'd like to have a profile field that lets users change the color that another field is displayed in. This is what I'm currently using:

<vb:if condition="$post['field101'] == 'A'">
<font color="green" size="2">
<vb:else /><vb:if condition="$post['field101'] == 'B'">
<font color="#26466D" size="2">
<vb:else /><vb:if condition="$post['field101'] == 'C'">
<font color="#2F4F4F" size="2">
<vb:else /><vb:if condition="$post['field101'] == 'D'">
<font color="royalblue" size="2">
<vb:else /><vb:if condition="$post['field101'] == 'E'">
<font color="purple" size="2">
<vb:else /><vb:if condition="$post['field101'] == 'F'">
<font color="#7A7ACC" size="2">
<vb:else /><vb:if condition="$post['field101'] == 'G'">
<font color="red" size="2">
<vb:else /><vb:if condition="$post['field101'] == 'H'">
<font color="brown" size="2">
<vb:else />
<font size="2">
</vb:if></vb:if></vb:if></vb:if></vb:if></vb:if></vb:if></vb:if>{vb:raw post.field14}</font>

That seems like a ton of conditionals, and it would be more elegant to have multiple CSS classes:

.Adisplay { color: green; }
.Bdisplay { color: #26466D; }

..etc...

Then use:

<span class="{vb:raw bbuserinfo.field101}display">{vb:raw post.field14}</span>

However, this doesn't work -- I'm guessing it's because the CSS is rendered before the custom profile fields are read?

Is there a way to do this, or a more elegant way to do what I'm doing?

kh99
01-06-2013, 05:33 PM
I think that should work. You're using $bbuserinfo in the class attribute above - is that what you meant? You used $post in the if/else statements above that. Of course you could use either depending on whether you want the post author's choice to show for everyone or if each user gets to choose what they see.

Where are you putting your CSS? Did you look at the page source to see if the class name is showing up like you'd expect?

grey_goose
01-06-2013, 07:13 PM
Neither 'post' or 'bbuserinfo' works -- If I look at the source, the class is simply "display" rather than "Adisplay" or "Bdisplay"...

kh99
01-06-2013, 07:34 PM
And you're saying that the if/else statements worked? It seems like if that was working, then class="{vb:raw post.field101}display" should work (assuming it's in the same template).

grey_goose
01-07-2013, 02:04 AM
Yep the conditionals work, the classes do not -- which makes me think that the profile fields are being read after the css.

Lynne
01-07-2013, 05:21 PM
Can you post exactly what you have done - what templates you modified and exactly how and any plugin code you've written.

grey_goose
01-07-2013, 11:13 PM
Hi Lynne,

The above code is in my postbit_legacy to display a custom user profile field, and a second user profile field selects the display color. Rather than evaluating each color with conditionals, I was wanting to use the profile field to call different css classes -- which seems more efficient than daisy-chaining conditionals in every post.

I haven't done any plugins at all -- just that code in the postbit_legacy.

Lynne
01-08-2013, 02:05 AM
Can we get a screenshot of profile field 101 and 14 in the admincp (with the options) and a link to a thread and can you post 5 lines in the template directly above where you added the code please?

Also, you realize vb4 has elseif? Here's an example from the manual:
<vb:if condition="$my_variable == 1">
<p>My variable is equal to one.</p>
<vb:elseif condition="$my_variable == 2" />
<p>My variable is equal to two.</p>
<vb:else />
<p>My variable is equal to neither one nor two.</p>
</vb:if>

grey_goose
01-08-2013, 06:21 PM
I'm a moron.

This works, I just had a syntax error in my class names :/

I've reduced all those conditionals down to:

<span class="fontsizesmall {vb:raw post.field101}color">{vb:raw post.field14}</span>


...and it works beautifully. Sorry, and thanks for the willingness to help!

p.s. Thanks for the elseif tip! Didn't know that was new :)