How can we help?
< All Topics
Print

Så här infogar (embed) du ditt Pressrum på din WordPress-webbplats

Det finns några olika sätt att bädda in ditt pressrum på din webbplats beroende på vilken editor (i WordPress) du använder. Här är hur du gör det med de vanligaste editorerna (redigerarna):

custom html

1. Infoga en iframe i Gutenberg Block Editor

Om du använder den nya WordPress Blockredigeraren (Gutenberg), följ dessa steg:

  • Öppna sidan eller inlägget där du vill infoga iframe.
  • Klicka på blockinfogaren (+) för att lägga till ett nytt block.
  • Sök efter Anpassad HTML och välj det.
  • I blocket för Anpassad HTML, klistra in din iframe-kod.

Här är ett exempel på koden:

<iframe src="https://pressroom.newsmachine.com" width="100%" height="1400"></iframe>

  • Du kan förhandsgranska genom att klicka på Förhandsgranska-knappen ovanför blocket.
  • Anpassa koden genom att justera bredd och höjd för att passa din design.

Exempel med extra anpassning:

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <style>
        #pressFrame { overflow: scroll; }
        #pressFrame::-webkit-scrollbar { width: 0px; height: 0px; }
        #pressFrame { scrollbar-width: none; }
        #pressFrame { -ms-overflow-style: none; }
    </style>
</head>
<body>
    <iframe id="pressFrame" src="https://pressroom.newsmachine.com/" width="100%" height="1500" frameborder="0" allowfullscreen></iframe>
    <script>
        function resize_frame(e) {
            if (e.origin === 'https://pressroom.newsmachine.com') {
                var data = JSON.parse(e.data);
                if (data['height']) {
                    $('#pressFrame').css('height', (data['height'] + 1));
                }
            }
        }
        if (window.addEventListener) {
            window.addEventListener('message', resize_frame);
        } else if (window.attachEvent) {
            window.attachEvent('onmessage', resize_frame, false);
        }
    </script>
</body>

2. Infoga en iframe i Classic Editor

Om du använder Classic Editor (eller en plugin som tillhandahåller den gamla redigeraren):

  • Gå till sid- eller inläggsredigeraren.
  • Växla från Visuellt läge till Textläge (HTML).

text editor
  • Klistra in din iframe-kod där du vill ha den.

Exempel:

<iframe src="https://pressroom.newsmachine.com" width="100%" height="1400"></iframe>

  • Växla tillbaka till Visuellt läge för att kontrollera placeringen.
  • Uppdatera eller publicera inlägget.

3. Använda en Shortcode-plugin

Om du är begränsad från att lägga till HTML eller använder vissa teman kan du använda en plugin för att infoga iframe.

  • Installera och aktivera en plugin som Shortcoder eller Iframe Embedder.
  • Efter aktivering kan du skapa shortcodes som omsluter iframe-koden eller använda widgets för att bädda in den utan att redigera HTML.

4. Infoga en iframe med Elementor

elementor code

Om du använder Elementor kan du enkelt lägga till en iframe.

Metod 1: Använda HTML-widgeten

  • Öppna sidan eller inlägget i Elementor.
  • Klicka på Redigera med Elementor.
  • Sök efter HTML-widgeten i vänsterpanelen.
  • Dra och släpp HTML-widgeten till önskad sektion.
  • Klistra in din iframe-kod, t.ex.:

<iframe src="https://pressroom.newsmachine.com" width="100%" height="1400"></iframe>
  • Du ser direkt iframe-innehållet i Elementor.

Metod 2: Använda Elementor Shortcodes

  • Sök efter Shortcode-widgeten.
  • Dra widgeten till önskad sektion.
  • Lägg till iframe-koden i shortcode-fältet om din webbplats stöder det.

5. Infoga en iframe med Divi Editor

Metod 1: Använda kodmodulen

Divi har en Kodmodul där du kan infoga HTML, JavaScript och CSS.

  • Öppna sidan eller inlägget i Divi.
  • Klicka på Redigera med Divi Builder.
  • Välj Kodmodul från listan.

divi code
  • Klistra in din iframe-kod:

<iframe src="https://pressroom.newsmachine.com" width="100%" height="1400"></iframe>
  • Iframe-innehållet kommer att visas direkt i modulen.

Metod 2: Använda Textmodulen

Om du vill infoga en iframe i text kan du använda Textmodulen.

  • Klicka på + för att lägga till en Textmodul.
  • Växla till Textläge och klistra in iframe-koden.
  • Växla tillbaka till Visuellt läge för att förhandsgranska.

Extra tips

1. Responsivt iframe i Divi

För att säkerställa att iframe är responsivt kan du lägga till anpassad CSS i Divi Avancerat > Anpassad CSS eller Divi Temaalternativ > Anpassad CSS.

2. Iframe-blockering

Vissa teman och plugins kan blockera iframe av säkerhetsskäl. Om du har problem kan du:

  • Justera säkerhetsinställningarna.
  • Använda en plugin som stöder iframe-inbäddning.

Etiketter:
Table of Contents