customize the affiliate account

Hey @happysusan,

In this area of the plugin, the pro one does not offer any additional functionality.

Even so, you can apply CSS rules on all elements without classes. For example, to change the background of the Visits card, you can use this code:

.slicewp-grid-affiliate-dashboard-last-30-days > div:first-of-type { background: red; }

For outputting affiliate stats, we currently don’t have any shortcodes. I have added this request to our development list for future research.

Even so, you can customize the affiliate dashboard to your needs via your own template file. Here’s how:

• Copy the file templates/affiliate-area/affiliate-account-tab-dashboard.php file from the plugin’s root folder.
• Paste the file into yourtheme/slicewp/affiliate-area/affiliate-account-tab-dashboard.php.
• Modify the file to your liking and save it.

You can do this with all the template files from templates/affiliate-area/, to customize everything as you wish to.

Also, if you have ideas on how we can improve the plugin, we’re happy to listen. Just send us your thoughts here: https://slicewp.com/suggest-feature/

Thank you and best wishes,

Mihai

Hi, thanks this works.

1. The text above works, but it only changes the background of 1 of the boxes.
   There are 9 boxes on the screen with white text on white background.
   Only 1 can be read using the code you gave above.

2. Any messages shown by the plugin e.g.
“You are not enrolled in our affiliate program. Please fill out the form below to apply.”
are white text on a very pale yellow background so are impossible to read.

How can this be fixed?

Thanks in advance

Hey @clifford19,

The code above was designed for the particular scenario that @happysusan asked about, which was to style the “visits” card of the dashboard tab.

To change the styling for all cards, please use this code (adapted to your needs):

.slicewp-grid-affiliate-dashboard .slicewp-card-affiliate-dashboard { background: red; }

Also, to style the notifications messages shown in the affiliate account, please use this code:

.slicewp-user-notice.slicewp-error { background: #ffebeb !important; border-color: #dc3232 !important; color: #000 !important; }
.slicewp-user-notice.slicewp-warning { background: #fff7ea !important; border-color: #f39c12 !important; color: #000 !important; }
.slicewp-user-notice.slicewp-updated { background: #e0ffe3 !important; border-color: #46b450 !important; color: #000 !important; }

The code above will style all types of user notices (errors, warnings and successes). Please adapt the colors to your needs.

Thank you and best wishes,

Mihai

Thanks very much for that.
I made a workaround for the cards:

.slicewp-grid-affiliate-dashboard-last-30-days > div:first-of-type { background: black; }

.slicewp-grid-affiliate-dashboard-last-30-days > div:nth-of-type(even) { background: black; }

.slicewp-grid-affiliate-dashboard-last-30-days > div:nth-of-type(odd) { background: black; }

.slicewp-grid-affiliate-dashboard-all-time > div:nth-of-type(even) { background: black; }

.slicewp-grid-affiliate-dashboard-all-time > div:nth-of-type(odd) { background: black; }

.slicewp-grid-affiliate-dashboard-program-details > div:nth-of-type(odd) { background: black; }

.slicewp-grid-affiliate-dashboard-program-details > div:nth-of-type(even) { background: black; }

However, I’ve used your code as I think it’s more efficient.

Regarding the code you gave for the notifications messages, it works perfectly.

Thanks very much.

PS. I don’t know much about CSS, I just play around with it until it appears the way I want it. You can see it on my site here: https://hexucation.com .
Go into Accounts > Affiliate Account.

• This reply was modified 1 year, 10 months ago by clifford19.