WYSIWYG editor in static block is deleting HTML code

Question

I've noticed that the WYSIWYG editor, in the static block configuration, randomly deletes the HTML code inside, in my case is the image slider.

I'm not sure about the reason: image size, code size, ilegal characters, code identation, spaces, etc, for what I know the code is not actually deleted at all, if I look for it on the cms_block I found it the content column, exactly how I coded it, but the WYSIWYG editor just a few HTML lines (deleting the UL element with everything inside), and the image slider doesn't display the images in the frontend. Sometimes accepts the code and works, sometimes it doesn't.

The images altogether has just 1MB size, and 850px x 310px... not deal I think.

This is exactly the HTML code inside the static block of the image slider:

    <div class="slideshow-container">
        <ul class="slideshow">
            <li><a href="{{config path="><img alt="" src="{{media url="wysiwyg/slideshow/Banner_1.jpg"}}"/></a></li>
            <li><a href="{{config path="><img alt="" src="{{media url="wysiwyg/slideshow/Banner_2.jpg"}}"/></a></li>
            <li><a href="{{config path="><img alt="" src="{{media url="wysiwyg/slideshow/Banner_3.jpg"}}"/></a></li>
            <li><a href="{{config path="><img alt="" src="{{media url="wysiwyg/slideshow/Banner_4.jpg"}}"/></a></li>
            <li><a href="{{config path="><img alt="" src="{{media url="wysiwyg/slideshow/Banner_5.jpg"}}"/></a></li>
        </ul>
        <div class="slideshow-pager">&nbsp;</div>
        <span class="slideshow-prev">&nbsp;</span>
        <span class="slideshow-next">&nbsp;</span>
    </div>

After saving it, and going back to edit it, this is the code I see:

    <div class="slideshow-container">
        <div class="slideshow-pager">&nbsp;</div>
        <span class="slideshow-prev">&nbsp;</span> 
        <span class="slideshow-next">&nbsp;</span>
    </div>

And once again, I can see the whole HTML code in the content field of the cms_block MySQL table.

Anybody can explain me what's happening here?

Answer 1

I am also having an issue with Magento deleting code, although it seems the cause may be different and I have a work-around. The code in question is:

<div id="mqnb_main">
    <a id="mqnb_link" href="#specials_element" onmouseup="mqnbCheck()"><span class="ci_if_linkspan"><p id="mqnb_text">View<br/>Specials</p></span></a>
</div>

...which gets turned into:

<div id="mqnb_main">
    <p id="mqnb_text">View<br/>Specials</p>
</div>

I don't have full access to Magento, so my only recourse (after sending an ineffectual email) was to use JavaScript to make sure the elements were all there. I added this at the end of the static block:

<script type="text/javascript">
    document.getElementById("mqnb_main").innerHTML = '<a id="mqnb_link" href="#specials_element" onmouseup="mqnbCheck()"><span class="ci_if_linkspan"><p id="mqnb_text">View<br/>Specials</p></span></a>';
</script>

Answer 2

The cause of the issue was an incomplete config path attribute, which the WYSIWYG editor deletes after it saves some modification of it. Saving without notice the incomplete code leads to an obvious wrong code, which won't be displayed. What I understand so far, the WYSIWYG editor spoil the code if the href attribute has a query string, not sure yet why.

The whole HTML static block is exactly like this:

<div class="slideshow-container">
    <ul class="slideshow">
        <li>
            <a href="{{config path="web/base_url"}}catalogsearch/result/?q=maquillaje+zapatos+esmalte">
                <img alt="Maquillaje Zapatos Esmalte de U&ntilde;as" src="{{media url="wysiwyg/slideshow/banner_1.jpg"}}" />
            </a>
        </li>
        <li>
            <a href="{{config path="web/base_url"}}catalogsearch/result/?q=esmalte">
                <img alt="Esmalte de U&ntilde;as" src="{{media url="wysiwyg/slideshow/banner_2.jpg"}}" />
            </a>
        </li>
        <li>
            <a href="{{config path="web/base_url"}}catalogsearch/result/?q=converse">
                <img alt="Zapatos Converse" src="{{media url="wysiwyg/slideshow/banner_3.jpg"}}" />
            </a>
        </li>
        <li>
            <a href="{{config path="web/base_url"}}catalogsearch/result/?q=chanel">
                <img alt="Chanel" src="{{media url="wysiwyg/slideshow/banner_4.jpg"}}" />
            </a>
        </li>
        <li>
            <a href="{{config path="web/base_url"}}catalogsearch/result/?q=hogar+envases">
                <img alt="Envases de Cocina" src="{{media url="wysiwyg/slideshow/banner_5.jpg"}}" />
            </a>
        </li>
        <li>
            <a href="{{config path="web/base_url"}}catalogsearch/result/?q=botas+zapatos+deportivos">
                <img alt="Botines Zapatos Deportivos" src="{{media url="wysiwyg/slideshow/banner_6.jpg"}}" />
            </a>
        </li>
    </ul>
    <div class="slideshow-pager">&nbsp;</div>
    <span class="slideshow-prev">&nbsp;</span>
    <span class="slideshow-next">&nbsp;</span>
</div>

Now notice the content of the href HTML attribute.

(Thanks to Brice C. for the little help!). If anyone has had the same issue please let me know.