Vill du add fotnoter till dina blogginlägg i WordPress?
Om du skriver en artikel som refererar till forskning eller innehåller mycket komplex information kanske du vill använda fotnoter i ditt content. Det här är små numrerade markeringar i en text som ger ytterligare sammanhang till en mening eller ett stycke.
I den här artikeln visar vi dig hur du steg för steg kan add to enkla och eleganta fotnoter till dina blogginlägg i WordPress.
Varför add fotnoter till dina blogginlägg i WordPress?
Om du runar en pedagogisk blogg, utgivarblogg, publicerar forskning eller täcker stories är fotnoter ett bra sätt att ge mer sammanhang åt ditt content. Du kan använda dem för att lägga till kommentarer, lyfta fram viktiga fakta eller importera hänvisningar till akademiska källor på din website.
En fotnot appear typically as a small, superscript number within the main body of your text. Det faktiska fotnotinnehållet placeras sedan längst ner på sidan eller visas som en Tooltip för att skilja det från huvudinnehållet.
Här är ett exempel:
Förutom att ge klarhet och transparens för dina Läsare kan fotnoter få din WordPress website att se mer professionell och trovärdig ut. De visar att du har gjort din forskning och har källor som stödjer dina påståenden.
Som tur är har WordPress.org Editor en utvald fotnotsfunktion som du enkelt kan använda för att inserta ytterligare sammanhang. På så sätt behöver du inte manuellt add to fotnoterna själv.
Den här guiden visar hur du addar WordPress fotnoter till dina blogginlägg eller pages med hjälp av två metoder. Den ena är med hjälp av blocket Fotnoter i Gutenberg editor, och den andra är med ett plugin.
Du kan använda länkarna under för att hoppa till en specifik metod:
Metod 1: Så här addar du fotnoter i WordPress utan ett plugin
Den här metoden är bäst för personer som vill använda enkla fotnoter i blogginlägg och inte vill installera ett plugin för att göra det.
För att använda WordPress Footnotes-blocket måste du öppna Gutenberg block editor för ett nytt eller befintligt post.
Efter det kan du börja lägga till styckeblock, images och andra typer av content i blogginlägget. Du kan till och med add to insticksprogram för att styla din text och fånga läsarnas uppmärksamhet.
Nu markerar du bara ett ord i ditt content som du vill add to fotnoten till. I blockets toolbar klickar du på dropdown-pilen och väljer ”Fotnot”.
Du kommer nu att redirectas till längst ner på sidan, där blocket Footnotes har addats automatiskt. Här kan du skriva in din extra information.
Dessutom kan du customize blockets textfärg, typografi, dimensioner och kant med hjälp av settings i den högra panelen.
Om det finns länkar i fotnoten kanske du vill ändra färgen på länkarna så att de sticker ut.
Upprepa gärna detta steg för att inkludera så många fotnoter som behövs.
När du previewar din site i WordPress bör det finnas en fotnotslänk till meningen som du markerade tidigare.
Om du klickar på hyperlänken kommer du längst ner på sidan med fotnoten.
Här kan du också clicka på den hyperlänkade pilen för att gå tillbaka till den section där fotnoten är placerad.
Du kanske också vill göra en preview av din website på mobilen för att se till att fotnoten är läsbar på smartphoneskärmar.
Även om den här metoden är ganska enkel för Beginnare, erbjuder den inte massor av alternativ för customize. Om du letar efter fler sätt att ändra fotnotens appearance, fortsätt bara till nästa metod.
Metod 2: Så här addar du fotnoter till WordPress med ett plugin
Ett annat sätt att skapa fotnoter är att använda det gratis tillägget Modern Footnotes. Till skillnad från blocket Footnotes erbjuder det många fler alternativ för att ändra fotnotens appearance.
Du kan t.ex. få fotnoten att appear as a tooltip, as well as extra information längst ner på page.
Det första du ska göra är att installera pluginet Modern Footnotes. För mer information om installation av plugin, kontrollera vår guide om hur du installerar ett WordPress plugin.
Note : Om du ej är säker på om du ska använda detta plugin, kan du installera det på den tillfälliga WordPress Playground och leka med det.
Konfigurera tillägget Modern Footnotes Settings
När pluginet är installerat kan du nu gå till Settings ” Moderna fotnoter. Det är här du kan konfigurera fotnotinställningarna efter dina alternativ.
Låt oss gå igenom varje setting en efter en.
”Desktop footnote behavior” låter you välja hur fotnoten ska bete sig när the website viewas på en stationär dator.
Du kan få fotnoten att appear när en markör hoverar över tooltip eller när användaren clickar på tooltip. Alternativt kan fotnoten förstoras under den fotnoterade texten.
Vilken du väljer är upp till dina alternativ. Fotnoten kommer dock att förstoras under texten som standard på mobila vyer.
Förutom det kan du också kontrollera boxen ”Make footnote content appear in web browser’s native tooltip when hovering over footnote number” om det behövs. Detta innebär att fotnoten kommer att visas i webbläsarens tooltip snarare än i tilläggets när markören hoverar över texten.
Vi rekommenderar att du stänger av det här alternativet om du väljer Tooltip för fotnotbeteendet på skrivbordet. Annars får du två Tooltips för samma fotnot, vilket kan vara irriterande för Läsare.
Under kan du också välja att visa fotnotslistan längst ner i posts. På så sätt kan läsaren se all ytterligare information på ett och samma ställe.
Du kanske också vill aktivera den här funktionen när blogginlägget syndikeras via RSS-flöden.
Om du rullar ner kan du tacka ja till att inserta en heading för din fotnotslista och välja en tagged för den. Detta hjälper till att separera det faktiska innehållet i ditt blogginlägg från fotnoterna. Du kan skriva något som gillar Referenser, Fotnoter, Citeringar eller Ytterligare information.
Om du vill lägga till lite custom CSS för att ändra fotnotstexten, är du välkommen att insert den i ”Modern Footnote Custom CSS” box.
Sist men inte minst kan du customize Modern Footnotes shortcode om du inte vill använda den built-in versionen. Se till att du enter shortcoden utan parenteser.
När du är nöjd med inställningarna klickar du bara på ”Save Changes”.
Lägga till fotnoter med hjälp av tillägget Modern Footnotes
Nu när du har konfigurerat Modern Footnotes-inställningarna ska vi infoga några fotnoter i ditt content. Gå vidare och öppna block editor för ett nytt eller befintligt post eller page.
Det finns två sätt att add to en fotnot. Det ena är med en shortcode, vilket är vad vi rekommenderar.
Först hittar du den mening som du vill inserta en fotnot till. Sedan, precis bredvid den meningen, skriver du in följande shortcode:
[mfn]Infoga din fotnot här[/mfn]
Se till att ersätta texten mellan parenteserna med your information.
Vi föreslår också att du placerar shortcoden i samma block som meningen, precis bredvid texten, utan något mellanslag, precis som i exemplet under. Annars kan fotnoten se ut att vara kopplad ifrån texten.
Den andra metoden är att skriva din fotnotstext bredvid den mening som du vill add to fotnoten till. Se till att det inte finns något mellanslag mellan fotnotstexten och meningen.
I exemplet under vill vi add to en fotnot som innehåller en akademisk referens för meningen som börjar med ”Studier tyder på …
Markera sedan fotnoten och clicka på knappen med nedåtpilen i toolbaren. Därefter väljer du ”Add a Footnote”.
Nackdelen med den andra metoden är att det kan vara svårt att spåra vilka textrader som har fått en fotnot och vilka som inte har fått det när you redigerar innehållet. Det är därför vi rekommenderar metoden med shortcode.
När du previewar blogginlägget ser du att det nu finns en siffra bredvid meningen. Om du använder alternativet Tooltip, är det så här fotnoten kommer att gilla att se ut:
Å andra sidan kommer fotnoten att visas under texten om du använder det förstorbara formatet.
Så här gillar du det när du klickar på numret:
Slutligen, om du väljer att visa all footnote content längst ner i posten, kan you rulla ner för att hitta allt där.
De borde finnas någonstans ovanför comment section.
Pro tips: Vill du add to en ansvarsfriskrivning i slutet av ditt blogginlägg istället för en fotnot? Kolla in vår guide om hur du automatiskt lägger till en ansvarsfriskrivning i WordPress för steg-för-steg-instruktioner.
Learn More Sätt att Customize Ditt WordPress Content
Förutom fotnoter finns det många sätt att göra ditt WordPress content mer intressant och läsbart för besökarna.
Du kan till exempel add to custom fonts till WordPress. På så sätt kan du skapa en typografi som ser unik ut och skiljer sig från andra konkurrenter, vilket gör din website mer minnesvärd.
Dessutom kan du markera vissa texter i dina block för att rikta användarnas uppmärksamhet mot den viktigaste informationen.
Här är andra tips som du kan kontrollera:
- Så här markerar du nya posts för återkommande besökare i WordPress
- Så här addar du dynamiskt content i WordPress (Beginner’s Guide)
- Så här addar du en Font Resizer i WordPress för tillgänglighet
- Så här addar du mörkt läge till din website i WordPress (enkelt)
- Så här displayed du näringsvärdesdeklarationer i WordPress
Vi hoppas att den här artikeln har hjälpt dig att lära dig hur du addar fotnoter till din website i WordPress. Du kanske också vill läsa våra expertval för de bästa drag and drop page builders för WordPress och vår guide om hur man redigerar en WordPress website.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Syed Balkhi says
Hey WPBeginner readers,
Did you know you can win exciting prizes by commenting on WPBeginner?
Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
You can get more details about the contest from here.
Start sharing your thoughts below to stand a chance to win!
Jiří Vaněk says
Sometimes on the site I use excerpts from books or other blogs as opinions about something, and I always added them below the article. But this method is much more elegant, as it adds a small link to the information below the line directly to the excerpt. From the website user’s point of view, it will be a much better way to solve this. Thanks for another one of many inspirations on how to make content more user-friendly.
THANKGOD JONATHAN says
This is really good. But since Gutenberg editor work similar with Block editor, should I just use the block editor or must install the Gutenberg editor again?
WPBeginner Support says
They are the same editor, it just has two different names
Administratör
samarth says
I have a question. Adding Footnotes through the custom (HTML) method will cause in-article wording and would the article length will be increased?
And, If through the plugin, the words of footnotes won’t be counted as blog post words?
sorry for any grammatical mistakes.
WPBeginner Support says
Both methods would be adding text to your article, we would not recommend either method if you only wanted to increase your word count.
Administratör
Ciprian says
Hi,
Thanks for this info, I`ve tried it and it`s working fine, but now I have a curiosity:
– the link for this notes are dofollow, from seo point of view, is this ok or we should make them nofollow?
– if we need them nofollow, how can we do that?
Thanks a lot.
WPBeginner Support says
For nofollowing links, you would want to take a look at our article here: https://www.wpbeginner.com/beginners-guide/how-to-add-nofollow-links-in-wordpress/
Administratör
Didier Van Bogget says
Work fine ! Really simple. Thank you.
David says
Hey, forgive my ignorance, but I can’t figure out how to activate this, or any other plugin. What am I missing?
Editorial Staff says
Are you using WordPress.com or self-hosted WordPress.org?
https://www.wpbeginner.com/beginners-guide/self-hosted-wordpress-org-vs-free-wordpress-com-infograph/
Administratör
Hank says
I added the plugin and tried some footnotes. When I click on the little number that should link to the footnote, it takes me below the comment box on the WordPress page and doesn’t display the footnote. I have to scroll up to see the footnote.
Does anyone know how I can get it to land on the actual footnote?
Editorial Staff says
It sounds like a CSS issue in your theme which causing this.
Administratör
Hank DeBey says
I had some remnants of earlier footnote attempts in the code. I removed those and things are better. Thanks for your help.
Evan Lowry says
Does it still do this when you view the page when you are signed out of the Dashboard? For me, when the dashboard menu is up top (when I am signed in), it makes it appear that the FN links are taking me too low–but then when I view the same page logged out, as a reader would, the FNs work properly.
Evan Lowry says
This is a great plugin, but in the version I downloaded for 3.5.1, the footnotes reset after ten, back to zero, in the footer. Does anyone know how to fix this? I just want it to continue: 11, 12, etc…
Editorial Staff says
Did you try contacting the author?
Administratör
Kiesha Michelle says
Thanks for this!! I was trying to figure out how to add footnotes….
fatihtoprak says
Great plugin thanks for that.
retlkpr says
Now that is one I did not know about. Thanks! It works great.