Jump to content

tinyMCE rich text editor - extended version - inline svg


Recommended Posts

I've successfully updated my TinyMCE to the extended version for prestashop 1.6 but am having issues tying to put a svg tag into the CMS editor. I can insert it using the html editor and it shows my svg in the preview area. When I save and then come back to the editor page, the svg code has been cleaned up and isn't there anymore. The same issue with save and preview. The code is missing from the live preview.

 

I can embed it but I want to be able to do animations with the code so it needs to be inline to the page.  

 

this is a example of the code that disappears after saving;

 

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="900px" height="1200px"> <path style="fill: none; stroke: #333; stroke-width: 3; stroke-linecap: round; stroke-linejoin: miter; stroke-miterlimit: 4; stroke-opacity: 1; stroke-dasharray: 6000; stroke-dashoffset: 0;" data-100-start="stroke-dashoffset:6000;" data-end="stroke-dashoffset:0;" d="m 37.370542,17.79364 209.999998,0 c 0,0 30,0 30,29.999997"></path> </svg>

 

Any advice or help would be greatly appreciated,

 

Cheers,

Richie

Link to comment
Share on other sites

Hi Statistic, thank you for your reply,

 

I've tried adding it like this but I don't think i've done it the correct way.

extended_valid_elements: 'pre[*],script[*],style[*],svg[*]',

i've also tried 

 valid_children: "+body[style|script|svg],pre[script|div|p|br|span|img|style|h1|h2|h3|h4|h5],svg[xmlns|version],*[*]",

and 

 valid_elements : '+*[*]',  

Failing that i tried to turn off the cleanup functions using the code i found below but its still deleting my script on save.

cleanup_on_startup: false,
    trim_span_elements: false,
    verify_html: false,
    cleanup: false,
    convert_urls: false,

Any help on this would be great,

 

Cheers, 
Richie
Link to comment
Share on other sites

Hi, still no luck,

 

It seemed like the extended tinymce was working as I have more options now, but I think all my script is still being disabled. my inline js is being commented out after save. 

<script type="text/javascript">

<!--//--><![CDATA[//><!--
skrollr.init({
forceHeight: false
});
//--><!]]></script>

also a simple style like this is deleted after save as well

<style>
div {position relative;}
</style>

I think it could be something else in prestashop stopping it from staying there after save but I've post the tinymce code i'm using as it could be the issue

function tinySetup(config)
{
    if(!config)
        config = {};
 
    //var editor_selector = 'rte';
    //if (typeof config['editor_selector'] !== 'undefined')
        //var editor_selector = config['editor_selector'];
    if (typeof config['editor_selector'] != 'undefined')
        config['selector'] = '.'+config['editor_selector'];
 
//    safari,pagebreak,style,table,advimage,advlink,inlinepopups,media,contextmenu,paste,fullscreen,xhtmlxtras,preview
    default_config = {
        selector: ".rte" ,
        plugins : "visualblocks, preview searchreplace print insertdatetime, hr charmap colorpicker anchor code link image paste pagebreak table contextmenu filemanager table code media autoresize textcolor emoticons",
        toolbar2 : "newdocument,print,|,bold,italic,underline,|,strikethrough,superscript,subscript,|,forecolor,colorpicker,backcolor,|,bullist,numlist,outdent,indent",
        toolbar1 : "styleselect,|,formatselect,|,fontselect,|,fontsizeselect,", 
        toolbar3 : "code,|,table,|,cut,copy,paste,searchreplace,|,blockquote,|,undo,redo,|,link,unlink,anchor,|,image,emoticons,media,|,inserttime,|,preview ",
        toolbar4 : "visualblocks,|,charmap,|,hr,",
            
        external_filemanager_path: ad+"/filemanager/",
        filemanager_title: "File manager" ,
        external_plugins: { "filemanager" : ad+"/filemanager/plugin.min.js"},
      	extended_valid_elements : '*[*]',
        valid_children: "+body[style|script],pre[script|div|p|br|span|img|style|h1|h2|h3|h4|h5],*[*]",
        valid_elements : '*[*]', 
        force_p_newlines : false, 
        cleanup: false, 
        forced_root_block : false, 
        force_br_newlines : true,   
        menu: {
            edit: {title: 'Edit', items: 'undo redo | cut copy paste | selectall'},
            insert: {title: 'Insert', items: 'media image link | pagebreak'},
            view: {title: 'View', items: 'visualaid'},
            format: {title: 'Format', items: 'bold italic underline strikethrough superscript subscript | formats | removeformat'},
            table: {title: 'Table', items: 'inserttable tableprops deletetable | cell row column'},
            tools: {title: 'Tools', items: 'code'}
        }
 
    }
 
    $.each(default_config, function(index, el)
    {
        if (config[index] === undefined )
            config[index] = el;
    });
 
    tinyMCE.init(config);
 
};

thanks for the quick replys, i apreciate the help,

 

Cheers,

Richie

Link to comment
Share on other sites

Still the same issue, looked to check if it was a cache issue but the file has been updated on the server. Certain i'm missing something here. My prestashop version is 1.6.0.9. Could that be the issue.

 

Cheers,

Richie

Link to comment
Share on other sites

×
×
  • Create New...