Magento – Broken image links from Wysiwyg’s shortcodes on category and product pages not translating on Magento website

ce-1.9.2.2magento-1.9patcheswysiwyg

Broken Links from wysiwyg on frontend of Magento store.

The URL's on broken pages are like below:

Admin –

<img src="{{media url="wysiwyg/image.png"}}" alt="image" />

Frontend –

<img src="{{media url=" wysiwyg="" image.png"}}"="" alt="image">

My Urls created from Wysiwyg seem to be fine within admin and are only broken on category and product pages where the shortcodes seem to fail. however they still seem to be working on CMS Pages.

I have looked at the template files and am wondering if they need changing since recent SUPEE 6822 update (however I updated months ago and it didn't seem to be a problem then initially). As other questions have been solved by processing html content like below in the case of a cms page:

    $html_content = $content_from_db['content'];$html_content =          Mage::helper('cms')->getPageTemplateProcessor()->filter($html_content); echo $html_content;`

Also have considered that the permissions introduced in SUPEE 6822 may be effecting parts of the pages ability to translate shortcodes like in this issue with static blocks however I feel the category and product pages should have permission as default:

https://community.magento.com/t5/Technical-Issues/Static-block-shortcodes-not-working-1-9-2-2/td-p/20096

Best Answer

Check that System -> Configuration -> Catalog -> Frontend -> "Allow Dynamic Media URLs in Products and Categories" is set to YES.

Related Solutions

Magento 1.9: Change Main Image on Category Hover – Tutorial

Quick and dirty approach to this is to use jQuery.

Example of:

3 top categories (A, B, C)
3 images to change to (A.jpg, B.jpg, C.jpg)
default background image K.jpg
.cms-home .main-container is where the background photo will be changed upon hovering

Your Magento generated navigation should have the similar structure of

<li class="level0 nav-0"><a href="http://example.com/a.html" class="level0 ">A</a></li>
<li class="level0 nav-1"><a href="http://example.com/b.html" class="level0 ">B</a></li>
<li class="level0 nav-2"><a href="http://example.com/c.html" class="level0 ">C</a></li>

In your home CMS page put this content at the bottom, update the backgroundImages with the right link to your media.

<script>
    (function(){
        var backgroundImages = [
            "/media/wysiwyg/K.jpg", // default background image link
            "/media/wysiwyg/A.jpg", // background image for category A
            "/media/wysiwyg/B.jpg", // background image for category B
            "/media/wysiwyg/C.jpg", // background image for category C
        ];

        function updateBg(position){
            jQuery('.main-container').css('background-image','url('+backgroundImages[position]+')');      
        }

        jQuery(document).ready(function(){
            jQuery('.nav-0').hover(function(){updateBg(1)},function(){updateBg(0)});
            jQuery('.nav-1').hover(function(){updateBg(2)},function(){updateBg(0)});
            jQuery('.nav-2').hover(function(){updateBg(3)},function(){updateBg(0)});
        });        
    })();
</script>

This is a manual solution which requires maintenance upon updating categories/images.

Tailored module approach is more recommended.

Magento 1.9 CMS – CMS Blocks Disappeared After 1.9.2.2 Update

My understanding is that CE 1.9.2.2 includes all the changes from the recent-patch SUPEE-6788, one of which was restrict the blocks that can be used in CMS blocks, pages, emails (etc...) by default.

Fortunately you can whitelist additional blocks through the admin under System > Permissions > (Blocks | Variables)

Related Topic