Extra HTML tag in the Source Code in Web Content Articles

This article documents a known issue and also a workaround in the Adaptive Media functionality. Liferay DXP 7.1 uses Adaptative Media to manage thumbnails and previews. It was discovered that after applying Liferay DXP 7.1 Fix Pack 1, a &imagePreview=1 tag appears at the tail end of the source code in embedded images in Web Content Articles. This is actually intended. However, the issue is that there is a missing Adaptive Media configuration that was supposed to generate the preview images when this parameter is utilized. But once the correct Adaptive Media configuration are applied, using the parameter results in fetching the correct image and everything displays as it should.

Steps to Reproduce:

  1. Navigate to the Control Panel → Content → Documents and Media.
  2. Add a new image to be embedded in the Web Content article.
  3. Navigate to the Control Panel → Content → Web Content.
  4. Click Add → New → Basic Web Content. A special structure or template is not necessary to reproduce this error.
  5. Enter the following:
    • Title: Ha Long Bay
    • Content: A dozen or so tour boats moored outside the grotto, Ha Long Bay
    • Click the (+) button to add an image.
    • Select the image from the Documents and Media tab.
    • Click the Code View to view the HTML source code.

    adaptive-media-html-tags03.png

 

The reason for this error is because when applying the latest fix packs, the Adaptive Media functionality did not upgrade existing previews.

Resolution

Workaround Available

One workaround is to create a new Adaptive Media Image Resolution rule then use it to upgrade all the preview thumbnails.
To do so:

  1. Go to the Control Panel → Configuration → Adaptive Media.
  2. Click the plus icon to add a new Image Resolution rule.
  3. Enter the following:
    • Name: Preview 1000x0
    • Max Width: 1000
    • Max Height: 0
  4. Leave the rest of the options as is
  5. Click Save.
  6. Click on the 3-dot menu next to Preview 1000x0 and click Adapt Remaining to convert the currently stored images to have this new resolution.
    adaptive-media-html-tags04.png

When completed, Preview 1000x0 shows 100% complete. The extraneous HTML tag at the end of the file can be safely ignored.
adaptive-media-html-tags05.png

Additional Information

For more information on the ultimate resolution, see LPS-86356 and LPS-82009.

Was this article helpful?
0 out of 0 found this helpful