We're Moving to a New Support Platform – Starting June 1st!
We’re excited to let you know that starting June 1st, we’ll be transitioning to a new support system that will be available directly on our product websites – Amelia, wpDataTables, and Report Builder. In fact, the new support platform is already live for Amelia and wpDataTables, and we encourage you to reach out to us there.
You'll always be able to reach us through a widget in the bottom right corner of each website, where you can ask questions, report issues, or simply get assistance.
While we still do not offer live support, a new advanced, AI-powered assistant, trained on our documentation, use cases, and real conversations with our team, is there to help with basic to intermediate questions in no time.
We're doing our best to make this transition smooth and hassle-free. After June 1st, this current support website will redirect you to the new "Contact Us" pages on our product sites.
Thanks for your continued support and trust – we’re excited to bring you an even better support experience!
I'm trying to style buttons inside my table. I'm referring to a column that has urls that are displaying as buttons.
I already tried using the "Button Color in Modals", but it didn't affect the styling.
I've tried using the custom CSS in the column settings, but I'm really getting stuck. I'm somewhat novice at CSS, so maybe I'm missing something really obvious.
I tried using the class .wpdt-c button, which changes all the buttons inside of WP Data Tables (not good!). I also tried .wpdt-c html input[type="button"], which didn't work. I tried creating my own class in the WP Data Tables settings using
<style>
.my-button
{
blahblah
}
</style>
This also didn't work.
I would also love the CSS for hovering over the button.
Please help! Thank you!
Hello Jodi
Thank you for your purchase.
Have you added a custom class in the column settings?
If you add a class name, like this, then you can go to main settings of wpDataTables/Custom JS and CSS/Custom CSS field, and style it there, like:
.test { border: none; color: white; background-color: wheat; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; width: 120px; }And the buttons would look like this:
You can also add the hover styling to this CSS.
Kind Regards,
Aleksandar Vuković
[email protected]
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables
This was SO helpful and SO easy. Thank you!
Would you mind giving me a screen shot of how I would add hover CSS for the text styling example you gave? THANKS!
When I had tried my own CSS (I had tried it with and without <style> in the custom CSS) the problem was that I had a period in the class in the table. In your example you wrote "test". I was doing all the same steps but instead had ".test" so it didn't work! So simple. Grr.
I figured out how to do the hover. Thanks again!
I use this online CSS generator and it works just fine with wpdatatables -
https://www.bestcssbuttongenerator.com/
Thanks for sharing that Srinath
I'm sure everyone will have use of that
Kind Regards,
Aleksandar Vuković
[email protected]
Rate my support
wpDataTables: FAQ | Facebook | Twitter | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia demo sites | Docs | Discord Community
You can try wpDataTables add-ons before purchasing on these sandbox sites:
Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables