• Welcome to ForumKorner!
    Join today and become a part of the community.

Change CKEditor Colors to Match Style (for 4.1.4 and above)

vBulletin-Bot

Member
Reputation
0
Add this code to your additional.css template to match the colors of the editor to the style you are using:

/* Background Color for CKEditor */
.cke_skin_kama .cke_wrapper {
background:{vb:stylevar postbithead_background} !important;
}

/* Background Color for CKEditor Buttons (Note, this may be too dark for some styles. If so you can delete this one.) */
.cke_skin_kama .cke_toolgroup {
background: {vb:stylevar postbit_foot_background} !important;
}

/* Background Color for CKEditor Hover Link*/
.cke_skin_kama a:hover {
background: {vb:stylevar control_content_hover_background} !important;
}

The additional.css template can be found here:

Admin CP -> Style Manager -> Edit Templates -> CSS Templates -> additional.css


Note: If you want to change these to your own custom colors, then use this code instead:

/* Background Color for CKEditor */
.cke_skin_kama .cke_wrapper {
background-color: #xxxxxx !important;
}

/* Background Color for CKEditor Buttons */
.cke_skin_kama .cke_toolgroup {
background-color: #xxxxxx !important;
}

/* Background Color for CKEditor Hover Link*/
.cke_skin_kama a:hover {
background-color: #xxxxxx !important;
}

...with xxxxxx being the hexcode of the color you wish to use.

Posted on Sat, 06 Aug 2011 00:31:31 GMT at https://www.vbulletin.com/forum/ent...r-Colors-to-Match-Style-(for-4.1.4-and-above)
 

vBulletin-Bot

Member
Reputation
0
Add this code to your additional.css template to match the colors of the editor to the style you are using:

/* Background Color for CKEditor */
.cke_skin_kama .cke_wrapper {
background:{vb:stylevar postbithead_background} !important;
}

/* Background Color for CKEditor Buttons (Note, this may be too dark for some styles. If so you can delete this one.) */
.cke_skin_kama .cke_toolgroup {
background: {vb:stylevar postbit_foot_background} !important;
}

/* Background Color for CKEditor Hover Link*/
.cke_skin_kama a:hover {
background: {vb:stylevar control_content_hover_background} !important;
}

The additional.css template can be found here:

Admin CP -> Style Manager -> Edit Templates -> CSS Templates -> additional.css


Note: If you want to change these to your own custom colors, then use this code instead:

/* Background Color for CKEditor */
.cke_skin_kama .cke_wrapper {
background-color: #xxxxxx !important;
}

/* Background Color for CKEditor Buttons */
.cke_skin_kama .cke_toolgroup {
background-color: #xxxxxx !important;
}

/* Background Color for CKEditor Hover Link*/
.cke_skin_kama a:hover {
background-color: #xxxxxx !important;
}

...with xxxxxx being the hexcode of the color you wish to use.

Posted on Sat, 06 Aug 2011 00:31:31 GMT at https://www.vbulletin.com/forum/ent...r-Colors-to-Match-Style-(for-4.1.4-and-above)
 
Top