We're just moving over to the new events list & booking form (not yet live) and I notice that although the event list items are color coded as before the "read more" button is set to just one color. Previously the event color translated to the read more button as well and looked much better (see attached screenshots of old & new lists).
Is it possible to have a dynamic color for the read more button?
The color of the "read more" button can be customized via CSS to match the dynamic color of the event items. If you'd like, we can help you with the necessary CSS adjustments.
Let me know if you'd like assistance with this, and we'll guide you through it!
Please try the following CSS for this purpose: #amelia-container > div > div.am-els__wrapper > div:nth-child(3) > div.am-ec__actions > p > button{ background-color: var(--am-c-ec-success) !important }
This snippet targets the 3rd event in any list - so it's not picking up the event color of the event in the list, just changing the 3rd event in any list. See attached for what I mean.
Our yoga classes have an event color of orange and our meditation classes have an event color of green. I would like the button & price to use the event color. This is how the old list used to work.
The color should be dynamic depending on the event color selected when setting up the event. Hope I make sense!
Unfortunately, there is no built-in option to dynamically change the button and price color based on the event color selected in Amelia. The styling needs to be manually adjusted using custom CSS.
You can update your CSS to target specific event types by using unique class selectors or IDs assigned to each event. If you're unsure how to do this, I recommend working with a developer who can inspect the elements and apply the appropriate styles based on the event colors you have set.
Hello,
We're just moving over to the new events list & booking form (not yet live) and I notice that although the event list items are color coded as before the "read more" button is set to just one color. Previously the event color translated to the read more button as well and looked much better (see attached screenshots of old & new lists).
Is it possible to have a dynamic color for the read more button?
Attached files: eventslist-old.png
eventslist-new.png
Hello Miriam,
Thank you for reaching out!
The color of the "read more" button can be customized via CSS to match the dynamic color of the event items. If you'd like, we can help you with the necessary CSS adjustments.
Let me know if you'd like assistance with this, and we'll guide you through it!
Kind Regards,
Uros Jovanovic
[email protected]
Rate my support
Try our FREE mapping plugin! MapSVG - easy Google maps, interactive SVG maps, and floor plans, choropleth maps and much more - https://wordpress.org/plugins/mapsvg-lite-interactive-vector-maps/
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
Yes please, a css snippet would be most useful.
Hello Miram,
Please try the following CSS for this purpose:
#amelia-container > div > div.am-els__wrapper > div:nth-child(3) > div.am-ec__actions > p > button{
background-color: var(--am-c-ec-success) !important
}
Let me know if that works for you.
Kind Regards,
Uros Jovanovic
[email protected]
Rate my support
Try our FREE mapping plugin! MapSVG - easy Google maps, interactive SVG maps, and floor plans, choropleth maps and much more - https://wordpress.org/plugins/mapsvg-lite-interactive-vector-maps/
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 snippet targets the 3rd event in any list - so it's not picking up the event color of the event in the list, just changing the 3rd event in any list. See attached for what I mean.
Our yoga classes have an event color of orange and our meditation classes have an event color of green. I would like the button & price to use the event color. This is how the old list used to work.
The color should be dynamic depending on the event color selected when setting up the event.
Hope I make sense!
Attached files: Christine-Leedy-Dru-Yoga-in-Middelburg-Test-amelia-20-03-2025_19_16.png
Hello Miriam,
Unfortunately, there is no built-in option to dynamically change the button and price color based on the event color selected in Amelia. The styling needs to be manually adjusted using custom CSS.
You can update your CSS to target specific event types by using unique class selectors or IDs assigned to each event. If you're unsure how to do this, I recommend working with a developer who can inspect the elements and apply the appropriate styles based on the event colors you have set.
Let me know if you need any further guidance.
Kind Regards,
Uros Jovanovic
[email protected]
Rate my support
Try our FREE mapping plugin! MapSVG - easy Google maps, interactive SVG maps, and floor plans, choropleth maps and much more - https://wordpress.org/plugins/mapsvg-lite-interactive-vector-maps/
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