Help > Layout & Coding Help > Post Reply     

Select Menus

Player Avatar
уαмαѕαωкι
December 23rd, 2019 3:40:22pm
3,521 Posts

Hi everyone! 


I know with the switch around with the html purifier a lot of stuff changed. Are we not able to make select menus anymore? I've tried all the variations I could think of and I can't get the html to work.




dogs-cats.gif

 


View Comments 1


Player Avatar
↬ JADE 🖤 shake those stars from your hair, pretty moonchild
December 25th, 2019 12:21:41am
3,847 Posts

Do you mean like a clickable menu that shows multiple options in a dropdown list? I don't see the select tag as something that is whitelisted so it will probably not work in the purifier's current version. I'm assuming this was due to its use in form tags which are blacklisted. Since the select tag can be used independently of forms though, Sam might be able to get it added if she feels like it's safe to do so. I personally don't see a way that this particular tag could be abused, but I defer to the staff to make this determination.

Hopefully you get an official answer soon! Bumping for you!




z0dfAZ.gif

 

Player Avatar
Master Administrator Samantha - see page to know who to contact directly!
December 25th, 2019 11:32:38am
4,333 Posts

We don't have select tags enabled because the purifer is set to disallow the elements of a form because they can be used maliciously. To allow those drop downs we would need to do select and option tags, and off the top of my head I can't think of a way those alone could be abused, but I'll need to look into it further.




 

Player Avatar
уαмαѕαωкι
December 25th, 2019 6:09:51pm
3,521 Posts

No worries! I was just wondering because I wanted to make a point chart without taking up a lot of space (:




dogs-cats.gif

 

Player Avatar
mango 🍑 stay your pretty eyes on course
December 26th, 2019 7:30:38pm
2,926 Posts

So I was bored and decided to code an alternative to the select tag ^^ It's just fancy divs and works as well as a faux element can (demo here). You can copy the code from there, or from here:

HTML: Here
CSS: Here

I wouldn't recommend editing the css unless you're very comfortable with it and know what each element is doing. I didn't add any styling aside from background color, font color, and border color, so everything in the CSS is required for the faux-select to work. You can add stuff and adjust stuff, but you shouln't take any stuff out :P

The default appearance is white background with black border and black text. The first bold element goes around the first line and will be the color of your layout's bold text (it also has the arrow). You can then add bold elements, italic elements, anything else afterwards and the styles from your layout should apply like normal.

It "expands" on hover, so no clicking to make it work, and it's removed from the flow of the page so it won't shift your layout content when you hover over it.

The only thing that's possibly problematic is that it has to display as a block element, so you can't fit it into a paragraph like you could a select. The purifier will end your paragraph element and push the faux-select to a new line, and then whatever comes after is pushed to a new line by the faux-select itself. But that's really just a cosmetic thing; it works very nicely overall.

Enjoy! 




QAPPE3E.png

 

Player Avatar
Tifi - Cocker
December 26th, 2019 7:36:56pm
996 Posts

You are a legend mango. I will def use this, thanks




 

Player Avatar
Administrator 🐈~Broken Vow~🎄
December 26th, 2019 10:34:46pm
8,713 Posts

Mango to the rescue! :D < 3




pjd1sOi.png uoRNx1M.png BGYKLiO.png

 

Player Avatar
уαмαѕαωкι
December 30th, 2019 11:38:01am
3,521 Posts

Thanks mango! I'm super comfortable messing with CSS (been doing that like 10 years or so now :D) but the html stuff through this purifier is a mess haha! Can't wait for the time to mess around with what you've come up with


dogs-cats.gif

 

Player Avatar
Master Administrator Samantha - see page to know who to contact directly!
December 30th, 2019 11:58:59am
4,333 Posts

Yay! Thank you, Mango :).




 

View Comments 1