Edit CSS Colors

From Offerit
Jump to: navigation, search
Offerit
For Affiliates
Automatic SubIDs
Affiliate Stats Dumps
Linkcode
Link Groups
Affiliate Custom Pixels
Affiliate Host and Post
Offerit Affiliate Area
Affiliate Account Details
Affiliate Account Change Log
Affiliate Creatives
Affiliate Creatives Search
Affiliate Settings
Affiliate Custom Pixels
Affiliate Linkcodes
Affiliate Linkcode Settings
Affiliate Login History
Affiliate Messages
Affiliate Dashboard
Dashboard Key Statistics
Dashboard Statistics Summary
Affiliate Payment History
Quick Links
Affiliate Referrals Report
Affiliate Referring URL Report
Affiliate Remote Login
Affiliate Signup
Affiliate Statistic Filters
Affiliate Statistic Views
Affiliate SubIDs
Offerit Setup
Creating Admin Accounts
Tracking Domain
Edit Affiliate Text
Edit CSS Colors
Getting Started Admin
Offerit Quick-Start Guide
Tracking in Offerit
Pixel Builder
Offerit Postback Examples
Replacement Variables
Currency Exchange Rates

Admin Dashboard
The Admin Dashboard
Reporting Admin
The Reporting Admin
Track and Strack
  Report Breakdowns
Profit and Loss Report
Subscription Report
Transactions Reports
Affiliate Ratios Report
Affiliate Managers Report
Visitor Actions Report
Referral Tier Payouts Report
Referral Signup Payouts Report
Additional Commissions Report
Graphical Affiliate Comparison Report
The Single Day Comparison Report
Actual Affiliate Payments Report
Offers Admin
The Offers Admin
Offers
Offer Setup
Affiliate Referrals
Tracking Domain
Commissions
Commission Changes
Suppression Lists
Pixel Builder
ID Numbers
Offer Partner
Offer/Landing Page Redirection
Setting Rules
Admin Host and Post
Offer Post URLs
Offer Goals
Affiliates Admin
The Affiliates Admin
ID Numbers
Affiliate Managers
Affiliate Referrals
Affiliate Activation
Admin-Only Settings
Affiliate Overrides
Creating Admin Accounts
In-House Accounts
Add Manual Sale
Manual Invoice
Affiliate Documents
Affiliate Enabled Offers
Change Affiliate Status
Account Changes
Advertisers Admin
The Advertisers Admin
Account Changes
Advertiser Invoices
Generate Invoice
Advertiser Approval
Change Advertiser Status
Customers Admin
Customers Admin
Manually Adding a Customer
ID Numbers
Payments Admin
The Payments Admin
Payvia Types
Payout Periods
Payvia Dump Formats
Payment Dump Entry Numbers
Payment Dump Variables
Check Functions
Setting Rules
Payment Methods
Payza
Creatives Admin
The Creatives Admin
Add New Creatives
Add New Creative Type
Offeritcode
Code Builder
Track and Strack
Setting Rules
  Default Creative Types
Creative Types
Image Banners
Flash Banners
Dynamic Text Banners
Feeds
Mailers
Video Download
Video Embed
Page Peels
IM Popups
Footer Ads
Page Ads
Overlays
Communications Admin
The Communications Admin
Add News Item
Sending Messages
Signup Questions
Configuration Admin
The Configuration Admin
Affiliate Signup Postback URL
Edit Affiliate Text
Edit CSS Colors
REST API
General
Offerit REST API Overview
GET /service/ping
PATCH /service/set_currency_exchange_rates
Advertiser
PATCH /advertiser/edit_advertiser
POST /advertiser/add_advertiser
Affiliate
GET /affiliate/get_links
GET /affiliate/get_single_link
GET /affiliate/search
GET /affiliate/decode_trackingcode
PATCH /affiliate/edit_affiliate
PATCH /affiliate/payvia
POST /affiliate/add_affiliate
POST /affiliate/affiliate_login_ips
Creative
GET /creative/get_creatives
GET /creative/get_creative_fields
GET /creative/get_creative_rules
PATCH /creative/delete_creative
PATCH /creative/edit_creative
PATCH /creative/edit_creative_rules
PATCH /creative/undelete_creative
POST /creative/add_creative
POST /creative/add_creative_rule
POST /creative/delete_creative_rules
Customer
PATCH /customer/set_customer_details
PATCH /customer/lock
PATCH /customer/unlock
PATCH /customer/forget
GET /customer/export
Offer
GET /offer/get_conversion_caps
GET /offer/check_orderid_exists
GET /offer/get_commission_changes
PATCH /offer/activate_offer
PATCH /offer/edit_landing_page
PATCH /offer/edit_offer
PATCH /offer/pause_offer
PATCH /offer/set_commission_change_payouts
PATCH /offer/set_enabled_affiliates
PATCH /offer/set_offer_categories
PATCH /offer/set_offer_countries
PATCH /offer/set_offer_goals
PATCH /offer/set_offer_groups
PATCH /offer/set_offer_marketing_types
PATCH /offer/store_offer_ips
POST /offer/add_commission_change
POST /offer/add_landing_page
POST /offer/add_offer
POST /offer/add_tracking_domain
Reporting
GET /report/profitloss
GET /report/transaction
Transaction
GET /transaction/transaction_payout_preview
PATCH /transaction/transaction_update_revenue_by_orderid
PATCH /transaction/transaction_update_revenue_by_transaction_hash
POST /transaction/process_void
POST /transaction/process_chargeback
POST /transaction/process_reversal
POST /transaction/approve_pending_transaction
GET /transaction/click_detail
SOAP API (*deprecated*)
API
Add Affiliate
Add Affiliate Sale
Add Offer
Approve Transaction
Creative Types
Decode Offeritcode
Deny Transaction
Disable Affiliate Landing Page
Edit Affiliate Sale
Enable Affiliate Landing Page
Get Affiliate Stats
Get Allowed Affiliates
Get Landing Page Details
Get Offer Details
Get Offer List
Get Profit Loss Report
List Affiliate Details
List Affiliate Subaffiliates
Ping
Set Affiliate Status
Set SubAffiliate Status
Set Member Details
Record Affiliate Click
Misc.
Rules
Freeform Date
Affiliate Custom Signup
Offeritcode
Tracking in Offerit
Offerit Logos
Void Conversions Remotely

With the CSS color editor, you can change the look and feel of the affiliate side of your network. There are an endless number of colors available for you to customize, and to view them all, click "Show Advanced Settings". You can also upload your logo, which affiliates will see in the top left hand corner of every page.

AdminTabCSS.png


Customizing CSS Colors

We have picked out the ten most prominent colors for you to customize. After you have changed a color, you will notice blue arrow icons appear next to that color. With this icon, you can revert your changes back to the default color.

Edit CSS Colors.png

Primary Color

Changes the main admin tabs.

Primary Color.png

Primary Accent Light

Changes the tab description color.

PrimaryAccentLight.png

Primary Accent Dark

Changes the drop down menu highlighting.

Primary Accent Dark.png

Primary Accent Darker

Changes the highlighted links color.

Primary Accent Darker.png

Secondary Color

Changes the highlighted link color of bubbled text.

Secondary Color.png


Secondary Color2.png

Secondary Accent Light

Changes the color of the large tooltips, when the black question mark is moused over.

Secondary Accent Light.png

Secondary Accent Dark

Changes the borders around the help boxes and tooltips.

Secondary Accent Dark.png

Body Background

Changes the entire background color.

Body Background.png

Content Header Bar Background

Changes the main header color of all modules.

Content Header Bar Background.png

Content Box Background

Changes the module background color.

Content Box Background.png


Here you can view an example of a custom skin design.

Header Logo Upload

Not only can you alter the color theme of your affiliate skins in Offerit, you can also easily upload a new Header Logo to be used on your affiliate pages. If your desired logo image is hosted remotely, just copy and paste the URL where your image is stored. If you need to upload your desired image to the Offerit server, click the "Choose File" button to select an image to be uploaded from your hard drive. Regarding the size of your new logo, an image sized 300-350px x 100px will work best. Your new Header Logo then will be displayed on every affiliate page once you save your CSS settings.

YourLogoHere.png

Body Background Image

The Body Background Image allows you to upload or insert a background image to be used on all of the affiliate pages in Offerit. Although the other settings on this page (colors and header logo) are required, this setting is optional, as you do not need to use a body background image on any of your affiliate pages. Uploading a Body Background Image is similar to uploading a Header Logo - If your desired body background image is hosted remotely, just copy and paste the URL where your image is stored. If you need to upload your desired image to the Offerit server, click the "Choose File" button to select an image to be uploaded from your hard drive.

Once you save your CSS settings, your new Body Background Image will be displayed in the background of the body text for every affiliate page in that skin.

Favicon Icon

Favicons made easy! A favicon, or "Favorite Icon," is a small icon that represents your Network. The favicon can appear directly in front of your website url in your browser's address bar, in the tab before the page title, or both. The visitor's browser determines where exactly the favicon images will appear. Favicons are useful not only for consistent branding, but for users who have multiple tabs open within a browser. Your favicon image is a quick tell to which tab your Network is in.

Favicons in Chrome

Don't have your own favicon yet? There are lots of free favicon generators on the web you can use to make an icon or just test ideas. But don't worry, Offerit already has the Offerit logo set as a favicon by default, and it is only optional to add your own.

The ideal size for your favicon image is 16x16 pixels. While Offerit will resize any image to 16x16px, the aspect ratio is not preserved. Also, resizing tends to make the favicon look less crisp. For example:

Favicons in Firefox

The +P icon was 16x16 pixels, while the +$ icon was resized.

Saving Your Skin

Not only can you edit any of the colors and images that are used in your affiliate skins, you can save your custom CSS color schemes with the "Create New Theme" section on the CSS Colors page. To begin creating your new theme, set all of the colors and images that you want to save, using the instructions provided above. Once you've chosen the colors and images that you want to save to your new theme, locate the "Create New Theme" section on the top-right of the page. Fill in the name you want to use for your new CSS Theme in the "Theme Title" field here, and click Save. Your new theme will now be saved for easy use on your Offerit install.

Applying Your CSS Themes

Choose the CSS Theme you want to apply to your skin with the "Reset to Theme" drop-down menu at the top-left of this page. Once you've chosen your desired CSS Theme, click Save to apply your theme's CSS color settings and logos to your chosen skin.