Support Forum
Hi all,
as per title I use rich text editor plugin and CSS Only theme, when a user quotes a post, the text appears in new post with right indentation but without any coloured background so isn't easy to understand where finish quote and start new text.
I couldn't figure out where to change this and how to assign a background colour to quotes inside new post, could you point me in the right direction?
TinyMCE WYSIWYG Editor 1.2
Thanks in advance
Marco
Hakuna Matata
All of the CSS rules regarding the content of a post are in the 'spPostContent' class so for blockquote you will need to find:
#spMainContainer .spTopicPostSection .spPostSection .spPostContentSection .spPostContent blockquote
where you change the background colour...
YELLOW
SWORDFISH
|
Yellow Swordfish said
All of the CSS rules regarding the content of a post are in the 'spPostContent' class so for blockquote you will need to find:
#spMainContainer .spTopicPostSection .spPostSection .spPostContentSection .spPostContent blockquote
where you change the background colour...
Thanks Andy but seems that those code affects only how to post is shown, and not also inside the editor, may be a screenshot could help to explain better.
I tried with another theme too, same result.
Any other place where I can look at?
Hakuna Matata
Ah - misunderstood.
OK in the SP tinymce plugin folder navigate to:
/tinymce/themes/advanced/skins/o2k7/ and in there you will find a file called 'content.css'.
Make a copy of that file and place it in your SP theme /styles folder. Do NOT move it - copy it.
that is the file that controls the editor CSS applied during editing and you should find the blockquote in there - or you can add it. If it is any help for a starter we use:
blockquote { overflow: hidden; background: #f0f0f0; color: #000000; border: 1px solid #cccccc; margin: 0 0 1em; padding: 1em 1em 0 1em; -webkit-border-radius: 5px; border-radius: 5px; font-weight: normal; font-size: 100%; line-height: 1.2em; }
which works here on this site.
before you do that let's just ask Steve or Brandon if I got that right! ??
YELLOW
SWORDFISH
|
Thanks Andy,
it works!
In my case I also modified the "p" tag adding a transparent background to avoid white text highlight
from
p {padding-bottom: 5px;}
to
p {padding-bottom: 5px; background: none repeat scroll 0 0 transparent;}
and all works fine.
Thanks again
Marco
Hakuna Matata
Sort of. I don't think you will find a blockquote style in there. But yes, copy that file over, then add your blockquote or any other styling at the bottom.
Please note, you may need to do it again after next tinymce plugin release since we are switching to wp version of tinymce.
Visit Cruise Talk Central and Mr Papa's World
you may not notice the wp tinymce editor being used... but it will be integrated better...
when you get it, you will likely want to copy the content.css from our skins we provide and make your changes again... otherwise you will some styles since the wp editor styles get stomped on in the front end... plus you will be able to chose from 5 different skins/variants with the new editor - you might find one you like better... like the one we use here
Visit Cruise Talk Central and Mr Papa's World
Sorry, to open a old thread.
Are above guidelines not working with the last SP version?
I did add:
blockquote {
overflow: hidden;
background: #f0f0f0;
color: #000000 ;
border: 1px solid #cccccc;
margin: 0 0 1em;
padding: 1em 1em 0 1em;
-webkit-border-radius: 5px;
border-radius: 5px;
font-weight: normal;
font-size: 100%;
line-height: 1.2em;
}
to the content.css of the tinymce theme Cirkuit (i actualy did try all four themes), but i did not get a background color inside the editor when you quote. Like you have here at this forum and which help a lot.
Cheers
1 Guest(s)