Jump to content

Issues with tinymce


Kae
 Share

Recommended Posts

Hey, guys!!!

I'm having a very big problem with Tinymce in processwire. I feel so stupid about it, but can't find the solution. Hope someone can help me. :rolleyes:

When I change to html and paste html tags inside a <code> tag, they get converted and disapear. How can I avoid this?

All Iwanted was to show some code examples. I feel so noob right now '-'

Thank you =)

Link to comment
Share on other sites

Part of the problem with using something like Code tags in this way is that you have to switch to HTML to do it - I always think that that undermines the idea of using a WYSIWYG editor in the first place, really.

Have a look at this link:

http://stackoverflow.com/questions/7153599/add-code-button-to-wordpress-tinymce

It is a bit old, but it might offer a better way around your problem. There is also a link to a plugin that does it for you. Haven't tried it, though.

You should also make sure that you are using a custom stylesheet for TinyMCE so that it displays code in the same way as on the front end of your site, of course. 

This also looks quite fun:

http://lab.nomadonweb.com/en/sh4tinymce

It uses SyntaxHighlighter 3 by Alex Gorbachev

Link to comment
Share on other sites

Hey, LostKobrakai. Thank you for your quick answer! I already tried that, with or without TInymce enabled and It didn't work. <p> tags were always converted. Joss, thank you too. I'll take a look at those links now and tell you here what I found out (sh4tinymce looks awesome). Could you tell me why, even using <pre> and <code> whith Tinymce disabled some html like <p> and <div> gets converted?

Link to comment
Share on other sites

In the TinyMCE settings that are on the input tab of the field, you have to allow tags to be used and also things like the style attribute. I cant remember what is in the default installation, but it is fairly basic - it is easier to add things than have to strip out loads of things that you would rather your users did not get their hands on!

For instance, this is the settings I use when I want to have a few more bits like right click context menu and stripping formatting when pasting. Also adds a style drop down:

buttons 1
 
formatselect,styleselect,fontsizeselect,|,bold,italic,justifyleft,justifycenter,justifyright,justifyfull,forecolorpicker,|,bullist,numlist,|,link,unlink,|,image,|,code,|,fullscreen,spellchecker
 
block formats
 
p,h1,h2,h3,h4,blockquote,pre,code
 
Plugins
 
inlinepopups,safari,table,media,paste,fullscreen,preelementfix,contextmenu
 
Valid Elements - note, to enable things like font color, size and face, you must use span and NOT font!
 
@[id|class|style],a[href|target|name],strong/b,em/i,br,img[src|id|class|width|height|alt],ul,ol,li,p[class],h1,h2,h3,h4,blockquote,-p,span[face|size|color],-table[border=0|cellspacing|cellpadding|width|frame|rules|height|align|summary|bgcolor|background|bordercolor],-tr[rowspan|width|height|align|valign|bgcolor|background|bordercolor],tbody,thead,tfoot,#td[colspan|rowspan|width|height|align|valign|bgcolor|background|bordercolor|scope],#th[colspan|rowspan|width|height|align|valign|scope],pre,code
 
Content CSS
 
/site/templates/css/editor.css
 
 
Additional Settings
 
paste_text_sticky: true
paste_text_sticky_default:true
theme_advanced_styles:Lead=lead;IconCell=iconcell;Blueheader=blueheader
 
Third party plugins
 
spellchecker : /site/tinymce/myplugins/spellchecker

 

 

Link to comment
Share on other sites

Joss, can you believe I wasn't seeing changes because somehow things were cached in the browser? I cleaned it, it worked. I tried my phone and it was working '-' . Thank you for your help.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...