Social Apps Campaign Customization

Personalize your campaigns with custom CSS! Easily edit the look of our 28+ social campaign options to suit your brand aesthetic. Social campaign CSS can be edited from the Campaign Setup under 'Additional Settings'. Here are some examples of simple changes to get you started.


Container Background Colour

Example: Changes Campaign container background to grey

.standalone-content {
    background-color: #E7E7E7;
}
                    

Button Colour

Any buttons shown in an app, such as voting apps, can be styled. Remember to include a hover state when styling buttons.

Example: Changes default button background to purple and text to white

.btn-default {
    color: #FFFFFF;
    background-color: #8229A5;
    border-color: #000000;
}

.btn-default:hover {
    background-color: #63207E;
}
                    

Voting Containers

For voting apps, the default gray boxes that contain the item name and number of votes can be styled.

Example: Changes to name area to light blue and the voting area to green

.photopoll-view {
    background-color: lightblue;
}

.photopoll-vote {
    background-color: green;
}
                    

Javascript Events

Campaigns fire custom javascript events at certain points during fan interaction, use jQuery to listen in on those events.

Events:
tbits.load

Triggers when the entry forms or options are loaded.


tbits.selectOption

Triggers when the fan selects an option.


tbits.submit

Triggers when the fan submits their entry form.


tbits.submitSuccess

Triggers when the ajax call to submit the form succeeds.

Example: Listen in on when the fan selects an option or submits their form


$(document).on('tbits.selectOption', function(){
    alert('User selected an option')
});

                
Please contact us and we'll be happy to help you to customize your Social Apps.