0

I am using the WYSIWYG module to load TinyMCE 4.x, I am then uploading an image via the Media button in the toolbar of TinyMCE finally I am using LinkIt to link the image to a location.

All of this is fine inside the WYSIWYG editor, but once it is published and viewed on the page the wrapping <a> tag is stripped.

So in the editor if I view the source I see:

<a href="/my-exciting-page/index.html">
    [[{"fid":"7","view_mode":"default","fields":{"format":"default","field_file_image_alt_text[und][0][value]":"","field_file_image_title_text[und][0][value]":""},"type":"media","link_text":null,"attributes":{"height":376,"width":640,"class":"media-element file-default"}}]]
</a>

However once this is rendered to the template I see simply:

<img height="376" width="640" class="media-element file-default" typeof="foaf:Image" src="http://example.org/sites/default/files/miscl.jpg" alt="" />

If I then edit this piece of content again and view the source of the WYSIWYG editor the <a> tag is definitely still wrapped around the Media module's little string of JSON.

In a bid to prevent this from happening I changed the Wysiwyg Profiles and Text Profiles so that they don't remove broken tags or attempt to clean up an HTML or introduce any of their own HTML. Unfortunately this has had no effect.

Is there some way that Media/Drupal/WYSIWYG/LinkIt can be setup so that it will allow images to be linked? I have been unable to find a relevant issue or patch floating about out there on the web either.

  • 1
    OK, that was fun. So why the down vote? How can this question be improved in your opinion? – Treffynnon Oct 16 '14 at 13:20
  • 1
    I didn't downvote this, but this is most definitely an issue with misconfigured Input Filter ("Text Format" in D7). Have you checked the settings of the Input Filter you're using? Does it allow <a> tags? Have you tried setting to a different Input Filter? Like Full HTML or "Plain Text"? – Beebee Oct 16 '14 at 13:25
  • 1
    @Beebee yes, as I mentioned in the question I have removed all HTML filters from the profiles in use by the WYSIWYG editor. Other content is fine in the same WYSIWYG as well - I can link piece of text for example. I am working with the Full HTML filter, but I have made it even fuller! – Treffynnon Oct 16 '14 at 13:41
  • @Treffynnon you definitely saved me a lot of work. – duru May 11 '15 at 21:30
2

I posted this as an issue on the media_wysiwyg module bug tracker over at https://www.drupal.org/node/2357993 and have been working my way through it since. Here is the best result I have managed to achieve so far copied from my responses to that issue.


This issue is mostly caused by the file_entity module. To work round this I have restricted the view modes available to media_wysiwyg in /admin/config/media/wysiwyg-view-mode. I have set images to only allow the WYSIWYG view mode like so:

Media WYSIWYG editor

I have then created an override template for the file entity called file--image--wysiwyg.tpl.php (see https://www.drupal.org/node/1793548) and I have the following code in it:

<?php

hide($content['links']);
print render($content);

This has now removed all the annoying links, headers and wrapping <div>s from the output EXCEPT for the media_wysiwyg wrapping mentioned in comment #4.

As this is just one wrapping <div> and the page is HTML this now no longer breaks the link, but it would still be preferable to be able to remove this annoying wrapping <div>.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.