DesignPlus

<p>TCD Google Maps provides a simple shortcode to display the Google Maps.<br />
You can display various styles of GoogleMaps just put a shortcode to posts, pages, or Text Widget.</p>
<h3>Various Design</h3>
<h3>Convenient short code</h3>
<h3>Easy to set up</h3>
<h3>Arbitrary section</h3>
<h3>プラグインのダウンロード方法や使用方法について</h3>
<ol>
<li><a href="http://design-plus1.com/tcd-w/2016/01/googlemap.html#TCD_Google_Maps" rel="nofollow ugc">「TCD Google Maps」でこんなことが出来ます！</a>  </li>
<li><a href="http://design-plus1.com/tcd-w/2016/01/googlemap.html#TCD_GoogleMap" rel="nofollow ugc">プラグインのインストール方法</a>  </li>
<li><a href="http://design-plus1.com/tcd-w/2016/01/googlemap.html#TCD_Google_Maps-2" rel="nofollow ugc">プラグインの設定方法</a>  </li>
<li><a href="http://design-plus1.com/tcd-w/2016/01/googlemap.html#i" rel="nofollow ugc">記事への設置方法</a>  </li>
</ol>
<p>詳しい説明は <a href="http://design-plus1.com/tcd-w/2016/01/googlemap.html" rel="nofollow ugc">こちらのリンク</a> をご覧ください。</p>


TCD Google Maps

webvitalii

<ul>
<li><strong><a href="https://r.freemius.com/13759/8047958/" title="Advanced iFrame" rel="nofollow ugc">Advanced iFrame</a></strong></li>
<li><strong><a href="http://web-profile.net/wordpress/plugins/iframe/" title="Plugin page" rel="nofollow ugc">iframe</a></strong></li>
<li><strong><a href="http://web-profile.net/donate/" title="Support the development" rel="nofollow ugc">Donate</a></strong></li>
<li><strong><a href="https://github.com/webvitalii/iframe" title="Fork" rel="nofollow ugc">GitHub</a></strong></li>
</ul>
<p>[iframe src=”http://www.youtube.com/embed/7_nAZQt9qu0″ width=”100%” height=”500″] shortcode<br />
should show something like this:</p>
<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/7_nAZQt9qu0?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span>
<p>WordPress removes iframe html tags because of security reasons.<br />
Iframe shortcode is the replacement of the iframe html tag and accepts the same params as iframe html tag does.<br />
You may use iframe shortcode to embed content from YouTube, Vimeo, Google Maps or from any external page.</p>
<p>If you need to embed content from YouTube, Vimeo, SlideShare, SoundCloud, Twitter via direct link, you may use <code>[embed]http://www.youtube.com/watch?v=7_nAZQt9qu0[/embed]</code> shortcode.<br />
[embed] shortcode is a core WordPress feature and can <a href="https://codex.wordpress.org/Embeds" rel="nofollow ugc">embed content from many resources via direct link</a>.</p>
<p><strong>Important</strong>: You can not embed HTTP pages into HTTPS pages and vice versa.<br />
So the protocol (http or httpS) for parent and embedded page should match.</p>
<h4>iframe params:</h4>
<ul>
<li><strong>src</strong> – source of the iframe: <code>[iframe src="http://www.youtube.com/embed/7_nAZQt9qu0"]</code>; by default src=”http://www.youtube.com/embed/7_nAZQt9qu0″;</li>
<li><strong>width</strong> – width in pixels or in percents: <code>[iframe width="100%"]</code> or <code>[iframe width="600"]</code>; by default width=”100%”;</li>
<li><strong>height</strong> – height in pixels: <code>[iframe height="500"]</code>; by default height=”500″;</li>
<li><strong>scrolling</strong> – with or without the scrollbar: <code>[iframe scrolling="no"]</code>; by default scrolling=”yes”;</li>
<li><strong>frameborder</strong> – with or without the frame border: <code>[iframe frameborder="0"]</code>; by default frameborder=”0″;</li>
<li><strong>marginheight</strong> – height of the margin: <code>[iframe marginheight="0"]</code>; removed by default;</li>
<li><strong>marginwidth</strong> – width of the margin: <code>[iframe marginwidth="0"]</code>; removed by default;</li>
<li><strong>allowtransparency</strong> – allows to set transparency of the iframe: <code>[iframe allowtransparency="true"]</code>; removed by default;</li>
<li><strong>id</strong> – allows to add the id of the iframe: <code>[iframe id="custom_id"]</code>; removed by default;</li>
<li><strong>class</strong> – allows to add the class of the iframe: <code>[iframe class="custom_class"]</code>; by default class=”iframe-class”;</li>
<li><strong>style</strong> – allows to add the css styles of the iframe: <code>[iframe style="margin-left:-30px;"]</code>; removed by default;</li>
<li><strong>same_height_as</strong> – allows to set the height of iframe same as target element: <code>[iframe same_height_as="div.sidebar"]</code>, <code>[iframe same_height_as="div#content"]</code>, <code>[iframe same_height_as="body"]</code>, <code>[iframe same_height_as="html"]</code>; removed by default;</li>
<li><strong>any_other_param</strong> – allows to add new parameter of the iframe <code>[iframe any_other_param="any_value"]</code>;</li>
<li><strong>any_other_empty_param</strong> – allows to add new empty parameter of the iframe (like “allowfullscreen” on youtube) <code>[iframe any_other_empty_param=""]</code>;</li>
</ul>


iframe

[iframe src="http://www.youtube.com/embed/7_nAZQt9qu0" width="100%" height="500"] shortcode

TCD Google Maps vs iframe