Uploaded image for project: 'Magnolia Templating Essentials'
  1. Magnolia Templating Essentials
  2. MTE-105

Fix dx problems with image block

XMLWordPrintable

    • Icon: Story Story
    • Resolution: Fixed
    • Icon: Major Major
    • 1.1.4, 1.2
    • None
    • None
    • None
    • Yes
    • Yes
    • Basel 109
    • 3

      The standard blocks will be available in the stock stories app and should be as developer friendly as possible. The image block has two problems.

      The simple problem is that the css class of the image is "lead-image" which does not make sense. It should probably simply be blank.

      The main problem is that the basic HTML structure changes depending on whether the image block (or the asset it exposes) has a caption or credit supplied (A wrapping div is either present or not). This makes any CSS or JS much harder to develop and test - and a developer might not even realize that the HTML structure changes - ie they are developing a project and no one has supplied any caption or credit - they launch the project, then an author adds a caption to an image and breaks the website.

      This problem exists in the mtk image macro, which is used by the image block.

      https://git.magnolia-cms.com/projects/MODULES/repos/templating-essentials/browse/magnolia-templating-kit/src/main/resources/mtk/templates/macros/image.ftl

      New structure
      The most important thing is that div structure stays the same - a question is, should the image, caption, credit always be wrapped, or not wrapped. In the context of an image block for the content editor, they should definitely always be wrapped. Each block should have one top level element.

      Possible approaches:
      Do not use the mtk image macro.

      Modify the mtk image macro to accept a new parameter (or a new template definition parameter) to change the wrapping behaviour.
      But we cannot change the mtk image block default behaviour in a minor version as it would break existing projects.

        Acceptance criteria

              mmichel Maxime Michel
              czimmermann Christopher Zimmermann
              Votes:
              0 Vote for this issue
              Watchers:
              1 Start watching this issue

                Created:
                Updated:
                Resolved:

                  Task DoD