The latest dev version of module picture support now WYSIWYG module with IMCE to include image in body field with a picture group format.
I test to include image too in body field with the latest dev version of media module 2.x as explain in this issue WYSIWYG support.
I create 2 display mode of file in media (file display)
1- the first, called, "large" use a display of core's image (with a style fixed)
2- the second, called "responsive" use a display of picture (with a picture group)
I inserted an image with media module in a body field and used the both display mode created
1- In the first case, the same style (large) is always used. I double click on image to insert the data-picture-group attribute after inserting it with Media, and save. But the configuration of the data-picture-group attribute is not saved
2- In the second case, It's the same thing, the data-picture-group attribute is not saved when I double click on image to insert them. But the image is responsive, with the display mode i called "responsive" wich is defined on a picture group (in /file-types/manage/image/file-display).
So, the second case permit to insert image with media module rendered with a picture group.
But now you can't define the position of the image (left, right, center) because the data attibute are not saved. An other solution would be to apply a css style to the img wich do the the job (float: left, etc) but we can't attribute a css style to the img with the new dialog box.
Any idea ?
Comment | File | Size | Author |
---|---|---|---|
#9 | wysiwyg_ckeditor_image_absolute_path_20130312.patch | 442 bytes | alexgkt |
#7 | media-custom-attributes-1932898-7.patch | 909 bytes | ShaunDychko |
#6 | media-custom-attributes-1932898-6.patch | 1.01 KB | ShaunDychko |
#3 | wysiwyg_ckeditor_image_absolute_path.patch | 593 bytes | alexgkt |
Comments
Comment #1
akmalfikri CreditAttribution: akmalfikri commentedPlease list here what patch do we need to make to make it work.
I also have an error :
Undefined index: mythemename in picture_wysiwyg_plugin() (line 1222 picture.module).
after I enabled the 'Make images responsive with the picture module' setting in my site's text format.Comment #2
flocondetoileI try to uncheck the option Include Bartik picture group in the CKEditor image dialog (Bartik is the name of the picture group) in admin/config/media/picture/ckeditor, in order to have the classic CKEditor image dialog and then apply the style on the image inserted with media module.
I get well the classic image dialog box, and in the node edit the html markup are well applied (float: left, etc.).
But when i view the node the only html markup are those of picture module but without the markup of picture (data-picture-align="right" data-picture-group="bartik", etc.) and without the html markup i defined in the image dialog box.
So when i inserted an image with media module 2.x in WYSIYWG with ckeditor 4.0.1.1, i can't apply any custom style either with the image dialog box modified by this patch or with the classic image dialog box.
But I wonder if this issue is relative to picture module ?
@akmalfikri : the patch should permit to apply the html markup (image alignment and image size) to image inserted with media module. It was very useful also if we can choose in a other select list some css styles that we could set in the configuration page.
I don't have your error.
Comment #3
alexgkt CreditAttribution: alexgkt commentedThe comment on the picture_image_uri() function stated that the img src can be either http://, https://, or root relative /.
But it's not so because i realised that when an absolute path is used this particular function will return an error causing the validation code to return an error because the $needles[$scheme] will not be at position 0.
When i tried using a relative path, the validation passed and $needles[$scheme] is indeed at position 0 therefore I've added 2 lines of code to make sure to remove the domain name of from the $src when an absolute path is used. Not sure if this is the best way to solve it but $key[0] remained empty even when i'm using a relative path.
This is not quite a media module issue but images that is added through the add media button are in absolute path hence i think this should be useful to those that are having issue using the add media button.
Comment #4
attiks CreditAttribution: attiks commentedCan you try using parse_url, something like
it should work for both absolute and relative paths.
Comment #5
attiks CreditAttribution: attiks commentedBetter title, since this is about wysiwyg + media
Comment #6
ShaunDychko CreditAttribution: ShaunDychko commentedHere's the second piece of the puzzle. The Media module needs to be told to accept the custom attributes. Patch attached.
definitely looks like a better solution for checking the 'Drupal URI' (not included in this patch).
Comment #7
ShaunDychko CreditAttribution: ShaunDychko commentedOops, forgot to make patch project relative. BTW, this patch is against media-7.x-2.x-dev from today. Revised patch attached.
Comment #8
attiks CreditAttribution: attiks commented#7 is a patch for media, so I created #1937106: Add extra attributes to wysiwyg_allowed_attributes to support picture integration
Comment #9
alexgkt CreditAttribution: alexgkt commentedHere's the new patch file as suggesested by attiks at #4 instead of the previous hack.
Comment #10
ShaunDychko CreditAttribution: ShaunDychko commentedTested:
and it returns:
Which looks great!
Comment #11
attiks CreditAttribution: attiks commentedComment #12
westis CreditAttribution: westis commentedI added an image with Media in WYSIWYG. But when I double-click the image to select the Picture groups the entire page is greyed out but no popup window comes up. Same is happening if I just click the Image button instead of Add media.
I have the dev version of Picture as of today, and have enabled "Make images responsive with the picture module" in the Text formats, and put that after "Convert Media tags to markup" int he Filter processing order.
Do need something more to make Picture work with Media in WYSIWYG? Do I need to apply the patch for Media in #7?
Comment #13
attiks CreditAttribution: attiks commented#12 can you create a new issue please and link it with this one?
Comment #14
attiks CreditAttribution: attiks commented#12 you probably need the patch for media