{"id":281,"date":"2023-10-20T13:59:08","date_gmt":"2023-10-20T13:59:08","guid":{"rendered":"https:\/\/wpshortcode.org\/?p=281"},"modified":"2023-10-20T13:59:09","modified_gmt":"2023-10-20T13:59:09","slug":"amp","status":"publish","type":"post","link":"https:\/\/wpshortcode.org\/amp\/","title":{"rendered":"AMP Shortcode"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Below, you&#8217;ll find a detailed guide on how to add the <strong>AMP Shortcode<\/strong> to your WordPress website, including its <strong>parameters<\/strong>, <strong>examples<\/strong>, and <strong>PHP function code<\/strong>. Additionally, we&#8217;ll assist you with common issues that might cause the AMP Plugin shortcode not to show or not to work correctly.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Before starting, here is an overview of the AMP Plugin and the shortcodes it provides:<\/p>\n\n\n<p>    <div class=\"plugin-info-box\">\n        <div class=\"top-main\">\n            <!-- SVG Image -->\n            <div class=\"plugin-image\">\n                <img decoding=\"async\" src=\"https:\/\/ps.w.org\/amp\/assets\/icon.svg?rev=2527602\" alt=\"Plugin Icon\" \/>\n            <\/div>\n            \n            <div class=\"plugin-descriptive-part\">\n                <!-- Plugin Name with Link -->\n\n                    <a class=\"plugin-title\" href=\"https:\/\/wordpress.org\/plugins\/amp\" target=\"_blank\" rel=\"noopener\">\n                        AMP                    <\/a>\n\n\n                <!-- Plugin Description -->\n                <p class=\"plugin-description\">\n                    &quot;AMP is a powerful WordPress plugin that accelerates your website&#039;s performance on mobile devices. It optimizes your content, ensuring faster load times, enhanced SEO, and improved user experience.&quot;                <\/p>\n            <\/div>\n        <\/div>\n\n        <!-- Rating and Additional Info -->\n        <div class=\"plugin-meta\">\n            <span class=\"plugin-rating\">\n                <span class='stars'>\u2605\u2605\u2605\u2606\u2729<\/span> (355)\n            <\/span>\n            <span class=\"plugin-active-installs\">\n                <strong>Active Installs<\/strong>: 400000+\n            <\/span>\n            <span class=\"plugin-tested\">\n                <strong>Tested with<\/strong>: 6.3.2            <\/span>\n            <span class=\"plugin-php-version\">\n                <strong>PHP Version<\/strong>: 7.0            <\/span>\n        <\/div>\n\n        <!-- List of Included Shortcodes -->\n        <div class=\"plugin-shortcodes\">\n            <strong>Included Shortcodes:<\/strong>\n            <ul>\n                <li>[amp_playlist]<\/li>            <\/ul>\n        <\/div>\n    <\/div>\n    <\/p>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">AMP [amp_playlist] Shortcode<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">The AMP Plugin shortcode is a versatile tool that pulls data based on the attributes passed. It checks the &#8216;type&#8217; of data and returns either an audio or video playlist.\n\n \n\nThis code uses the &#8216;shortcode&#8217; function to determine if the &#8216;type&#8217; attribute is &#8216;audio&#8217; or &#8216;video&#8217;. If &#8216;audio&#8217;, it returns an audio playlist; if &#8216;video&#8217;, it returns a video playlist.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Shortcode<\/strong>: <code>[amp_shortcode]<\/code><\/p>\n\n\n\n<div style=\"height:5px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Parameters<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Here is a list of all possible amp_shortcode shortcode parameters and attributes:<\/p>\n\n\n<ul>\n<li><code>type<\/code> &#8211; defines the media type to be either &#8216;audio&#8217; or &#8216;video&#8217;<\/li>\n<li><code>data<\/code> &#8211; contains specific settings related to the media<\/li>\n<\/ul>\n\n\n<div style=\"height:5px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Examples and Usage<\/h3>\n\n\n<p><strong>Basic example<\/strong> &#8211; A simple usage of the shortcode to display an audio playlist.<\/p>\n\n\n<pre class=\"wp-block-code\"><code lang=\"php\" class=\"language-php\">[amp_playlist type=\"audio\" id=\"123\" \/]<\/code><\/pre>\n\n\n<p><strong>Advanced examples<\/strong><\/p>\n<p>Use the shortcode to display a video playlist by referencing the type and ID. The playlist will load based on the provided ID.<\/p>\n\n\n<pre class=\"wp-block-code\"><code lang=\"php\" class=\"language-php\">[amp_playlist type=\"video\" id=\"456\" \/]<\/code><\/pre>\n\n\n<p>Another advanced usage of the shortcode can be to display a specific audio playlist with additional parameters such as autoplay and loop. If these attributes are set to true, the audio will start playing automatically once the page loads and will loop once it ends.<\/p>\n\n\n<pre class=\"wp-block-code\"><code lang=\"php\" class=\"language-php\">[amp_playlist type=\"audio\" id=\"789\" autoplay=\"true\" loop=\"true\" \/]<\/code><\/pre>\n\n\n\n<div style=\"height:5px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">PHP Function Code<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">In case you have difficulties debugging what causing issues with <code>[amp_shortcode]<\/code> shortcode, check below the related PHP functions code.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Shortcode line<\/strong>:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"php\" class=\"language-php\">add_shortcode( self::SHORTCODE, [ $this, 'shortcode' ] );<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Shortcode PHP function<\/strong>:<\/p>\n\n\n<div class=\"wp-block-syntaxhighlighter-code \"><pre class=\"brush: php; light: false; title: ; toolbar: true; notranslate\" title=\"\">\nfunction shortcode( $attr ) {\n\t\t$data = $this-&gt;get_data( $attr );\n\n\t\tif ( isset( $data&#91;&#039;type&#039;] ) &amp;&amp; ( &#039;audio&#039; === $data&#91;&#039;type&#039;] ) ) {\n\t\t\treturn $this-&gt;audio_playlist( $data );\n\t\t}\n\n\t\tif ( isset( $data&#91;&#039;type&#039;] ) &amp;&amp; ( &#039;video&#039; === $data&#91;&#039;type&#039;] ) ) {\n\t\t\treturn $this-&gt;video_playlist( $data );\n\t\t}\n\n\t\treturn &#039;&#039;;\n\t}\n<\/pre><\/div>\n\n\n<p class=\"wp-block-paragraph\"><strong>Code file location<\/strong>:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"php\" class=\"language-php\">amp\/amp\/includes\/embeds\/class-amp-playlist-embed-handler.php<\/code><\/pre>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Conclusion<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Now that you&#8217;ve learned how to embed the <strong>AMP Plugin shortcode<\/strong>, understood the parameters, and seen code examples, it&#8217;s easy to use and debug any issue that might cause it to &#8216;not work&#8217;. If you still have difficulties with it, don&#8217;t hesitate to leave a comment below.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Below, you&#8217;ll find a detailed guide on how to add the AMP Shortcode to your WordPress website, including its parameters, examples, and PHP function code. Additionally, we&#8217;ll assist you with common issues that might cause the AMP Plugin shortcode not to show or not to work correctly. Before starting, here is an overview of the [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"name":"AMP","slug":"","version":"2.4.2","author":"<a href=\"https:\/\/github.com\/ampproject\/amp-wp\/graphs\/contributors\">AMP Project Contributors<\/a>","icons":"https:\/\/ps.w.org\/amp\/assets\/icon.svg?rev=2527602","plugin_tags":"{\"amp\":\"amp\",\"mobile\":\"mobile\",\"optimization\":\"optimization\",\"page-experience\":\"page experience\",\"performance\":\"performance\"}","author_profile":"https:\/\/profiles.wordpress.org\/westonruter\/","requires":"4.9","tested":"6.3.2","requires_php":"7.0","rating":76,"num_ratings":355,"active_installs":400000,"downloaded":13350438,"last_updated":"2023-07-18 6:38pm GMT","added":"2015-10-08","homepage":"https:\/\/amp-wp.org","short_description":"An easier path to great Page Experience for everyone. Powered by AMP.","description":"\"AMP is a powerful WordPress plugin that accelerates your website's performance on mobile devices. It optimizes your content, ensuring faster load times, enhanced SEO, and improved user experience.\"","shortcodes":"[\"amp_playlist\"]","footnotes":""},"categories":[1],"tags":[],"class_list":["post-281","post","type-post","status-publish","format-standard","hentry","category-plugins"],"_links":{"self":[{"href":"https:\/\/wpshortcode.org\/wp-json\/wp\/v2\/posts\/281","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpshortcode.org\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpshortcode.org\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpshortcode.org\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wpshortcode.org\/wp-json\/wp\/v2\/comments?post=281"}],"version-history":[{"count":1,"href":"https:\/\/wpshortcode.org\/wp-json\/wp\/v2\/posts\/281\/revisions"}],"predecessor-version":[{"id":288,"href":"https:\/\/wpshortcode.org\/wp-json\/wp\/v2\/posts\/281\/revisions\/288"}],"wp:attachment":[{"href":"https:\/\/wpshortcode.org\/wp-json\/wp\/v2\/media?parent=281"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpshortcode.org\/wp-json\/wp\/v2\/categories?post=281"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpshortcode.org\/wp-json\/wp\/v2\/tags?post=281"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}