Hi Guys,
in my latest Projekt I used the newest _XH-Version of CMSimple.
Now I got a strange problem, concerning the unordered list display in the editor window: When I activate the unordered list-Button, nothing happens in the editor-window > no bulletpoints, etc. are displayed, but when I klick on "preview", the bulletpoints get displayed properly? It's a little bit annoying because as an editor you can't really tell if there are bulletpoints or not, you have to switch permanently while editing your site.
Does anyone know of this problem and have a solution to it?
Here is a screenshot of that mess: http://imageshack.us/f/256/tinymce.jpg/
Thanks for your support!
Robert
TinyMCE and <li> unordered list problem!
6 posts
• Page 1 of 1
TinyMCE and <li> unordered list problem!
by smik » Wed Jul 11, 2012 12:42 pm
- smik
- Posts: 11
- Joined: Tue Nov 25, 2008 4:02 pm
Re: TinyMCE and <li> unordered list problem!
by Gert » Wed Jul 11, 2012 12:56 pm
Hi Robert,
an image says nothing, what we need is a link to your website, because it seems to be a template related problem (CSS).
Try if it also happens with the standard tempate,
Gert
an image says nothing, what we need is a link to your website, because it seems to be a template related problem (CSS).
Try if it also happens with the standard tempate,
Gert
- Gert
- Posts: 4540
- Joined: Fri May 30, 2008 4:53 pm
- Location: Berlin
Re: TinyMCE and <li> unordered list problem!
by cmb » Wed Jul 11, 2012 1:04 pm
Hi Robert,
some part of the styling seems to be missing in the edit view. If I look at the screenshots, not only the bullets are missing, but the list is not indented to the right.
tinyMCE includes the template's stylesheet by default (stylesheet.css), but it doesn't use additional stylesheets linked in the <head> of the template. So if you have additional stylesheets linked in the template, you have to declare them to tinyMCE. In plugins/tinymce/inits/init_full.js you'll find:
You can add additional stylesheets there (separated by comma), e.g.
Christoph
some part of the styling seems to be missing in the edit view. If I look at the screenshots, not only the bullets are missing, but the list is not indented to the right.
tinyMCE includes the template's stylesheet by default (stylesheet.css), but it doesn't use additional stylesheets linked in the <head> of the template. So if you have additional stylesheets linked in the template, you have to declare them to tinyMCE. In plugins/tinymce/inits/init_full.js you'll find:
- Code: Select all
content_css : "%STYLESHEET%",
You can add additional stylesheets there (separated by comma), e.g.
- Code: Select all
content_css : "%STYLESHEET%, ./templates/my_template/stylesheet2.css",
Christoph
Christoph M. Becker---Plugins for CMSimple_XH
- cmb
- Posts: 5468
- Joined: Tue Jun 21, 2011 11:04 am
- Location: Germany
Re: TinyMCE and <li> unordered list problem!
by smik » Wed Jul 11, 2012 1:20 pm
@Gert
Thanks for the quick answer! You're right, a link is certainly better, but the problem is in the backend, so you would't see much except I'd give you the password to login. But your tip to try another template helped to realize that actually the problem occurs only in my own template...
@Christoph
Thanks for your tips, I will try out, but I'd be happier if there was another solution! As mentioned above, that problem is unique to my template, so I'd rather change my own template than to mess around with the editor-system-files...
When I know where the problem lies, than I can avoid it in future projects
THANKS SO MUCH!
Thanks for the quick answer! You're right, a link is certainly better, but the problem is in the backend, so you would't see much except I'd give you the password to login. But your tip to try another template helped to realize that actually the problem occurs only in my own template...
@Christoph
Thanks for your tips, I will try out, but I'd be happier if there was another solution! As mentioned above, that problem is unique to my template, so I'd rather change my own template than to mess around with the editor-system-files...
When I know where the problem lies, than I can avoid it in future projects
THANKS SO MUCH!
Last edited by smik on Wed Jul 11, 2012 2:42 pm, edited 1 time in total.
- smik
- Posts: 11
- Joined: Tue Nov 25, 2008 4:02 pm
Re: TinyMCE and <li> unordered list problem!
by cmb » Wed Jul 11, 2012 1:35 pm
Hi Robert,
thanks for the link -- I guess there's no need to log in. The problem: the styling of the list is done in the template's stylesheet line 95ff:
But tinyMCE, which runs in an IFrame, doesn't have a <div id="content">, so it ignores these styles. And in the template's stylesheet line 2:
takes away the padding and margin of the all <ul>'s, so even the bullets can't be seen.
Similar differences between edit and view mode will show up for <a>'s (and all styles that are only defined for #content).
A simple solution: don't restrict the definitions of <ul>,<li>,<a> etc. to #content. If you need to style these differently in other parts of the template, you can do so by restricting them to the surrounding elements.
A cleaner solution would be to have an editor, that's not embedded in an IFrame. Unfortunately none of the good editors are implemented with contentEditable yet.
Christoph
thanks for the link -- I guess there's no need to log in. The problem: the styling of the list is done in the template's stylesheet line 95ff:
- Code: Select all
#content ul{margin-left:50px;}
#content li{
list-style-position: inside;
list-style-image: url(images/bullet2.png);
line-height: 20px;
}
But tinyMCE, which runs in an IFrame, doesn't have a <div id="content">, so it ignores these styles. And in the template's stylesheet line 2:
- Code: Select all
* {padding: 0; margin: 0;}
takes away the padding and margin of the all <ul>'s, so even the bullets can't be seen.
Similar differences between edit and view mode will show up for <a>'s (and all styles that are only defined for #content).
A simple solution: don't restrict the definitions of <ul>,<li>,<a> etc. to #content. If you need to style these differently in other parts of the template, you can do so by restricting them to the surrounding elements.
A cleaner solution would be to have an editor, that's not embedded in an IFrame. Unfortunately none of the good editors are implemented with contentEditable yet.
Christoph
Christoph M. Becker---Plugins for CMSimple_XH
- cmb
- Posts: 5468
- Joined: Tue Jun 21, 2011 11:04 am
- Location: Germany
Re: TinyMCE and <li> unordered list problem!
by smik » Wed Jul 11, 2012 1:50 pm
Wow, thanks Christoph for the excellent explanation of where the problem lies!
I'd never come across that idea > mainly because I'm not a real coder but a worse autodidactic
Now I'll try to change things according to your hints!
Best regards from Stuttgart,
Robert
I'd never come across that idea > mainly because I'm not a real coder but a worse autodidactic
Now I'll try to change things according to your hints!
Best regards from Stuttgart,
Robert
- smik
- Posts: 11
- Joined: Tue Nov 25, 2008 4:02 pm
6 posts
• Page 1 of 1
Who is online
Users browsing this forum: No registered users and 1 guest