構造的に表示 平面上に表示 ツリー上に表示
スレッド [ 前へ | 次へ ]
toggle
body with black background makes editor in web content go black as well Sverker Abrahamsson 2010/10/17 17:18
RE: body with black background makes editor in web content go black as well Maarten van Heiningen 2010/10/21 1:15
RE: body with black background makes editor in web content go black as well Warren McCann 2010/12/06 12:10
RE: body with black background makes editor in web content go black as well Bradley Wood 2012/01/05 17:38
RE: body with black background makes editor in web content go black as well Nate Shaw 2011/02/04 9:00
RE: body with black background makes editor in web content go black as well Joshua Asbury 2011/02/04 9:36
RE: body with black background makes editor in web content go black as well Nate Shaw 2011/02/09 9:45
RE: body with black background makes editor in web content go black as well Warren McCann 2011/02/14 9:35
RE: body with black background makes editor in web content go black as well Brian Scott Schupbach 2011/02/14 14:36
RE: body with black background makes editor in web content go black as well Brian Scott Schupbach 2011/02/14 14:37
RE: body with black background makes editor in web content go black as well Warren McCann 2011/02/15 13:34
RE: body with black background makes editor in web content go black as well Maarten van Heiningen 2011/02/16 13:26
RE: body with black background makes editor in web content go black as well Warren McCann 2011/02/21 13:55
RE: body with black background makes editor in web content go black as well Jeff deVries 2011/03/11 7:27
RE: body with black background makes editor in web content go black as well Jeff deVries 2011/03/11 13:14
RE: body with black background makes editor in web content go black as well Joss Sanglier 2011/03/17 4:12
RE: body with black background makes editor in web content go black as well Suraj Bihari 2011/12/21 4:58
Sverker Abrahamsson
body with black background makes editor in web content go black as well
2010/10/17 17:18
答え

Sverker Abrahamsson

ランク: New Member

投稿: 13

参加年月日: 2008/04/03

最近の投稿

Hi,
I have a theme which extends the classic theme. I want to have a black (or dark) background, so I set body like this:

body {
color: #FFFFFF;
background-color: #000000;
font-size: 11px;
}

However, this cause the fckeditor(?) in web content to also get white text on black background and since my portlets has the oposit I would prefer if fckeditor follows that color scheme.

How can I accomplish that in my theme?
Maarten van Heiningen
RE: body with black background makes editor in web content go black as well
2010/10/21 1:15
答え

Maarten van Heiningen

ランク: Regular Member

投稿: 172

参加年月日: 2009/02/05

最近の投稿

Hi,

You need to just set your class for the body of the editor.

in your own custom.css after your body style setting you include something like this.

table.fck_editor body,
table.cke_editor body {
background-color: #ffffff;
color: #000000;
}

Regards,
Maarten
Warren McCann
RE: body with black background makes editor in web content go black as well
2010/12/06 12:10
答え

Warren McCann

ランク: Junior Member

投稿: 36

参加年月日: 2010/11/19

最近の投稿

Thanks for posting the solution.

I would argue that this is a bug; the editor colors should never be influenced by the theme/site colors.

*Update: this does not always work. I have to do a page refresh once the page is displayed for the editor background color to change with the CSS above in custom.css. Additionally, going to Control Panel -> Web Content -> Add Web Content keeps the 'grey' background as it is using the classic them.

Thoughts?
Nate Shaw
RE: body with black background makes editor in web content go black as well
2011/02/04 9:00
答え

Nate Shaw

ランク: Junior Member

投稿: 28

参加年月日: 2010/10/26

最近の投稿

This does not work for me. Nothing I have tried works. Here are some of the variations I have tried to stop the bg image from loading in the wiki editor.

table.fck_editor body,
table.cke_editor body {
background: #ffffff;
background-image: none !important;
color: #000000;
}

.cke_contents * body {
background: #ffffff;
}

.cke_contents iframe html body {
background: #ffffff;
}

The background image that is set for the main theme body is still loaded as the editor background image.

How can I fix this?
Joshua Asbury
RE: body with black background makes editor in web content go black as well
2011/02/04 9:36
答え

Joshua Asbury

LIFERAY STAFF

ランク: Expert

投稿: 497

参加年月日: 2006/09/08

最近の投稿

For Liferay 6, we use CKEditor. Inspecting the element, are you looking at:
"journal-article-component-container"?
Nate Shaw
RE: body with black background makes editor in web content go black as well
2011/02/09 9:45
答え

Nate Shaw

ランク: Junior Member

投稿: 28

参加年月日: 2010/10/26

最近の投稿

Here is the HTML, starting with the td that wraps the iframe used by the wiki editor. I was able to suppress the background image using a CSS definition of

body[class*="cke_"] {
background: #ffffff;
background-image: none !important;
}

BUT, the background image still loads first and then the background color changes to white. So, there is a 1/2 second flicker of the background image loading, which is annoying and troublesome. I have no idea how to make that flicker go away.

<td role="presentation" style="height: 200px;" class="cke_contents" id="cke_contents_CKEditor1"><iframe frameborder="0" allowtransparency="true" tabindex="0" src="" title="Rich text editor, CKEditor1, press ALT 0 for help." style="width: 100%; height: 100%;"><html lang="en" dir="ltr"><head><title _cke_title="Rich text editor, CKEditor1, press ALT 0 for help.">Rich text editor, CKEditor1, press ALT 0 for help.</title><link href="http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/contents.css" rel="stylesheet" type="text/css"><style cke_temp="1" type="text/css">img.cke_flash{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/flash/images/placeholder.png?t=A8LE4JO);background-position: center center;background-repeat: no-repeat;border: 1px solid #a9a9a9;width: 80px;height: 80px;}
form{border: 1px dotted #FF0000;padding: 2px;}

img.cke_hidden{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/forms/images/hiddenfield.gif?t=A8LE4JO);background-position: center center;background-repeat: no-repeat;border: 1px solid #a9a9a9;width: 16px !important;height: 16px !important;}
img.cke_anchor{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/link/images/anchor.gif?t=A8LE4JO);background-position: center center;background-repeat: no-repeat;border: 1px solid #a9a9a9;width: 18px !important;height: 18px !important;}
a.cke_anchor{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/link/images/anchor.gif?t=A8LE4JO);background-position: 0 center;background-repeat: no-repeat;border: 1px solid #a9a9a9;padding-left: 18px;}
img.cke_pagebreak{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/pagebreak/images/pagebreak.gif?t=A8LE4JO);background-position: center center;background-repeat: no-repeat;clear: both;display: block;float: none;width:100% !important; _width:99.9% !important;border-top: #999999 1px dotted;border-bottom: #999999 1px dotted;height: 5px !important;page-break-after: always;}
.cke_show_blocks p,.cke_show_blocks div,.cke_show_blocks pre,.cke_show_blocks address,.cke_show_blocks blockquote,.cke_show_blocks h1,.cke_show_blocks h2,.cke_show_blocks h3,.cke_show_blocks h4,.cke_show_blocks h5,.cke_show_blocks h6{background-repeat: no-repeat;background-position: top left;border: 1px dotted gray;padding-top: 8px;padding-left: 8px;}.cke_show_blocks p{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/showblocks/images/block_p.png);}.cke_show_blocks div{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/showblocks/images/block_div.png);}.cke_show_blocks pre{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/showblocks/images/block_pre.png);}.cke_show_blocks address{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/showblocks/images/block_address.png);}.cke_show_blocks blockquote{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/showblocks/images/block_blockquote.png);}.cke_show_blocks h1{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/showblocks/images/block_h1.png);}.cke_show_blocks h2{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/showblocks/images/block_h2.png);}.cke_show_blocks h3{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/showblocks/images/block_h3.png);}.cke_show_blocks h4{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/showblocks/images/block_h4.png);}.cke_show_blocks h5{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/showblocks/images/block_h5.png);}.cke_show_blocks h6{background-image: url(http://rhodium.hitsshq.com:8086/html/js/editor/ckeditor/plugins/showblocks/images/block_h6.png);}
.cke_show_borders table.cke_show_border,.cke_show_borders table.cke_show_border &gt; tr &gt; td, .cke_show_borders table.cke_show_border &gt; tr &gt; th,.cke_show_borders table.cke_show_border &gt; tbody &gt; tr &gt; td, .cke_show_borders table.cke_show_border &gt; tbody &gt; tr &gt; th,.cke_show_borders table.cke_show_border &gt; thead &gt; tr &gt; td, .cke_show_borders table.cke_show_border &gt; thead &gt; tr &gt; th,.cke_show_borders table.cke_show_border &gt; tfoot &gt; tr &gt; td, .cke_show_borders table.cke_show_border &gt; tfoot &gt; tr &gt; th{border : #d3d3d3 1px dotted}</style></head><body contenteditable="true" spellcheck="false" class="cke_show_borders"></body></html></iframe></td>
Warren McCann
RE: body with black background makes editor in web content go black as well
2011/02/14 9:35
答え

Warren McCann

ランク: Junior Member

投稿: 36

参加年月日: 2010/11/19

最近の投稿

Hey Nate:

I've run into the same issue with the flickering. I have not gone back to looking through the editor, but when I do I'll come back with what I find.

-Warren
Brian Scott Schupbach
RE: body with black background makes editor in web content go black as well
2011/02/14 14:36
答え

Brian Scott Schupbach

ランク: Expert

投稿: 329

参加年月日: 2008/10/23

最近の投稿

How about instead of changing the ckeditor styles you give your body tag a css id.

So, instead of doing

1body {
2background:#000;
3}


you do

 1#bodyID {
 2background:#000;
 3}
 4
 5<html>
 6<head>
 7<title></title>
 8</head>
 9<body id="bodyID">
10
11</body>
12</html>


This way it won't conflict with the ckeditor body.
Brian Scott Schupbach
RE: body with black background makes editor in web content go black as well
2011/02/14 14:37
答え

Brian Scott Schupbach

ランク: Expert

投稿: 329

参加年月日: 2008/10/23

最近の投稿

I don't know why its putting in a smiley face but that is supposed to be a css color code of black...hopefully you get the idea
Warren McCann
RE: body with black background makes editor in web content go black as well
2011/02/15 13:34
答え

Warren McCann

ランク: Junior Member

投稿: 36

参加年月日: 2010/11/19

最近の投稿

But where would that go? Applying that would set the background color throughout the entire liferay instance..
Maarten van Heiningen
RE: body with black background makes editor in web content go black as well
2011/02/16 13:26
答え

Maarten van Heiningen

ランク: Regular Member

投稿: 172

参加年月日: 2009/02/05

最近の投稿

Hi Warren,

This would be the main body tag in your portal_normal.vm This could also be a class but that's your personal choice.

This way your body styling is correctly set for your theme part and not intervening with other body tags used in the portal. These are still set by the original css tags in the theme.

Maarten
Warren McCann
RE: body with black background makes editor in web content go black as well
2011/02/21 13:55
答え

Warren McCann

ランク: Junior Member

投稿: 36

参加年月日: 2010/11/19

最近の投稿

Working. Simple omission on my part within:

1table.cke_editor body {
2    background-color: #FFF;
3    color: #000;
4    background-image: none !important;
5}


I didn't include background-image. Of course it wasn't working, because it was still inheriting the background image I set.

In the end, I did learn that there are a number of layers of abstraction between what you see on browser to how the ckeditor is actually configured. IMHO, it's a little too abstract.

As far as the portal_normal.vm, wouldn't that override all of the body ids? Presently, each page has it's own body id of "aui-xxxxx-xxx". Whether or not the consequence of that override is bad, remains to be seen.
Jeff deVries
RE: body with black background makes editor in web content go black as well
2011/03/11 7:27
答え

Jeff deVries

ランク: New Member

投稿: 16

参加年月日: 2011/02/28

最近の投稿

I found that by setting the bg in the body classes I can have a light background for the editor and an image for the body. So far it works. I haven't found a scenario yet that breaks it.

In the custom.css for my theme:

body {
background-color: #FFFFFF;
font-size: 11px;
}

/* There may be some redundancy here */
.controls-visible, .guest-community, .signed-out, .public-page, .signed-in, .private-page{
background: #19AAD9 url(../images/background.jpg) no-repeat;
}

Thanks Maarten. You saying "This could also be a class" gave me the clue.

Jeff
Jeff deVries
RE: body with black background makes editor in web content go black as well
2011/03/11 13:14
答え

Jeff deVries

ランク: New Member

投稿: 16

参加年月日: 2011/02/28

最近の投稿

OK. Didn't quite understand the portal_normal.vm edit. Now I understand. make a copy of portal_normal.vm to _diffs/templates and add a class in the body tag.

<body class="$css_class customBG">

Then the custom.css can address it without interfering with anything else.

body {
background-color: #FFFFFF;
font-size: 11px;
}

.customBG{
background: #19AAD9 url(../images/background.jpg) no-repeat;
}
emoticon
Joss Sanglier
RE: body with black background makes editor in web content go black as well
2011/03/17 4:12
答え

Joss Sanglier

ランク: Junior Member

投稿: 60

参加年月日: 2009/07/15

最近の投稿

Jeff

Thank you thank you thank you!!!
Suraj Bihari
RE: body with black background makes editor in web content go black as well
2011/12/21 4:58
答え

Suraj Bihari

ランク: Junior Member

投稿: 42

参加年月日: 2011/05/20

最近の投稿

Nice!
匿名
RE: body with black background makes editor in web content go black as well
2012/01/05 17:38
答え

匿名

What is happening is the editor puts a body tag within the code,


so try

body body {
background: #FFF;
}