CODEWITHSUNDEEP
htmlmarkdownjekyll
Benjamin Sanders
Benjamin Sanders

Reputation: 31

For Some Reason Markdown Images won't show surrounded by HTML

So for some reason when I have my markdown image tag wrapped in a <div> or a <section> it just outputs markdown code. http://d.pr/i/bPvI (screenshot)

<section class="photoset">

![Image of San Francisco bay bridge from beach](/images/san-francisco.jpeg)

</section>

But when I remove the HTML code it shows the image but is wrapped in paragraph tags which are not the problem. I understand why Jekyll does that to images. It makes sense to me. I just don't understand why it won't work when it's worked for me before when wrapping it in HTML tags.

Edited

<section class="photoset">

![Image of San Francisco bay bridge from beach](/images/san-francisco.jpeg)

</section>

<p><img src="/images/san-francisco.jpeg" alt="Image of San Francisco bay 
bridge from beach" /></p>

The above code I tried seeing if it would work without the section tags and it did work. So for some reason, it is the HTML tags that are preventing the markdown tags to work or something.

Upvotes: 1

Views: 831

Answers (2)

David Jacquel
David Jacquel

Reputation: 52789

You need to tell Kramdown to process kramdown syntax in block HTML tags

In _config.yml :

kramdown:
  # parse markdown inside block-level HTML tag
  parse_block_html: true

Upvotes: 0

Ross Allen
Ross Allen

Reputation: 44880

This is an intentional choice by Markdown itself and not a fault of Jekyll. From the inline HTML Markdown docs:

Note that Markdown formatting syntax is not processed within block-level HTML tags. E.g., you can’t use Markdown-style *emphasis* inside an HTML block.

If you want to add block-level HTML, its contents must be fully written in HTML as well.

Upvotes: 2

Related Questions