Jekyll adding open and close paragraph to include that should not be there

Help
1

Using markdown only instead of HTML
Line in markdown

{% include youtube-spoiler.html id="h4UqMyldS7Q" %}

HTML in include file

<input type="checkbox" id="spoiler1" />
<label for="spoiler1">Contents Spoiler</label>
<div>
    <iframe src="https://www.youtube.com/embed/{{ include.id }}" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</div>

output in _site

image
image1737Ă—853 126 KB 

<p><input type="checkbox" id="spoiler1" />
<label for="spoiler1">Contents Spoiler</label></p>
<div>
    <iframe src="https://www.youtube.com/embed/h4UqMyldS7Q" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen=""></iframe>
</div>

Why does jekyll add the open and close paragraph when there isn’t one in my include file?

image
image1737Ă—853 109 KB

2

it seems to do that to any non block level element.

I think if you wrap your checkbox/label in a div (or maybe form?) it will not add the p tag.

3

That gets rid of the paragraph tag thanks. I have to troubleshoot why the video doesn’t hide but that’s okay I’ll figure it out. I had it working sorta but that paragraph tag was in the way. I just have to try again.

4

@rdyar It is doing it again on a table I have made in markdown. It adds an open paragraph tag and a close paragraph tag. I have to use kramdown or Jekyll escapes the HTML and changes the < to &lt;div class="cmp-no" /&gt;

{::nomarkdown}<div class="cmp-no" />{:/}

That is working as an include in a table

image
image1920Ă—998 217 KB

The CSS for the green checkmark or the red X shows up.

With multi like HTML it gets destroyed.

Same as MO1 plus:
<div>
    <ul>
        <li>Advanced per-mod conflict views with alternatives, sorting, search, etc.</li>
    </ul>
</div>

image
image1920Ă—998 106 KB

Jekyll should not be confused about that and add a paragraph tag.

image
image1920Ă—998 137 KB

Markdown Line that without the issue:

Conflict visualization | {% include cmp-no.html %} | mo2 | mo1 | vor | No visualization of conflicts as there can’t be, just one time popup during mod installation to either overwrite or keep old files. Game archives (BSA) management | Colored checkboxes indicate conflict. Tabs can be selected to see detailed list of conflicts for both loose files and BSA/BA2 files. The mod archive or package name is shown.

Markdown Line that with the issue:

Conflict visualization | {% include cmp-no.html %} | {% include convis_mo2.html %} | mo1 | vor | No visualization of conflicts as there can’t be, just one time popup during mod installation to either overwrite or keep old files. Game archives (BSA) management | Colored checkboxes indicate conflict. Tabs can be selected to see detailed list of conflicts for both loose files and BSA/BA2 files. The mod archive or package name is shown.

I tried using kramdown in case it was going to be like the issue I had with liquid tags but that did not help.

When I don’t use the include with the unordered list then the HTML looks as it should

As shown here the include works fine when not in a table.

image
image1920Ă—998 212 KB

Then I thought it is working on a single line so what if I do that.

{::nomarkdown}<p>Same as MO1 plus:</p><ul><li>Advanced per-mod conflict views with alternatives, sorting, search, etc.</li></ul>{:/}

image
image1920Ă—998 134 KB

That makes the table less broken, except that after the include Jekyll ignores the rest of the table columns separated by the pipe making a new row instead.

5

Then I thought the limitation is coming from the unordered list syntax. I was disappointed but I felt, you know if that’s a limitation then so be it, I can work with that. I will remove the table HTML and just use the include. I can find a way to restore the table somehow.

NOPE!

It’s just the fact the include is there.

image
image853Ă—279 48.3 KB

Yes there is a carriage returns and a linefeed. I just didn’t want to add this mess to the table because it’s hard to work with the table when this is added.

Single generic flag on modlist for all conflicts types.
Only an “active-rule” icon once conflict has been resolved through a rule.
Popup when installing mod with conflicts.
Simple conflict resolution window (rules) with tooltip of conflicted files.
Advanced per-mod file tree structure of conflicts with alternatives from other mods.

Conflict visualization | {% include cmp-no.html %} | Same as MO1 plus: Advanced per-mod conflict views with alternatives, sorting, search, etc. | Different conflict flags on modlist for different conflict types (winning/losing/both). Highlighting of mods that have conflict with the currently selected mod. Listing of losing. Winning and non-conflicted files for each mod. Ability to preview and cycle alternatives of textures and other file types. | Single generic flag on modlist for all conflicts types. Only an "active-rule" icon once conflict has been resolved through a rule. Popup when installing mod with conflicts. Simple conflict resolution window (rules) with tooltip of conflicted files. Advanced per-mod file tree structure of conflicts with alternatives from other mods. | No visualization of conflicts as there can't be, just one time popup during mod installation to either overwrite or keep old files. Game archives (BSA) management | Colored checkboxes indicate conflict. Tabs can be selected to see detailed list of conflicts for both loose files and BSA/BA2 files. The mod archive or package name is shown.

Which means I have to use that instead. That hurts my eyes. I should be able to use an include.

6

Saves management: Virtualization per profile and dedicated tab to visualize them. | {% include cmp-yes.html %} | {% include cmp-yes.html %} | {% include cmp-yes.html %} | {% include cmp-yes.html %} | {% include cmp-no.html %} | {% include cmp-yes.html %} Separate folders for save games can be created and save games are easily managed with the exception that there are no mod profiles.

Then I thought that would work and it doesn’t. I thought hmmmm I wonder if it’s the CRLF.

NOPE!

Saves management: Virtualization per profile and dedicated tab to visualize them. | {% include cmp-yes.html %} | {% include cmp-yes.html %} | {% include cmp-yes.html %} | {% include cmp-yes.html %} | {% include cmp-no.html %} | {::nomarkdown}<div class="cmp-yes" />{:/} Separate folders for save games can be created and save games are easily managed with the exception that there are no mod profiles.

That doesn’t work either.

image
image1920Ă—998 194 KB

Obviously I have not finished the part in the blue box. I’m not that far along yet wrestling with these issues.

7

Not sure if this might help here, but Liquid inserts blank lines around
{% Whatever %}
unless you write
{%- Whatever -%}
Found this somewhere in the Liquid documentation.

Best, Michael

1 Like