Jekyll Collapsible Text Expander

text-expand.html

<!-- Author: https://github.com/simonjisu
Change `div.article-content` to your article container in jekyll blog
Put your file into `_include/text-expand.html`
-->
<script>
var elements = document.querySelectorAll('div.article-content')[0].childNodes; // 수정1 
var addContent = false;
var contentsToAdd = [];
var expandtags = null;
var detailText = null;
var detailsTag = null;
var summaryTag = null;
var detailsContent = null;
for (var i=elements.length - 1; i > -1; i--){
    el = elements[i]
    if (el.innerHTML == '[/expand]'){
        addContent = true
        detailsContent = document.createElement('div')
        detailsContent.className = 'collaspe-content'
        detailsContent.setAttribute('markdown', '1')
        el.parentNode.removeChild(el)
    } else if (el.innerHTML == '[expand]' || (el.nodeName == 'P' && el.innerHTML.includes('[expand]summary:'))) {
        addContent = false
        expandtags = el.innerHTML.split('summary:')
        if (expandtags.length == 1){
            detailText = 'Details'
        } else {
            detailText = expandtags[1]
        }
        detailsTag = document.createElement('details')
        detailsTag.className = 'collaspe-article'
        summaryTag = document.createElement('summary')
        summaryTag.appendChild(document.createTextNode(detailText))
        detailsTag.appendChild(summaryTag)
        for (var j=contentsToAdd.length - 1; j > -1; j--) {
            detailsContent.appendChild(contentsToAdd[j])
        }
        detailsTag.appendChild(detailsContent)
        el.parentNode.replaceChild(detailsTag, el)
        contentsToAdd = []
    } else {
        if (addContent) {
            contentsToAdd.push(el)
        }
    }
}
</script>