{"id":408,"date":"2014-02-05T18:26:27","date_gmt":"2014-02-05T18:26:27","guid":{"rendered":"http:\/\/engage.augsburg.edu\/mannj\/?p=408"},"modified":"2016-01-19T10:29:07","modified_gmt":"2016-01-19T15:29:07","slug":"embedding-things-on-your-site","status":"publish","type":"post","link":"https:\/\/engage.augsburg.edu\/mannj\/2014\/02\/05\/embedding-things-on-your-site\/","title":{"rendered":"Embedding things on your site"},"content":{"rendered":"<h2>Embed HTML code<\/h2>\n<p>You may find yourself needing to embed something on your page. You have a chunk of HTML code. This could be for a variety of purposes:<!--more--><\/p>\n<ul>\n<li>Web forms<\/li>\n<li>Facebook feed<\/li>\n<li>RSS reader<\/li>\n<li>Third-party widget<\/li>\n<\/ul>\n<p>If you need to embed a chunk of HTML code on your web page, start by logging into your page. You will probably be on the Visual editor by default. Switch to the Text editor by clicking on the &#8220;Text&#8221; tab:<\/p>\n<p><a href=\"http:\/\/engage.augsburg.edu\/mannj\/2014\/02\/05\/embedding-things-on-your-site\/visualeditor\/\" rel=\"attachment wp-att-409\"><img loading=\"lazy\" class=\"size-full wp-image-409 alignnone\" style=\"border: 1px solid black;\" title=\"visualeditor\" src=\"http:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/visualeditor.png\" alt=\"\" width=\"471\" height=\"89\" srcset=\"https:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/visualeditor.png 471w, https:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/visualeditor-300x56.png 300w\" sizes=\"(max-width: 471px) 100vw, 471px\" \/><\/a><\/p>\n<p>Go to the place on the page where you want to put your embed code, and paste the code there.<\/p>\n<p><a href=\"http:\/\/engage.augsburg.edu\/mannj\/2014\/02\/05\/embedding-things-on-your-site\/embed-form1\/\" rel=\"attachment wp-att-416\"><img loading=\"lazy\" class=\"alignnone size-large wp-image-416\" style=\"border: 1px solid black;\" title=\"embed-form1\" src=\"http:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/embed-form1-491x500.png\" alt=\"\" width=\"491\" height=\"500\" srcset=\"https:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/embed-form1-491x500.png 491w, https:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/embed-form1-294x300.png 294w, https:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/embed-form1.png 720w\" sizes=\"(max-width: 491px) 100vw, 491px\" \/><\/a><\/p>\n<p>Update your page and you should see the product of your embed code displaying there.<\/p>\n<p><a href=\"http:\/\/engage.augsburg.edu\/mannj\/2014\/02\/05\/embedding-things-on-your-site\/embed-form2\/\" rel=\"attachment wp-att-417\"><img loading=\"lazy\" class=\"alignnone size-large wp-image-417\" style=\"border: 1px solid black;\" title=\"embed-form2\" src=\"http:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/embed-form2-395x500.png\" alt=\"\" width=\"395\" height=\"500\" srcset=\"https:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/embed-form2-395x500.png 395w, https:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/embed-form2-237x300.png 237w, https:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/embed-form2.png 716w\" sizes=\"(max-width: 395px) 100vw, 395px\" \/><\/a><\/p>\n<p>The important thing to know is this: <strong>you must be in the Text view to paste HTML code<\/strong>. If you paste HTML code in the Visual editor, the HTML code itself will display on your page, not the widget or form or whatever it is that the HTML code is supposed to produce.<\/p>\n<h2>Embedding from social media<\/h2>\n<p>WordPress allows you to easily embed from social media without using any special code. Simply put the URL on your page, on its own line, without any hyperlink or special formatting, like this:<\/p>\n<p><a href=\"http:\/\/engage.augsburg.edu\/mannj\/2014\/02\/05\/embedding-things-on-your-site\/fbposteditor\/\" rel=\"attachment wp-att-413\"><img loading=\"lazy\" class=\" wp-image-413 alignnone\" style=\"border: 1px solid black;\" title=\"fbposteditor\" src=\"http:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/fbposteditor-500x238.png\" alt=\"\" width=\"450\" height=\"214\" srcset=\"https:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/fbposteditor-500x238.png 500w, https:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/fbposteditor-300x143.png 300w, https:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/fbposteditor.png 635w\" sizes=\"(max-width: 450px) 100vw, 450px\" \/><\/a><\/p>\n<p><a href=\"http:\/\/engage.augsburg.edu\/mannj\/2014\/02\/05\/embedding-things-on-your-site\/youtube-video-embed\/\" rel=\"attachment wp-att-414\"><img loading=\"lazy\" class=\"size-full wp-image-414 alignnone\" style=\"border: 1px solid black;\" title=\"youtube-video-embed\" src=\"http:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/youtube-video-embed.png\" alt=\"\" width=\"413\" height=\"129\" srcset=\"https:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/youtube-video-embed.png 413w, https:\/\/engage.augsburg.edu\/mannj\/files\/2014\/02\/youtube-video-embed-300x93.png 300w\" sizes=\"(max-width: 413px) 100vw, 413px\" \/><\/a><\/p>\n<p>Update your page and you should see your YouTube video or Facebook post or whatever it is embedded beautifully on your page. You can use this method for<\/p>\n<ul>\n<li>YouTube<\/li>\n<li>Twitter<\/li>\n<li>Facebook<\/li>\n<li>Instagram<\/li>\n<li>Vimeo<\/li>\n<li>Flickr<\/li>\n<li>Soundcloud<\/li>\n<li>and more!<\/li>\n<\/ul>\n<div><span style=\"font-size: medium;\"><span style=\"line-height: 24px;\">Note that this method is only good for embedding a single video or single post. It cannot be used to embed any kind of active feed. In other words, you can embed a single Tweet but not the feed for your Twitter account. You can, however, embed a YouTube playlist.<\/span><\/span><\/div>\n<div><\/div>\n<h2>When not to embed<\/h2>\n<p>Be smart about what you embed on your page. Here are some tips to follow:<\/p>\n<ul>\n<li><strong>Trust<\/strong> &#8211; Only embed widgets or feeds from websites or organizations you trust.<\/li>\n<li><strong>Is it helpful to the user?<\/strong> &#8211; Embedding a Facebook widget can a good alternative to simply adding a link to your Facebook page because someone can become a fan right from the widget, rather than having to go to Facebook.<\/li>\n<li><strong>Is it relevant?<\/strong> &#8211; Embedding a Facebook feed for your organization helps your visitors see your recent activity and gives them an opportunity to connect to your organization through social media. But a widget showing the local weather conditions? That&#8217;s not relevant. They&#8217;re not going to your site to find out about the weather&#8211;they know where to get that information.<\/li>\n<li><strong>Avoid clutter<\/strong> &#8211; Just because you <em>can<\/em> have a widget on your page doesn&#8217;t mean you <em>should<\/em>.<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Embed HTML code You may find yourself needing to embed something on your page. You have a chunk of HTML code. This could be for a variety of purposes:<\/p>\n","protected":false},"author":112,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[5,7],"tags":[],"_links":{"self":[{"href":"https:\/\/engage.augsburg.edu\/mannj\/wp-json\/wp\/v2\/posts\/408"}],"collection":[{"href":"https:\/\/engage.augsburg.edu\/mannj\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/engage.augsburg.edu\/mannj\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/engage.augsburg.edu\/mannj\/wp-json\/wp\/v2\/users\/112"}],"replies":[{"embeddable":true,"href":"https:\/\/engage.augsburg.edu\/mannj\/wp-json\/wp\/v2\/comments?post=408"}],"version-history":[{"count":8,"href":"https:\/\/engage.augsburg.edu\/mannj\/wp-json\/wp\/v2\/posts\/408\/revisions"}],"predecessor-version":[{"id":992,"href":"https:\/\/engage.augsburg.edu\/mannj\/wp-json\/wp\/v2\/posts\/408\/revisions\/992"}],"wp:attachment":[{"href":"https:\/\/engage.augsburg.edu\/mannj\/wp-json\/wp\/v2\/media?parent=408"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/engage.augsburg.edu\/mannj\/wp-json\/wp\/v2\/categories?post=408"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/engage.augsburg.edu\/mannj\/wp-json\/wp\/v2\/tags?post=408"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}