Skip to content

🔌 Docsify plugin to add custom footer to pages

License

Notifications You must be signed in to change notification settings

sujaykumarh/docsify-plugin-footer

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

30 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Docsify Plugin Footer

A simple plugin to add page footer to docsify

GitHub package.json version jsDelivr hits (npm)


📥 Download

  • Locally

    npm install @sujaykumarh/docsify-plugin-footer
  • CDN

    <script src="//cdn.jsdelivr.net/npm/@sujaykumarh/docsify-plugin-footer@1.x/dist/plugin.min.js"></script>
    
    <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/@sujaykumarh/docsify-plugin-footer@1.x/dist/plugin.min.css">

🧰 Configuration

Available options

window.$docsify.customPageFooter = {
    debug: false,                   // for debugging

    showPoweredBy: true,            // should show powered by docsify at right
    copyrightYear: '',              // show copyright year, default current year.
    showCopyright: true,            // set to false to hide default copyright
    copyright: undefined,           // set this to html string to use custom copyrihgt section
    copyrightOwnerName: '',         // copyright owner name
    copyrightOwnerLink: undefined,  // copyright owner link if any
    copyrightExtra: undefined,      // any exta text to show below copyright owner section

    useLocalStorage: true,          // build and store footer in localstorage for quick access
}

generates footer


        |      content here
        |      ....
sidebar |      ....
        |
        |
        |      ___________________________________________________________________
        |
        |      copyright (c) 2021 copyrightOwner.              Powered by docsify.
        |      [---copyrightExtra---]

Example:

<script>
    ...

    window.$docsify.customPageFooter = {
      copyrightOwnerName: 'Sujaykumar Hublikar',
      copyrightOwnerLink: 'https://github.com/sujaykumarh',
    }

    ...
</script>

Colors

set a link colors set --primary & --primary-dark in :root

  • --primary is used default link color

  • --primary-dark is used when link:hover

Example:

...


:root {
    --primary: #0f5d9c;
    --pirmary-dark: #0a4677;
}


...

🛠️ Development

Clone

git clone https://github.com/Sujaykumarh/docsify-plugin-footer.git

install resources

npm install

minify src/plugin.js and src/plugin.css generate minified files in dist folder

npm run minify      # generate minified resources in ./dist

npm run minify:css  # generate minified css resources in ./dist
npm run minify:js   # generate minified js resources in ./dist

📄 License

Copyright (c) 2021 Sujay H Licensed under Apache License v2.0 read LICENSE