how do I change the css of the affiliates page using short codes

I have just purchased Affiliates and done the set up. I have created a page for affiliates to register and login. It is ugly! The yellow box that contains the affiliate's information is not attractive and looks really old fashioned - I have a clean and modern site. Also I want to change the wording of "affiliate" to referral. Also the text in part of it is all squashed together and in another area widely spaced out. I aim for a professional looking site and need to be able to change these things. Can you advise how to do this. Thanks

  • Jack Kitterhing

    Hi there @Robyn,

    Thanks for the link, I created a account and took a look, you can use the following to change the css, just change the color codes etc where needed :slight_smile:

    #affiliateuserdetails {
    	background-color: #FFFFFF;
    }
    
    #affiliateuserdetails div.formholder {
        background-color: #FFFEEB;
        border: 1px solid #E6DB55;
        margin-left: auto;
        margin-right: auto;
        padding: 10px;
    }
    
    #clickstable table {
        border: 1px solid #0C53F8;
    }
    #clickstable table.widefat thead tr {
        background-color: #78ACFA;
        color: #000000;
    }
    #clickstable table.widefat thead th {
        border-top: 1px solid #0C53F8;
    }
    #clickstable table.widefat tfoot tr {
        background-color: #78ACFA;
        color: #000000;
    }
    #clickstable table tr td {
        border-bottom: 1px solid #0C53F8;
        border-top: 1px solid #0C53F8;
    }
    #visitstable {
    }
    #visitstable table {
        border: 1px solid #0C53F8;
    }
    #visitstable table.widefat thead tr {
        background-color: #78ACFA;
        color: #000000;
    }
    #visitstable table.widefat thead th {
        border-top: 1px solid #0C53F8;
        color: #000000;
    }
    #visitstable table.widefat tfoot tr {
        background-color: #78ACFA;
        color: #000000;
    }
    #visitstable table tr td {
        border-bottom: 1px solid #0C53F8;
        border-top: 1px solid #0C53F8;
    }
    #topvisitstable {
    }
    #topvisitstable table {
        border: 1px solid #0C53F8;
    }
    #topvisitstable table.widefat thead tr {
        background-color: #78ACFA;
        color: #000000;
    }
    #topvisitstable table.widefat thead th {
        border-top: 1px solid #0C53F8;
    }
    #topvisitstable table.widefat tfoot tr {
        background-color: #78ACFA;
        color: #000000;
    }
    #topvisitstable table tr td {
        border-bottom: 1px solid #0C53F8;
        border-top: 1px solid #0C53F8;
    }
    div.affiliateloginmessage {
    }
    #affiliateuserdetails div.formholder {
        background-color: #FFFEEB;
        border: 1px solid #E6DB55;
        margin-left: auto;
        margin-right: auto;
        padding: 10px;
    }
    #affiliateuserdetails div.innerbox.closed {
        display: none;
        width: 100%;
    }

    Thanks!

    Kind Regards
    Jack.

  • Jack Kitterhing

    Hi there @Robyn,

    Hope you're well today, for the text change you can create a locale of the plugin language files, for example British English rather than American English (WordPress default), You can do that using Poeditor, http://codex.wordpress.org/Translating_WordPress#About_Locales

    Or you could try a text change plugin such as http://wordpress.org/plugins/text-replace/

    For the line spacing you can use the following :slight_smile:

    #affiliateuserdetails {
        line-height: 1.7em;
    }

    For the stats, currently the best way would be to hide the stats you don't want using the following css.

    tr#period-1.periods {
    	display: none;
    }

    You'll want to remove up to number 12 I believe, so you'd use the same and follow that on like

    tr#period-2.periods {
    	display: none;
    }
    
    tr#period-3.periods {
    	display: none;
    }

    Etc :slight_smile:

    Thanks!

    Kind Regards
    Jack.

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.