Skip Navigation

[Resolved] Styling Drop Down CRED Forms

This support ticket is created 5 years, 5 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Karachi (GMT+05:00)

This topic contains 1 reply, has 2 voices.

Last updated by Waqar 5 years, 5 months ago.

Assisted by: Waqar.

Author
Posts
#1294343
Screen Shot 2019-07-18 at 1.12.40 AM.png

Tell us what you are trying to do?
I'd like to style to look of the drop down fields in a Views form I've created.

Is there any documentation that you are following?
I looked at the Styling Cred Forms documentation, but had a hard time actually styling the dropdown. I'd like to change the blue to a pink and if possible style the dropdown arrows. Ideally, each dropdown could have its own highlight color.

Is there a similar example that we can see?
I am attaching a link to the client's "dream version", we agreed adding a simple brand color would be enough

What is the link to your site?
hidden link

#1294547

Hi Lilian,

Thank you for contacting us and I'd be happy to assist.

By default, the Toolset Views plugin shows the select drop-down fields with only default styles, which may slightly vary, based on different devices and browsers, being used.

It is possible to show them in a different design, with the help of custom CSS code. To check which CSS code is applying to different page elements and experiment with your own custom CSS, you can use Google Chrome's inspect element tool, as explained in this guide:
hidden link

We also have a guide on working with custom CSS code at:
https://toolset.com/documentation/user-guides/adding-custom-css-views/

Here are some useful resources with good examples of code, related to select field styles:

hidden link
hidden link

I hope this helps and for more personalized assistance around custom code, you can consider hiring a professional from our list of recommended contractors:
https://toolset.com/contractors/

regards,
Waqar