Prevent TinyMce from rewritting simple urls

Five New Optimizely Certifications are Here! Validate your expertise and advance your career with our latest certification exams. Click here to find out more

AI OnAI Off

Home / Forums / Developers (Main Products) Forum / Content Management System 12 /

Prevent TinyMce from rewritting simple urls

Shane Hobensack

Vote:

Hey all,

We recently upgraded our .Net solution to CMS 12 which seems to have changed the behaviour of our TinyMce editor and how it transforms internal links.

sampleurl.html (the intended url)
/EPiServer/CMS/Content/Shop/sampleurl,,72193/?epieditmode=false (what the url is transformed to, after upgrade)

Our Custom Config:

    internal static class CustomTinyMceConfig
    {
        public static IServiceCollection ConfigureTinyMce(this IServiceCollection services)
        {
            services.Configure<TinyMceConfiguration>(config =>
            {
                config.Default()
                    .AddPlugin("media wordcount anchor link code table")
                    .Toolbar("formatselect | epi-personalized-content anchor link numlist bullist indent outdent bold italic underline alignleft aligncenter alignright | image epi-image-editor media code | epi-dnd-processor | removeformat | fullscreen | table | row_props cell_props row_after row_before delete_row col_after col_before delete_col split_cells merge_cells")
                    .AddSetting("image_caption", true)
                    .AddSetting("image_advtab", true)
                    .InitializationScript("/ClientResources/js/tinymce/custom-init.js");
            });

            return services;
        }
    }

custom-init.js

define([], function () {
    return function (settings) {
        return Object.assign(settings, {
            /* 
             * call back to overwrite tinymce and epi urlconvert implementations for internal links
             * 
             * links defined in TinyMCE CMS blocks should take the form:
             *      href="{ PAGE_SIMPLE_URL }.html"
             *      
             * */
            urlconverter_callback: function (url, node, on_save) {
                var rval = url;

                // convert internal urls only
                if (url.includes('.html') && !url.includes('http')) {
                    rval = url.replace(/^.*[\\\/]/, '');;
                }

                return rval;
            }
        });
    };
});

Any ideas what could be causing this issue? Have tried quite a few things, including adding the "convert_url":false parameter to our custom config, which did not seem to work.

Thank you!

#332706

Edited, Nov 11, 2024 18:35

Damian Smutek

Vote:

Hi,
From what I see you are using a default TinyMCE link plugin for the links, and the issue you described can be reproduced there:

Is it an option for you to use the epi-link plugin instead? It shows the CMS Link modal in that case:

It appears that urlconverter_callback is also executed when using epi-link, so you should be able to continue performing necessary conversions.

#332977

Nov 15, 2024 12:15

Shane Hobensack

Vote:

Damien,

Thank you for your response!

So it looks like that wasn't the exact issue, but it did lead me to figure out exactly how we were setting those plugins, so I removed our custom code and defined the settings through our .NET project instead, which actually seemed to work! For anyone in the future who has this same issue, here is the new code that doesn't transform the URLs:

        public static IServiceCollection ConfigureTinyMce(this IServiceCollection services)
        {
            services.Configure<TinyMceConfiguration>(config =>
            {
                config.Default()
                    .AddPlugin("media wordcount anchor link code table")
                    .Toolbar("formatselect | epi-personalized-content anchor link numlist bullist indent outdent bold italic underline alignleft aligncenter alignright | image epi-image-editor media code | epi-dnd-processor | removeformat | fullscreen | table | tablerowprops tablecellprops tableinsertrowbefore tableinsertrowafter tabledeleterow tableinsertcolafter tableinsertcolbefore tabledeletecol tablesplitcells tablemergecells")
                    .AddSetting("convert_urls", false)
                    .AddSetting("relative_urls", false)
                    .AddSetting("remove_script_host", true)
                    .AddSetting("document_base_url", string.Empty);
            });

            return services;
        }

#333107

Nov 18, 2024 17:32

amol.mahul

Vote:

@Shane Hobensack, I’ve tried multiple methods, but the link keeps getting converted to its internal representation. Even when I copy and paste the code that worked for you, it doesn’t seem to work locally for me. Any help would be greatly appreciated.

#336657

Feb 11, 2025 16:09

Shane Hobensack

Vote:

@amol.mahul Have you tried Damiens solution above? In my search for a fix, I did see a lot of posts mentioning using the link vs epi-link plugins.

#336659

Feb 11, 2025 17:10

amol.mahul

Vote:

Thanks Shane for the response. The editors in my case are used to introduce hyperlinks through the html markup using the code plugin in tinyMCE, Although I tried epi-link it doesn't make a difference. As soon as the page is published the links get transformed to its internal representation, which I wish to avoid as we have some special URLs which gets corrupted due to this behavior

#336690

Feb 12, 2025 8:09

Please login to post a reply