I noticed that after update, alignment seems to have been removed from some of our images.

For instance on our production site, images of people are left aligned
http://ri2.sierraclub.org//content/about-0

On the dev site, the people images are no longer left aligned. (see attached)

When I login to the dev site, and look at the page -- the alignment is still there in the WYSIWYG
But if I click on image properties -- the alignment is not there.

Attaching versions of what it looks like on the Dev site on the page, and what it looks like in the WYSIWYG. Somehow the styles are preserved in the WYSIWYG code, but stripped out for the published page.

Legacy rendering is being used on this site.

I see the problem on other dev sites and their pages as well. It is not exclusive to this page.

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

adriancotter created an issue. See original summary.

joseph.olstad’s picture

Status: Active » Needs work

Hmm, might want to double check the html filter settings before and after the upgrade.

What version of media are you using in both of those scenarios?

have you tried the 7.x-2.x dev ?

joseph.olstad’s picture

also, are you using media_ckeditor ?
if so, which version (dev or release, if release, which release) ?

also, if you are using the wysiwyg module, which version are you using? I recommend the dev version of wysiwyg as the release version from 2012 has reported issues.

adriancotter’s picture

What version of media are you using in both of those scenarios?

  • dev is at the latest - 7.x-2.0-beta13
  • prod is at - 7.x-2.0-beta10

have you tried the 7.x-2.x dev ?

  • No I have not.

also, are you using media_ckeditor ?

  • No just using media_wysiwyg in media - so beta10 on prod, 13 on dev.

I recommend the dev version of wysiwyg as the release version from 2012 has reported issues.

  • This would mean getting just the sub module of media's latest dev branch?
  • I appreciate the module very much, the work that has been done, and what it can do -- and it is frustrating to not be able to trust the recommended release of a module. Esp one that can be so bound up into one's site, and security patches are in there as well. How can I help test these things before they get into the recommended release?
joseph.olstad’s picture

@adriancotter
wysiwyg is a seperate project , not sure if you're using it or not.

when I mentioned wysiwyg please do not confuse this with media_wysiwyg .
media_wysiwyg is a sub module of media
wysiwyg is a seperate project on its own.

joseph.olstad’s picture

@adriancotter , Thanks for your feedback. Can you please reply to comment #5? basically just need to know if you're using the wysiwyg module, if you are, which version and if not version , which dev?.

adriancotter’s picture

Wysiwyg that we are using is 2.2
It would be the same on dev and prod

Also -- just tried to edit an alignment in the Dev side, and the alignment is not pushed through to the front end.

joseph.olstad’s picture

FYI: There are known compatibility issues in wysiwyg 2.2 that are resolved by upgrading to 7.x-2.x dev of wysiwyg (2.2 dates back to 2012 , released more than 4 years ago)

Might help to try 7.x-2.x dev of wysiwyg when using the latest media 7.x-2.0-beta14 .

adriancotter’s picture

I updated to the latest dev version of WYSIWYG module on a local dev site
to Version: 7.x-2.2+86-dev

and it has made no difference... alignment still does not save.

You had said earlier: "might want to double check the html filter settings before and after the upgrade"
Could you be more specific about what to look at here? These ones? /admin/config/content/formats/rich_text_editor_format

  • Convert URLs into links
  • Correct faulty and chopped off HTML
  • Convert Media tags to markup
  • Ensure that embedded Media tags are not contained in paragraphs

however, I do have another site, which does not seem to have been affected. I haven't yet tracked down what the difference might be (the only thing so far is that one does also have IMCE on the site).

joseph.olstad’s picture

FileSize
23.87 KB
478.33 KB

I've created a test environment on a D7 vanilla , fresh install
installed
media 7.x-2.0-beta14
media_ckeditor 7.x-2.0-alpha4
ckeditor 7.x-1.17

here's my filter settings:
filter settings format

And left and right alignment testing:
left and right alignment working

joseph.olstad’s picture

Category: Bug report » Support request
Status: Needs work » Postponed (maintainer needs more info)

I cannot reproduce this problem. Please provide steps for reproducing the issue and more details.

Here is what the source html markup looks like (in the wysiwyg ckeditor source):

<p>test test fafdsatest</p>

<p>fdsafdsafdsafdsafdafdsa[[{"fid":"1","view_mode":"default","fields":{"format":"default","field_file_image_alt_text[und][0][value]":"text alt test alt","field_file_image_title_text[und][0][value]":"text titletest"},"type":"media","field_deltas":{"1":{"format":"default","field_file_image_alt_text[und][0][value]":"text alt test alt","field_file_image_title_text[und][0][value]":"text titletest"},"2":{"format":"default","field_file_image_alt_text[und][0][value]":"text alt","field_file_image_title_text[und][0][value]":"text title"}},"link_text":null,"attributes":{"alt":"text alt test alt","title":"text titletest","height":1224,"width":1632,"style":"float:left; height:191px; width:255px","class":"file-default media-element","data-delta":"1"}}]]fdsafdsafdsafdsafd</p>

<p>fdsafdsafdsa</p>

<p><strong>left alignment</strong></p>

<p>fdsafdsafdsa</p>

<p>fdsafdsafdsaf</p>

<p>&nbsp;</p>

<p>fdsa</p>

there are options for formatting how ckeditor generates this stuff too, double check the global ckeditor settings and all your ckeditor profile settings including compare your filter settings and order of processing.

joseph.olstad’s picture

which gets rendered to this:

<div class="field-item even" property="content:encoded">teste alt <div class="media media-element-container media-default"><div id="file-1" class="file file-image file-image-jpeg">

        <h2 class="element-invisible"><a href="/file/1">children.jpg</a></h2>
    
  
  <div class="content">
    <img alt="text alt" title="text title" style="float:right; height:312px; width:416px" class="file-default media-element" data-delta="2" typeof="foaf:Image" src="/sites/vanille/files/field/image/children.jpg" height="1224" width="1632"></div>

  
</div>
</div>

<p>test alt</p>

<p>fdsafdsafdsafdsa</p>

<p><strong>right alignment</strong></p>

<p>fdsafdsafdsafdsaf</p>

<p>dsafdsafdsafdsa</p>

<p>fdsafdsafdsafds</p>

<p>afdsafdsafdafdafdsafdsafds</p>

<p>afdsafdassfdasfsd</p>
</div>

that's just the first image right aligned

adriancotter’s picture

Okay, I think I know the issue -- I'd not fine tuned the file type display (manage file display of images) on a couple of sites... so on the updated site, before I fine tuned, this is how the HTML is looking:

Updated (but poorly defined file types)

Here's the rendered HTML looking in the WYSIWYG:

<span class="media-image media-element file-media-large" data-delta="1" data-fid="166" data-media-element="1" height="267" id="styles-0-0" style="margin: 10px; width: 220px; height: 267px; float: right;" width="220"><img alt="" height="267" id="styles-0-0" data-cke-saved-src="http://lospadres.dd:8083/sites/lospadres.sierraclub.org/files/styles/large/public/condor_0.jpg?itok=Hll-bc1u" src="http://lospadres.dd:8083/sites/lospadres.sierraclub.org/files/styles/large/public/condor_0.jpg?itok=Hll-bc1u" title="" typeof="foaf:Image" width="220"></span>

And here's the rendered HTML on the page:

<span id="styles-styles-0-0-0" class="styles file-styles large">  <img width="220" height="267" id="styles-0-0" typeof="foaf:Image" src="https://dev.lospadres.sierraclub.org.794elmp01.blackmesh.com/sites/lospadres.sierraclub.org/files/styles/large/public/condor_0.jpg?itok=G8LGJw0p" alt="" title=""></span>

Before the Update (with same poorly defined file types)
it was getting rendered properly as below:

<img alt="Condor" height="267" width="220" style="margin: 10px; width: 220px; height: 267px; float: right;" class="media-element file-default" title="" typeof="foaf:Image" src="http://lospadres2.sierraclub.org/sites/lospadres.sierraclub.org/files/condor_0.jpg">

One of the updates affected how the rendering is happening, and was putting everything into styles in the span around the IMG which seems a little weird.

But I have a way forward now, and can deal with that fairly easily.

Thanks for help in troubleshooting, Joseph.

adriancotter’s picture

Priority: Major » Minor
Status: Postponed (maintainer needs more info) » Closed (works as designed)

Actually, now that I am looking at the production sites, it does not look like a function of the update at all, but a problem of mine -- not having fixed things on various dev versions of sites

So mea culpa, apologies for the waste of time (including too much of my own).

joseph.olstad’s picture

Status: Closed (works as designed) » Postponed

FYI there I did see a patch in likely media_ckeditor dealing with improved alignment, follow-up soon, might helpful

Chris Matthews’s picture

Version: 7.x-2.0-beta13 » 7.x-2.x-dev
Status: Postponed » Closed (outdated)

Recent versions of media have resolved most of peoples concerns and is compatible with entity translation, multilingual and various advanced configurations. Due to the high volume of inactive and most often irrelevant issues we are Closing this as (outdated). If for whatever reason this issue is important to you AND you still have issues after checking the media recipe documentation, then let us know and we will review your concerns.

Otherwise, see the recipe documentation for how to configure media and for troubleshooting tips OR refer to the media_dev distribution if you want to see a working media setup.

As mentioned, feel free to make some noise in this issue if you still feel it is important to you or someone else.

Thanks,

Media team