Support » Thema en CSS/opmaak » Hoe embed of zet je een widget in een iframe?

  • Mijn bedoeling is om customer reviews te plaatsen op mijn website.
    Hoe kan ik vervolgens een review van een bijvoorbeeld een product embedden of in een iframe weergeven op een andere website.
    Ik heb al geprobeerd om een shortcode op een lege pagina te plaatsen en vervolgens deze pagina via een iframe code op een andere pagina weer te laten geven.
    Het gevolg is alleen dat de hele pagina wordt weergegeven en ik alleen de bewuste widget die in een tekstveld is gezet wil weergeven zonder scroll balken en dat hij zich automatisch aanpast aan het formaat van het tekstveld waar deze in weergegeven moet worden.
    Voorbeeld is zoals je youtube video’s kunt embedden.
    Hier bij kan je eenvoudig het formaat aanpassen en de video zoomed automatisch mee zonder dat er scroll balken ontstaan.

    Alvast bedankt.

7 reacties aan het bekijken - 1 tot 7 (van in totaal 7)
  • Hello!

    Is het je al gelukt? En anders om welke website gaat het en heb je een voorbeeld? Ik denk dat je het beste een class kan toevoegen aan de iframe en die vervolgens zo instelt dat je geen scrollbalken hebt en het juiste formaat geeft!

    Thread starter logictrust

    (@logictrust)

    Het is nog niet gelukt en met zoeken op het internet kom ik niet veel verder.

    Ik heb een widget op http://www.logictrust.nl/reviewwinkel
    Deze heb ik met een iframe code op een andere pagina gezet om te testen.
    De pagina waar de iframe staat is http://www.logictrust.nl/iframe

    Volgende iframe code heb ik gebruikt

    <iframe
    src=”http://www.logictrust.nl/reviewwinkel&#8221; height=”300″ width=”200″ frameborder=”1″ scrolling=”no”>You need an iframes capable browser to view this content.</iframe>

    Ik zou dus graag de widget van de reviewwinkel pagina weer willen geven op een ander pagina of website.
    Daar bij moet alleen de widget zichtbaar zijn en niet de rest van de pagina.

    Beide pagina’s zijn om het een en ander te testen.

    Alvast bedankt voor de hulp.

    Het is een beetje gek, je zegt dat je de iframe op de pagina hebt gezet.
    Maar als ik kijk zie ik hem staan in een widget kan dat kloppen?
    Die is niet breed genoeg dus dan kun je hem niet zo groot maken als in de reviewwinkel pagina.

    Ik zou deze code gebruiken voor de iframe:

    <iframe
    src="http://www.logictrust.nl/reviewwinkel" height="300" id="iframetestt" frameborder="1" scrolling="no">You need an iframes capable browser to view this content.</iframe>

    Daarbij heb ik id=”iframetestt” toegevoegd en de width even weggehaald.

    In de style.css kun je dan volgende code toevoegen:

    iframe#iframetestt {
        width: 100%;
        border: 0;
        margin-bottom:-8px;
    }

    Daar zou ik mee beginnen 🙂 Dan kan je door de ID in de CSS het een en ander gaan aanpassen zodat het iframe uiteindelijk zo komt te staan zoals jij dat wil!

    Thread starter logictrust

    (@logictrust)

    Ik had inderdaad de iframe code in een tekstwidget geplaatst.

    Op de pagina http://www.logictrust.nl/iframe even een nieuwe tekstwidget geplaatst en de nieuwe iframecode hier in gezet.
    En vanuit pagina bewerken in de widget bij css de style toegevoegd.

    Het begint er op te lijken maar het moet toch mogelijk zijn dat de getoonde info zich automatisch aanpast naar de grote van de iframe.
    Zoals ik op de pagina een video heb staan van youtube.
    In die code kan ik eenvoudig de hoogte en wijdte aanpassen en de video past zich dan ook automatisch aan.

    Als je hem zo er in zet staat hij best netjes volgens mij:

    <iframe src="http://www.logictrust.nl/reviewwinkel" height="300" id="iframetestt" frameborder="0" width="500" scrolling="no">You need an iframes capable browser to view this content.</iframe>

    Omdat je hem in een widget zet in niet in een pagina houd hij zich vast aan een bepaalde breedte. Pas als je die overschrijd lijkt hij groter te worden!

    Maar het is niet zo dat de review 1000px breed word als hij dat in het origineel ook niet is. Dat werkt anders bij video’s als bij dit soort dingen volgens mij.

    Thread starter logictrust

    (@logictrust)

    Ik ben er nog niet uit maar heb een goed voorbeeld.
    Op mijn testpagina http://www.logictrust.nl/iframe heb ik 3 tekstvelden staan die even groot zijn.

    Op de eerste heb ik deze iframe geplaatst

    <iframe style=”background-color: white;” src=”https://www.kiyoh.nl/widget.php?company=7777&#8243; height=”292″ width=”226″></iframe>

    Hier wordt de inhoud duidelijk naar dit formaat gezoomed.
    De website van de content is: http://www.kiyoh.nl/widget.php?company=7777

    Op de 2e mijn eigen test review en op de derde een embed van een youtube video.

    Hoe kan het dat op veld 1 alles gezoomed wordt naar de gekozen afmeting
    en op de 2e niet?

    Ben benieuwd of we er uit kunnen komen.

    Volgens mij klopt het de onderste iframe niet omdat daar de CSS anders is als in de eerste die zich automatisch aanpast.

    Daar word er gewerkt met breedtes van 95% terwijl in het onderste iframe de cijfers een breedte hebben van 30%.

    30% van zo een kleine ruimte dat past gewoonweg niet.
    Dan zou je het beste een extra stukje CSS er in kunnen zetten, zoiets bijvoorbeeld:

    .wp-review-bank-desc_total {width: 45%!important;}

    Dan laat hij de cijfers onderin wel zien 🙂

7 reacties aan het bekijken - 1 tot 7 (van in totaal 7)
  • Het onderwerp ‘Hoe embed of zet je een widget in een iframe?’ is gesloten voor nieuwe reacties.