I don't know if this is a bug or because I've done something wrong.
In my install, I changed the Gender option from a dropdown menu to a text box where members can type in their selection.
If left blank in the user's settings, the Gender field does not appear on their Profile page. So far, so good. But, if you enter something into the text field, the Gender field will then appear on the Profile page (good!) but whatever was entered in the text box does not show (bad!).
You have to tell it....
by default it only shows the icon -- and if you add more than male/female, you would have to create icons for those and add css references
.main_icons.gender_None::before {
background: none;
}
.main_icons.gender_0::before {
display: none;
}
...
.main_icons.gender_2::before {
background-position: -135px -5px;
}
...
.main_icons.gender_1::before {
background-position: -57px -31px;
}
also, the default only shows an icon, not the description
e.g. <span class=" generic_icons gender_{INPUT}" title="{INPUT}"></span>
You need to check 'Show on Topic View' option in 'Edit profie field' page in admin panel.
Thanks!
Quote from: Speed King on March 18, 2021, 12:50:13 PM
You need to check 'Show on Topic View' option in 'Edit profie field' page in admin panel.
That's just for showing it on posts though, isn't it? I don't have that checked because I only want it to show on the user's profile if they want to use it.
Quote from: Kindred on March 18, 2021, 12:48:24 PM
also, the default only shows an icon, not the description
e.g. <span class=" generic_icons gender_{INPUT}" title="{INPUT}"></span>
Ah. Got it.
This:
<span class=" main_icons gender_{KEY}" title="{INPUT}"></span>was in the "Show Enclosed Within Text (Optional):" text box. I deleted that and now the entered gender shows up.
Thanks!
or, if you want to add icons AND text --
change the text to this....
span class="generic_icons gender_{INPUT}" title="{INPUT}">{INPUT}</span>
/* Gender Icons */
.generic_icons::before {
content: '';
width: 16px;
height: 16px;
display: inline-block;
vertical-align: middle;
}
.generic_icons.gender_None::before {
background: none;
}
.generic_icons.gender_0::before {
display: none;
}
.generic_icons.gender_Male::before {
background: #f7f7f7 url(../images/gendericons/gen_male.png) no-repeat 0 0 / 17px;
}
.generic_icons.gender_Female::before {
background: #f7f7f7 url(../images/gendericons/gen_female.png) no-repeat 0 0 / 17px;
}
.generic_icons.gender_Bigender::before {
background: #f7f7f7 url(../images/gendericons/gen_bigender.png) no-repeat 0 0 / 17px;
}
.generic_icons.gender_Neutrois::before {
background: #f7f7f7 url(../images/gendericons/gen_neutrois.png) no-repeat 0 0 / 17px;
}
.generic_icons.gender_Agender::before {
background: #f7f7f7 url(../images/gendericons/gen_agender.png) no-repeat 0 0 / 17px;
}
.generic_icons.gender_Androgyne::before {
background: #f7f7f7 url(../images/gendericons/gen_androgyne.png) no-repeat 0 0 / 17px;
}
.generic_icons.gender_Demiboy::before {
background: #f7f7f7 url(../images/gendericons/gen_demiboy.png) no-repeat 0 0 / 17px;
}
.generic_icons.gender_Demigirl::before {
background: #f7f7f7 url(../images/gendericons/gen_demigirl.png) no-repeat 0 0 / 17px;
}
.generic_icons.gender_Intergender::before {
background: #f7f7f7 url(../images/gendericons/gen_intergender.png) no-repeat 0 0 / 17px;
}
.generic_icons.gender_Genderqueer::before {
background: #f7f7f7 url(../images/gendericons/gen_genderqueer.png) no-repeat 0 0 / 17px;
}
.generic_icons.gender_Thirdgender::before {
background: #f7f7f7 url(../images/gendericons/gen_thirdgender.png) no-repeat 0 0 / 17px;
}
.generic_icons.gender_Epicene::before {
background: #f7f7f7 url(../images/gendericons/gen_epicene.png) no-repeat 0 0 / 17px;
}
.generic_icons.gender_Polygender::before {
background: #f7f7f7 url(../images/gendericons/gen_polygender.png) no-repeat 0 0 / 17px;
}
.generic_icons.gender_Transgender::before {
background: #f7f7f7 url(../images/gendericons/gen_transgender.png) no-repeat 0 0 / 17px;
}
.generic_icons.gender_Femme::before {
background: #f7f7f7 url(../images/gendericons/gen_femme.png) no-repeat 0 0 / 17px;
}
Create a new directory in Themes/YOURTHEME/images called gendericons
Upload the contents of the attached ZIP to the directory
example at
https://test2.turtleshellprod.com/index.php?topic=4.0
--- the attached zip of icons has black png icons 24x24. You could edit them in something like GIMP to change the color of the icon to suit your theme.