Adding embedded mode in docusaurus

Question

I am using docusaurus 1.14.4 I need to create embedded mode for each document which remove header, footer and left navigation.

Page url look like this http://localhost:3000/...../?mode=emb

I figure out a way by adding this piece of script to each md file

<script>
    function getParameterByName(name) {
        var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
        return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
    }
    var mode = getParameterByName('mode');
    if (mode === 'emb') {
        setTimeout(()=>{
            let list = ['fixedHeaderContainer', 'docsNavContainer', 'nav-footer', 'docs-prevnext'];
            for (var itemClassName of list) {
                var item = document.getElementsByClassName(itemClassName)[0]
                item.parentNode.removeChild(item)
            }
            document.getElementsByClassName('navPusher')[0].style.paddingTop = 0;
            document.getElementsByClassName('mainContainer')[0].style.paddingTop = 0;
        }, 0)
    }
</script>

It work but does not look like a proper way. Can anyone suggest a better way?

Your link is to a local server so we can't see what it looks like. Please embed an image or code. — RyanNerd, Feb 05 '20 at 06:54
this is source: https://imgur.com/a/nXhDrJQ this is target: https://imgur.com/a/jsgUc3r — Xuan Tien, Feb 11 '20 at 10:15

score 0 · Answer 1 · answered Feb 09 '20 at 09:42

0

Docusaurus maintainer here. There's no supported way of doing this. May I know what your motivations for doing this are?

answered Feb 09 '20 at 09:42

Yangshun Tay

49,270
33
114
141

my company has a centralized document size for all available apis. my app use just few of them where i do a bunch of work related to it. i want to have docs page in my app which is an iframe link to centralized size but without header, footer and left navigation. – Xuan Tien Feb 11 '20 at 10:10

Adding embedded mode in docusaurus

1 Answers1