How to add Modern Footnotes in Wordpress

• To install correctly this modern-footnotes.zip .
• Fisrt Download the modern-footnotes.zip to your computer
• Extract/Open modern-footnotes.zip to Your Computer.
• Then, Find readme.txt file inside modern-footnotes.zip and Open readme.txt .
• Now, Read the Requirements of this plugin. Which Wordpress Version and PHP Version are required to run this Plugin in Your Wordpress Site.
• Then, Follow the Tips Below.

Step-1 : Download " modern-footnotes.zip " to Your Local Computer.

Step-2 : Then, Login to your " yourdomain.com/wp-admin " Dashboard.

Step-3 : Then, Click on " Plugins " + " Add New " from left Side Menu of Dashboard.

Step-4 : Now, Click on " Upload Plugin " button.

Step-5 : Now, Browse " modern-footnotes.zip " Downloaded plugin from your computer, Where you downloaded " modern-footnotes.zip " According to Step – 1 Above then, click on " Install Now "

Step-6 : Now, Click on " Active Plugin "

Step-7 : Then, See left Side Menu. " Modern Footnotes " folder is added on left Side Menu. Now, Click on " Modern Footnotes " folder.

Noted that: If you do not see " Modern Footnotes " folder on left Side Menu then, see at left Side Menu " Settings " or " Tools ".

Step-8 : Now you configure yourself oR Watch video tutorial below about Modern Footnotes Configurations and Settings or How to work " Modern Footnotes " in your WordPress site.

After Activated Plugin According to Step-6 then,

1. Go to " Plugins " + " Installed Plugin " from Wordpress Admin Panel Leftside Menu.
2. or Direct go to: https://yourdomain/wp-admin/plugins.php
3. Then, Find " Modern Footnotes " Activated Plugin from Plugin List.
4. Then, Click on " Settings " from Plugin that is Modern Footnotes
5. Now, Edit/Add/Config the setting and Click on " Save Changes " button,

1. Upload the modern-footnotes folder to your wp-content/plugins directory.
2. Activate the plugin in the WordPress Plugins section.
3. Use a footnote in your post by using the footnote icon in the WordPress editor or by using the shortcode: [mfn]this will be a footnote[/mfn]
4. Reference numbers will be automatically assigned sequentially so the first footnote is labeled 1, then the next footnote is 2, then 3, etc. You can specify custom reference numbers by using the “referencenumber” attribute to specify a particular reference number. For example: [mfn referencenumber=3]This will have the number 3 with it.[/mfn]
5. If you want to customize the styles, you can do so by overriding the following styles in custom CSS for your theme:
   .modern-footnotes-footnote – The superscript element displaying the footnote number
   .modern-footnotes-footnote–selected – A superscript element that is currently active
   .modern-footnotes-footnote__note – Styling that applies to both mobile and desktop footnotes
   .modern-footnotes-footnote__note–mobile – The styling for a mobile footnote
   .modern-footnotes-footnote__note–desktop – The styling for a desktop footnote