показ содержания уценки в div

Question

Я создаю простой персональный сайт (используя jekyll), и у меня есть проблема на странице «Обо мне». На каждой странице веб-сайта (в том числе на странице со мной) есть заголовок сверху и нижний колонтитул внизу. На странице «Обо мне» я хочу, чтобы раздел среднего контента был разделен по вертикали, с текстом слева и моим изображением справа.

Для достижения этой цели, мой «о-Me.html» имеет следующие два дивы:

<div class='about_content' id='about_left'> 
    ... 
</div> 

и

<div class='about_content' id='about_right'> 
    <span style="margin:0 10px; float:right"> 
     <a href="/assets/picture.jpg" title="Gautam"> 
      <img src="/assets/picture.jpg" width="240" height="320" alt="Gautam"/> 
     </a> 
    </span> 
</div> 

Текст о-мне, что я хочу показать это в markdown файл, называемый «about-me.md», но все мои попытки показать это содержимое в div «about_left», описанном выше, не сработали :(

Один из вариантов - не использовать уценку для текста со мной , но instea d напишите обычный HTML в div about_left. Мне не нравится этот вариант.

Другой вариант - не использовать файл «about-me.html» вообще, а вместо этого вставить тег изображения внутри «about-me.md», как предлагается в this answer. Такие работы, но текст и изображение затем не находятся в отдельных div; из-за чего текст распространяется под изображением -> то, что я хотел бы избежать.

Есть ли способ сохранить файл "about-me.html" с двумя div, но все же показать текст из моего файла "about-me.md" внутри div "about_left"?

Answer 1

Вы можете сделать что-то подобное в вашем HTML файл, в котором вы хотите, чтобы содержимое файла Markdown, чтобы показать:

{% capture about %}{% include about-me.md %}{% endcapture %} 
{{ about | markdownify }}