erusev/parsedown

How can I wrap element inside another element? E.g. wrap img with div?

hrvoj3e opened this issue · 4 comments

hrvoj3e commented

I think that it would be useful to add instructions to Wiki.

I tried this

    protected function inlineImage($excerpt)
    {
        $element = parent::inlineImage($excerpt);
        if (!is_array($element ?? null)) {
            return null;
        }

        // wrap img with div
        $block = [
            'extent' => $element['extent'],
            'element' => [
                'name' => 'div',
                'handler' => 'element',
                'text' => $element,
                'attributes' => [
                    'class' => 'my-img-wrap',
                ],
            ],
        ];

        return $block;
    }

This is my test case:

![my-image](my-image.jpg)
<div class="my-img-wrap'">
   <img src="my-image.jpg" alt="my-image">
</div>
hrvoj3e commented

My bad.
I was testing Parsedown and ParsedownExtra

Working with

class MarkdownPlugin extends \Parsedown

Not working

class MarkdownPlugin extends \ParsedownExtra
  • don't know why though
  • ParsedownExtra does not have method inlineImage() at all so no additional logic there
Julienh commented

Hello,
I tried your example but I have an empty div, how did you do please ?

hrvoj3e commented

Hi. I have made a sample. It seems the problem is in version 1.7.

"erusev/parsedown": "^1.7", "erusev/parsedown-extra": "^0.8.1"

  • when you install normally - stable versions
PHP Warning:  Undefined array key "name" in /home/adax/code/other/github-erusev-parsedown-825/vendor/erusev/parsedown/Parsedown.php on line 1477
PHP Warning:  Undefined array key "name" in /home/adax/code/other/github-erusev-parsedown-825/vendor/erusev/parsedown/Parsedown.php on line 1477
<p><div class="my-img-wrap">< /></div></p>

<p><div class="my-img-wrap">< /></div></p>

"erusev/parsedown": "^1.8", "erusev/parsedown-extra": "^0.8.1"

  • dev versions work OK
  • parsedown-extra 0.8.0 works also
➜ php issue-825.php
<p><div class="my-img-wrap"><img src="my-image.jpg" alt="my-image-1.8.0-beta-7" /></div></p>

<p><div class="my-img-wrap"><img src="my-image-extra.jpg" alt="my-image-extra-0.8.1" /></div></p>
Julienh commented

Thanks for your help @hrvoj3e !