WordPress ist derzeit eine der gr??ten CMS- und Blogging -Plattformen. Aber warum ist das so? WordPress wurde in den letzten Jahren viel kritisiert. Eines der gr??ten Themen ist, dass die Architektur nicht so modern ist, wie sie auch sein k?nnte. Die Art und Weise, wie die Plattform (oder CMS) im Jahr 2004 geschrieben wurde, unterscheidet sich von den Standards, die wir heute sehen. Trotzdem besteht kein Zweifel, dass es für Endbenutzer sehr einfach zu bedienen ist.

Endbenutzer wollen ein CMS, mit dem Inhalte einfach ver?ffentlichen k?nnen. Ich glaube, dass die meisten Benutzer ihre Inhalte nicht harten m?chten. Wenn ein Kunde mich fragt: ?Ich m?chte einige Inhalte von Slideshare hinzufügen“, ist mein Verstand zu REST -APIs oder zumindest einbetten Codes. Heute werden wir uns eine Funktion von WordPress ansehen, die Sie wahrscheinlich verwendet haben, ohne es zu wissen.

Key Takeaways

• OEMbed ist ein Protokoll, das eine einfache Einbettung von Inhalten in eine Website erm?glicht und über eine Verbraucher- und Anbieterbeziehung funktioniert. Es gibt vier Arten von Ressourcen an - Foto, Video, Links und Rich -, die alle eine URL, Breite und H?he in ihrer Antwort bieten.
• WordPress hat eine integrierte Unterstützung für OEMbed mit einer Liste von Whitelisted Anbietern. Durch einfaches Einfügen einer URL von einem whitelisteten Anbieter beim Erstellen eines Beitrags oder einer Seite holt WordPress das Einbett -HTML automatisch und zeigt sie im Beitrag an. Benutzer k?nnen auch manuell zus?tzliche Anbieter hinzufügen.
• über seine Einfachheit für Endbenutzer hinaus ist OEMbed ein flexibles Werkzeug innerhalb von WordPress. Benutzer k?nnen mit der Whitelist experimentieren, sie mit ihren eigenen Anbietern erweitern und sogar das Erscheinungsbild ihrer OEMbeds anpassen. WordPress bietet auch Funktionen zur Registrierung einer Website, die OEMbed und zum Hinzufügen von OEMBED -Unterstützung zu einer Site unterstützt.

Einführung in Oembed

OEMbed ist eine unglaublich einfache M?glichkeit, Inhalte in Ihre Website einzubetten. OEMbed besteht aus einem Verbraucher und einem Anbieter. Der Anbieter bietet Ressourcen an, die in den Verbraucher eingebettet werden k?nnen, und der Verbraucher fordert diese Ressourcen über den OEMBED -Endpunkt an.

Die OEMBED -Implementierung gibt 4 Arten von Ressourcen an:

• Foto
• Video
• Links
• reich

Das Foto, Video und ein reicher Typ sollten in ihrer Antwort eine URL, eine Breite und H?he bereitstellen. Die Anbieter k?nnen auch andere Daten einbeziehen, aber diese sind alles, was bei der Behandlung dieser Art von Inhalten erforderlich ist. Die OEMBED -Spezifikation ist eine Richtlinie, die Anbieter k?nnen ihre eigene Umsetzung von OEMbed durchführen. Der Anbieter sollte mindestens einen OEMbed -Endpunkt und eine Ressourcen -URL haben.

Schauen wir uns die Slideshare an und sehen, wie sie OEMbed implementiert haben.

In ihrer Dokumentation geben sie den OEMBED -Endpunkt und den Ressourcenendpunkt an. Der OEMBED -Endpunkt ist: http://www.slideshare.net/api/oembed/2. Der Ressourcenendpunkt sieht ungef?hr so ??aus: http://www.slideshare.net/user-slug/slidename-slug. Um die Informationen vom Anbieter zu erhalten, sollten wir den OEMBED -Endpunkt verwenden und einen URL -Parameter der Ressource übergeben. Die Parameter sollten URL codiert werden. Die minimale Anforderung ist der URL -Parameter, aber Sie k?nnen auch maxwidth , maxheight und das Format übergeben. Es h?ngt wirklich vom Inhaltsformat ab, aber für Video, Foto und reichhaltiges Format haben Sie die M?glichkeit, diese Argumente zu übergeben. Oembed gibt auch nur die GET -Methode an, sodass Sie andere Methoden nicht anwenden k?nnen.

Stellen wir mit dem URL -Parameter eine Anforderung an diesen Endpunkt an.

<span><span><span><oembed</span>></span>
</span>  <span><span><span><total-slides</span> type<span>="integer"</span>></span>50<span><span></total-slides</span>></span>  
</span>  <span><span><span><thumbnail-width</span> type<span>="integer"</span>></span>170<span><span></thumbnail-width</span>></span>
</span>  <span><span><span><width</span> type<span>="integer"</span>></span>425<span><span></width</span>></span>
</span>  <span><span><span><type</span>></span>rich<span><span></type</span>></span>
</span>  <span><span><span><provider-name</span>></span>SlideShare<span><span></provider-name</span>></span>
</span>  <span><span><span><slideshow-id</span> type<span>="integer"</span>></span>41489102<span><span></slideshow-id</span>></span>
</span>  <span><span><span><provider-url</span>></span>http://www.slideshare.net<span><span></provider-url</span>></span>
</span>  <span><span><span><slide-image-baseurl</span>></span>//image.slidesharecdn.com/wordpress-themes-wpmelb-2014-141112215416-conversion-gate02/95/slide-<span><span></slide-image-baseurl</span>></span>
</span>  <span><span><span><version</span>></span>1.0<span><span></version</span>></span>
</span>  <span><span><span><conversion-version</span> type<span>="integer"</span>></span>2<span><span></conversion-version</span>></span>
</span>  <span><span><span><html</span>></span><span><span><iframe</span> src<span>="http://www.slideshare.net/slideshow/embed_code/41489102"</span> width<span>="427"</span> height<span>="356"</span> frameborder<span>="0"</span> marginwidth<span>="0"</span> marginheight<span>="0"</span> scrolling<span>="no"</span> <span>style<span>="<span>border:1px solid #CCC; border-width:1px; margin-bottom:5px; max-width: 100%;</span>"</span></span> allowfullscreen></span> <span><span></iframe</span>></span> <span><span><div</span> <span>style<span>="<span>margin-bottom:5px</span>"</span></span>></span> <span><span><strong</span>></span> <span><span><a</span> href<span>="https://www.slideshare.net/chris-burgess/wordpress-themeswpmelb2014"</span> title<span>="WordPress Themes Demystified"</span> target<span>="_blank"</span>></span>WordPress Themes Demystified<span><span></a</span>></span> <span><span></strong</span>></span> from <span><span><strong</span>></span><span><span><a</span> href<span>="http://www.slideshare.net/chris-burgess"</span> target<span>="_blank"</span>></span>Chris Burgess<span><span></a</span>></span><span><span></strong</span>></span> <span><span></div</span>></span>
</span>  <span><span><span></html</span>></span>
</span>  <span><span><span><author-name</span>></span>Chris Burgess<span><span></author-name</span>></span>
</span>  <span><span><span><title</span>></span>WordPress Themes Demystified<span><span></title</span>></span>
</span>  <span><span><span><height</span> type<span>="integer"</span>></span>355<span><span></height</span>></span>
</span><span><span><span></oembed</span>></span></span>

Wenn Sie nur den URL -Wert im Browser anfordern, erhalten Sie nur eine normale HTML -Seite. Etwas, das Sie jeden Tag sehen. SlideShare standardm??ig mit dem XML -Format, wenn kein anderes Format angefordert wird. Lassen Sie uns die Anfrage ein wenig ?ndern. Diesmal werden wir einen weiteren Parameter hinzufügen und eine JSON -Antwort erhalten.

<span>{
</span>
    <span>"author_url": "http://www.slideshare.net/chris-burgess",
</span>    <span>"total_slides": 50,
</span>    <span>"provider_name": "SlideShare",
</span>    <span>"version_no": "1415853027",
</span>    <span>"html": "<iframe src=\"http://www.slideshare.net/slideshow/embed_code/41489102\" width=\"427\" height=\"356\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\" style=\"border:1px solid #CCC; border-width:1px; margin-bottom:5px; max-width: 100%;\" allowfullscreen> </iframe> <div style=\"margin-bottom:5px\"> <strong> <a href=\"https://www.slideshare.net/chris-burgess/wordpress-themeswpmelb2014\" title=\"WordPress Themes Demystified\" target=\"_blank\">WordPress Themes Demystified</a> </strong> from <strong><a href=\"http://www.slideshare.net/chris-burgess\" target=\"_blank\">Chris Burgess</a></strong> </div>\n\n",
</span>    <span>"thumbnail_height": 128,
</span>    <span>"type": "rich",
</span>    <span>"slide_image_baseurl": "//image.slidesharecdn.com/wordpress-themes-wpmelb-2014-141112215416-conversion-gate02/95/slide-",
</span>    <span>"slide_image_baseurl_suffix": "-1024.jpg",
</span>    <span>"slideshow_id": 41489102,
</span>    <span>"title": "WordPress Themes Demystified",
</span>    <span>"version": "1.0",
</span>    <span>"height": 355,
</span>    <span>"provider_url": "http://www.slideshare.net",
</span>    <span>"thumbnail": "//cdn.slidesharecdn.com/ss_thumbnails/wordpress-themes-wpmelb-2014-141112215416-conversion-gate02-thumbnail.jpg?cb=1415853027",
</span>    <span>"conversion_version": 2,
</span>    <span>"author_name": "Chris Burgess",
</span>    <span>"thumbnail_width": 170,
</span>    <span>"width": 425
</span>
<span>}</span>

Versuchen Sie erneut, diese Ressource anzufordern, diesmal jedoch einen zus?tzlichen Parameter. Lassen Sie uns den Maxwidth-Parameter auf 200 einstellen und diese URL anfordern: http://www.slideshare.net/api/oembed/2?url=http://www.slideshare.net/chris-burgess/wordpress-THETHEMESWPMELB2014&format=json&max=json&max=json&max=json&max=json&max=json&max=json&maxdiMAxdim&maxdiMax=json&maxdiMaxpect=json&maxmax. 200, Sie sollten dieses Ergebnis erhalten:

<span>{
</span>
    <span>"conversion_version": 2,
</span>    <span>"version_no": "1415853027",
</span>    <span>"slide_image_baseurl_suffix": "-320.jpg",
</span>    <span>"html": "<iframe src=\"http://www.slideshare.net/slideshow/embed_code/41489102\" width=\"202\" height=\"168\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\" style=\"border:1px solid #CCC; border-width:1px; margin-bottom:5px; max-width: 100%;\" allowfullscreen> </iframe> <div style=\"margin-bottom:5px\"> <strong> <a href=\"https://www.slideshare.net/chris-burgess/wordpress-themeswpmelb2014\" title=\"WordPress Themes Demystified\" target=\"_blank\">WordPress Themes Demystified</a> </strong> from <strong><a href=\"http://www.slideshare.net/chris-burgess\" target=\"_blank\">Chris Burgess</a></strong> </div>\n\n",
</span>    <span>"total_slides": 50,
</span>    <span>"width": 200,
</span>    <span>"slide_image_baseurl": "//image.slidesharecdn.com/wordpress-themes-wpmelb-2014-141112215416-conversion-gate02/85/slide-",
</span>    <span>"thumbnail_height": 128,
</span>    <span>"thumbnail_width": 170,
</span>    <span>"thumbnail": "//cdn.slidesharecdn.com/ss_thumbnails/wordpress-themes-wpmelb-2014-141112215416-conversion-gate02-thumbnail.jpg?cb=1415853027",
</span>    <span>"provider_name": "SlideShare",
</span>    <span>"author_url": "http://www.slideshare.net/chris-burgess",
</span>    <span>"author_name": "Chris Burgess",
</span>    <span>"version": "1.0",
</span>    <span>"slideshow_id": 41489102,
</span>    <span>"type": "rich",
</span>    <span>"height": 167,
</span>    <span>"title": "WordPress Themes Demystified",
</span>    <span>"provider_url": "http://www.slideshare.net"
</span>
<span>}</span>

Wenn Sie die Breite des Iframe auf HTML -Schlüssel dieser Anfrage mit der vorherigen Anfrage vergleichen, sollten Sie einen Unterschied sehen. Der erste hatte eine Breite von 427 und die letzte hatte eine Breite von 202.

Wenn Sie mehr über die OEMBED -Spezifikation erfahren m?chten, schauen Sie sich die offiziellen OEMBED -Dokumente an. Schauen Sie sich auch die Dokumentation von Slideshare Oembed an und spielen Sie ein wenig damit, um besser zu verstehen, wie es funktioniert.

Warum dies nützlich ist

Vergessen wir für einen Moment die technische Implementierung. Bei WordPress geht es mehr um Endbenutzer. Die gesamte Implementierung der OEMBED -Spezifikation befindet sich innerhalb der WordPress -Codebasis. WordPress hat eine wei?e Liste aller unterstützten OEMBED -Anbieter. Dies sind nur einige von ihnen aus ihrer Whitelist.

WordPress macht es einfach, Inhalte aus dieser Whitelist einzubetten. Fügen Sie einfach die URL einer Ressource ein, wenn Sie einen Beitrag oder eine Seite erstellen.

Die URL sollte nur eine Zeile für sich sein. WordPress sucht nach diesem Link und sucht dann, um festzustellen, ob dieser Link eine Ressource für eine der Whitelisted -URLs ist. Wenn dies der Fall ist, dann ist es eine Anfrage an den OEMBED -Endpunkt. In diesem Beispiel habe ich eine Twitter -Status -URL und WordPress kopiert, die diesen Status für mich in den Beitrag eingebettet hat. Dies ist jedoch nicht nur auf Twitter begrenzt, suchen Sie nach anderen Websites im Whitelist und experimentieren Sie mit ihnen.

über die Whitelist hinaus wird jede OEMBED -Site von WordPress unterstützt. Sie k?nnen manuell zus?tzliche Anbieter hinzufügen. WordPress bietet zwei Funktionen, eine für die Registrierung einer Website, die OEMBED unterstützt, und eine, die wir hardcode k?nnen, um unserer Website OEMBED -Unterstützung hinzuzufügen. Verwenden Sie WP_OEMBED_ADD_PROVIDER (), um WordPress eine vorhandene OEMBED -Site hinzuzufügen. Sie k?nnen auch wp_embed_register_handler () verwenden, um eine Nicht-Aembed-Site hinzuzufügen. Oder wenn Sie wie ich sind, der es hasst, das Rad neu zu erfinden, k?nnen Sie auch prüfen, ob ein Plugin zuerst existiert.

Schlussfolgerung

OEMbed ist eine der handlichen WordPress -Funktionen, die Ihr Leben erleichtert. In diesem Artikel behandelten wir das, was OEMbed ist, wir haben uns die OEMBED -Spezifikationen angesehen und wie OEMbed und WordPress zusammenarbeiten. Aber h?r dort nicht auf. Experimentieren Sie mit der Whitelist und erweitern Sie es mit Ihren eigenen Anbietern.

h?ufig gestellte Fragen zu OEMbed und WordPress

Was ist OEMBED und wie funktioniert es mit WordPress? Inhalt. WordPress hat eine integrierte Unterstützung für OEMbed. Wenn Sie eine URL von einer Site einfügen, die OEMBED unterstützt, verwendet WordPress die API automatisch, um das Einbett HTML zu holen und in Ihrem Beitrag anzuzeigen. Dies beseitigt die Notwendigkeit, HTML von der Website zu kopieren und zu kleben, in der die Medien gehostet werden, die Sie einbetten m?chten. kann dies tun, indem ein Plugin wie deaktivierte Einbettungen oder OEMBED -Manager verwendet werden. Alternativ k?nnen Sie der Datei Ihres Themas ein paar Codezeilen für die Funktionen Ihres Themas hinzufügen, um OEMBED zu deaktivieren. Beachten Sie jedoch, dass dies alle Arten von Einbettungen deaktiviert. Dies kann durchgeführt werden, indem Ihrem Thema benutzerdefinierte CSS hinzugefügt werden. Das genaue CSS, das Sie ben?tigen, h?ngt von der Art der Einbettung und dem Design Ihres Themas ab. Es ist wichtig, Inhalte nur aus vertrauenswürdigen Quellen zu betten. Einige Websites k?nnen ihren OEMBED -Code m?glicherweise nicht ordnungsgem?? bereinigen, was m?glicherweise zu Sicherheitslücken führen k?nnte.

Warum funktioniert mein OEMbed nicht in WordPress? Die URL, die Sie einbetten m?chten, stammen m?glicherweise nicht von einer Website, die OEMBED unterstützt, oder es k?nnte einen Konflikt mit einem Plugin oder einem Thema bestehen. Wenn Sie Probleme haben, deaktivieren Sie alle Plugins und wechseln Sie zu einem Standardthema, um festzustellen, ob dies das Problem behebt. Sie k?nnen OEMBED mit benutzerdefinierten Post -Typen in WordPress verwenden. Sie müssen nur sicherstellen, dass der benutzerdefinierte Beitragstyp die Funktion "Editor" unterstützt. OEMBED -Anbieter mit der Funktion wp_oembed_add_provider (). Mit dieser Funktion k?nnen Sie das URL -Schema für den Anbieter und den Endpunkt angeben, mit dem WordPress die Einbettung html abrufen sollte. Sie k?nnen die Breite und H?he von OEMbeds in WordPress einschr?nken. Dies kann durch die Verwendung des Filterfilters embod_defaults erfolgen 24 Stunden, um die Leistung zu verbessern. Sie k?nnen diese Dauer jedoch mit dem OEMbed_Ttl -Filter ?ndern. Die Funktion WP_OEMBED_get (). Mit dieser Funktion k?nnen Sie die Einbettung HTML für eine URL abrufen und überall auf Ihrer Website anzeigen.

Das obige ist der detaillierte Inhalt vonEine Einführung in Oembed und WordPress. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!