For kort tid siden kom Facebook ud med et nyt design til deres Facebook-like-boks, som du kan se på billedet herunder. Navnet er ændre til ”Facebook Page Plugin”, og designet har fået et løft, som rigtig mange bloggere vil sætte pris på.

1 Facebook nye like boks

Har du allerede indsat den gamle Facebook like-boks på din blog, så skulle den efter sigende automatisk ændre sig. Ønsker du ikke at vente på dette, så vil vi fremvise vi i denne guide, hvordan du opsætter den nye Facebook like-boks.

Opsæt Facebook Page Plugin på din blog

Start her. ”Facebook Page Plugin” er udskiftningen for, hvad der tidligere var kendt som ”Facebook Like-boksen”, som tillader dig at promovere din Facebook-side direkte på din blog. Det nye design fremviser din Facebook-sides coverbillede samt dertilhørende knapper.

Det første du skal gøre er, at besøge Facebook Page Plugin her, hvor du skal indtaste URL’en på din Facebook-side.

2. Opsæt Facebook Page Plugin til din WordPress blog

Du har mulighed for at tilrette både højde og brede for, at få boksen til at passe præcis på din blog. Herudover har du en række indstillinger som fremvisning af ansigt, fremvisning af coverbillede samt fermvisning af mindre coverbillede.

Hvor Facebook Page Plugin afskiller sig fra tidligere er, når du skal indsætte koden på din blog. Det er nu ikke længere muligt at indsætte én kode – f.eks. direkte i en sidebar. Du skal nu indsætte en kode direkte i din header samt en kode der, hvor du ønsker selve boksen.

3. Koden fra Facebook Page plugin

Den første kode skal du indsætte i din header.php-fil efter <body> -tagget. Har dit tema et ”child theme”, så vil det være bedst at indsætte koden heri, da denne ellers vil forsvinde hvis/når du opdaterer dit tema (kan dog altid indsætte igen, hvis du ikke har et ”child theme”).

Du finder header.php under Appearance -> Editor.

4. indsættelse af kode i header

Næste skridt er, at indsætte den sidste kode hvor du ønsker at fremvise boksen. Dette kan eksempelvis være i din sidebar, hvor koden indsættes som widget, hvilket du kan gøre under Appearance -> Widgets. (jf. billedet herunder).

5 Indsættelse af koden i widget

Efterfølgende er der ikke andet tilbage, end at besøge din blog og se resultatet. En af de ting du hurtigt vil opleve ved den nye bokse er (udover designet), at den ikke nedsætter hastigheden på din blog. Dette sker fordi selve boksen loades hurtigere samt asynkront (dvs. efter alt det vigtige er loadet).

Har du spørgsmål til den nye boks, eller problemer med opsætning, så læg en kommentar herunder.

Nicolaj Nielsen

Mit navn er Nicolaj Nielsen og jeg er den primære skribent her på Unitate. Jeg forsøger med en lang række guides, at lære nye og eksisterende bloggere omkring emner som SEO, WordPress, Design samt diverse optimeringsmuligheder. Læs f.eks. hvordan du laver en blog, hvordan man får styr på SEO samt mange andre guides.

Latest posts by Nicolaj Nielsen (see all)

Sådan tilføjer du den nye Facebook Page Plugin til din blog
Tagged on:

8 thoughts on “Sådan tilføjer du den nye Facebook Page Plugin til din blog

  • July 21, 2015 at 9:40 am
    Permalink

    Tak for god vejledning til sådan nogle som jeg, der endnu ikke er helt skarp i kodning. Jeg har et spørgsmål vedr. child themes (ved godt at det måske ikke lige hører ind her!) Jeg har oprettet et child theme ved brug af det plugin der hedder Orbisus Child Theme Creator. Når jeg åber theme editoren så har jeg ikke style.css indholdet fra parent theme, men kun dette her:
    /*
    Theme Name: Stained Glass Child 03
    Theme URI:
    Description: Child 03 theme for the Stained Glass theme
    Author: Cats_456
    Author URI:
    Template: stained-glass
    Version: 1.0.8
    */

    /* Generated by Orbisius Child Theme Creator (http://club.orbisius.com/products/wordpress-plugins/orbisius-child-theme-creator/) on Mon, 20 Jul 2015 07:11:19 +0000 */

    @import url(‘../stained-glass/style.css’);

    Er det meningen, at jeg skal copy/paste hele style.css fra parent theme over i child theme?

    Jeg har også en “Style Sheet Editor” via Jetpack, og her står der endnu mindre!! Nemlig kun:
    /*
    Velkommen til Custom CSS!

    For mere info, se http://wp.me/PEmnE-Bt
    */

    Kunne jeg f.eks. også her copy/paste hele style.css fra parent theme over eller hvordan fungerer det egentlig?

    På forhånd tak for hjælpen 🙂

    Connie Friis-Holst

    Reply
    • July 22, 2015 at 7:10 am
      Permalink

      Hej Connie

      Godt spørgsmål, som jeg tror mange står med når de laver sådanne child themes. Det korte svar er ja, men alligevel nej. Du kan sagtens kopiere alt indhold fra style.css til den nye style.css i child theme, men det er ikke en god ide, da en opdatering af den oprindelig fil (når udvikleren kommer med en opdatering hertil), ikke vil påvirke dit tema.

      Child theme virker således, at du indsætter det “ekstra” du ønsker at tilføje, og når temaet så bliver opdateret så forsvinder dette ikke igen. Det som der sker er så, at først bliver dit oprindelige tema loadet, og efterfølgende tages det “ekstra” som man finder i child theme. Har du et tema som aldrig får opdateringer til style.css, så kan du selvfølgelig gøre hvad du ønsker her, men igen, det er ikke den “rigtig” måde at benytte et child theme på 🙂

      Håber dette var forklaring nok 🙂

      Reply
      • July 22, 2015 at 4:31 pm
        Permalink

        Hej Nicolaj,
        Super! Og tusinde tak for hurtig respons. Jeg tænkte godt, at det ikke var meningen, at jeg skulle kopiere alt over i mit child theme – grunden til, at jeg blev lidt i tvivl er, når man f.eks. i et supportforum får en kode, som skal indsættes i style.css – der har jeg tænkt, at den skulle indsættes et specifikt sted, og det har jeg jo ikke kunne, da mit style.css i child theme’et har været “tomt” stort set. Men nu indsætter jeg bare koden efter din anvisning, og så håber jeg, at jeg har gjort det korrekt 🙂

        Rigtig god aften, og tak for nogle super gode tips herinde!

        Hilsen
        Connie

        Reply
        • July 23, 2015 at 9:27 am
          Permalink

          Hej Connie

          Godt du kunne bruge hjælpen. I style.css skal du ikke tænke over, hvor koden skal stå, og du kan derfor blot indsætte den kode du har fået 🙂
          Det er kun i andre WordPress-filer det er vigtigt, at du retter det rigtige sted.

          Reply
    • July 5, 2016 at 12:51 am
      Permalink

      Godt du kunne bruge den Maria 🙂

      Reply
  • September 29, 2017 at 8:24 am
    Permalink

    Hejsa
    Har sat Facebook page plugin i footer ved at bruge koden ovenover genereret som iframe koden OG det virker osse perfekt så længe jeg er loget ind som admin og siden bliver vist – MEN lige så snart jeg loger ud viser pluginet facebooks demo standard facebookside….Hvad skyldes mon dette ? – pt har jeg istedet blot indsat like plugin – men det ville være mere sejt hvis hele den ønskede Facebook side blev vist uden at man er logget ind først🤓
    Vh
    Hanne

    Reply
    • September 29, 2017 at 5:19 pm
      Permalink

      Nogle gang kan demo-versionen fremvises, indtil man besøger siden fra en “ren” browser. Prøv at besøge din blog fra en inkognito vindue.

      Reply

Leave a Reply

Your email address will not be published. Required fields are marked *