CSS

[anyunk]

How can I customize form CSS? e.g. I want to put the field title beside the box not on top. Give me some example please.

[Khaled]

For now, User Meta support Title Position as ‘Top’ and ‘Hidden’. ‘Left’ and ‘Right’ position will implement soon.

However, you can write your own css with any field, and also can assign css class to any field by ‘CSS Class’ and ‘CSS Style’ from User Meta >> Fields Editor.

By default pf_label class are assigned with every label(title of field). If you wish to change look and feel for label, you can add bellow code to your style.css file or /user-meta/assets/css/user-meta.css

.um_field_container .pf_label {
display: inline;
/* write your own css here */
}

[kimtanasichuk]

Can you also document how to change the look and feel of the form controls as well please.
If I add a textbox field with the class “input-box”, how do I reference the class and where is it stored so I can add my own CSS?

Thanks very much.

[Khaled]

You can write that class definition in your style.css file under theme directory.

Thanks.

[kimtanasichuk]

For example, When I inspect the html generated by User Meta, one of the input controls has the following code:

input type='text' name="first_name" value='Kim' id='um_field_8' class='um_input validate[required]'

How do I modify the css associated with this input box? I want to control the css for form controls depending on the data. For example, a phone number only needs to be 50 px wide, but I want textareas to be 400px wide.

I tried adding

.um_field_container custom-profile-input {
font-size:140%;
}

to my style.css but nothing happened.

Thanks,

• This reply was modified 11 years, 8 months ago by kimtanasichuk.

[Khaled]

Lets, have a new css class named custom_phone in your style.css
.custom_phone{
width:50px;
}

Then go to User Meta >> Fields Editor and locate that filed which you need to apply this class.
put custom_phone in field, titled: “CSS Class”,

[robansell]

Hi There

I would like to know what to change in the wp-content/plugins/user-meta/assets/css/user-meta.css to make all the title fields to be on the left for all fields, irrespective of what is chosen when setting up the field, and also to have the entry box for the field set in a position 400px from the left WP Margin (not from the last letter of the title field. This is so that I can get all the entry boxes in a neat line down the page, irrespective of where the end of the field title is.

I am not a style sheet whiz, so would appreciate if you could give me the exact code to find, and what to replace it with.

Thank-you.
Rob

[robansell]

Waiting for a reply to previous query!!! Please, it is urgent…

[robansell]

Still waiting ……!!!!!!!

[ecreative]

Hi,

Just asking for best solution, what will I need to do when I have the Registration form at the leftside and the rightside is the contents section?

Any best solution for that?

Regards,
Archie

• This reply was modified 11 years, 7 months ago by ecreative.

[kentropolis]

Over and over, everyone refers to this thread but it does NOT lay out plainly how to use the controls in the User Meta Fields Editor.

I tried every possible combination of syntax I could think of and I can’t get a simple inline display.

[Support]

Hello,
With version 1.1.3rc2, you can indicate label position as “inline” from User Meta >> Fields Editor. And theere is a filter hook: “user_meta_field_config”

Action and Filter Hooks

By using this filter hook, you can customize field’s settings/

Thanks.

[Author]

Posts