-
Notifications
You must be signed in to change notification settings - Fork 381
Adding Custom Shortcodes And Widgets
Weston Ruter edited this page Jul 6, 2018
·
7 revisions
Widgets are now supported when adding theme support, and shortcodes have always been supported. Here are some considerations for creating custom shortcodes and widgets:
- No inline scripts, as this plugin will strip
<script>
tags on the front-end. Consider usingamp-bind
instead. Whilescript
elements will be stripped in AMP, if you have fallback content in accompanyingnoscript
tags then (as of 1.0-beta1) they will be unwrapped so their contents will be served in AMP. For more, see Implementing Interactivity. - While it is a best practice is to enqueue stylesheets with
wp_enqueue_style()
, this plugin will also recognize inline styling, and it automatically to the<style amp-custom>
element. If the stylesheet causes the total page CSS size to go over the 50 KB limit, it might be stripped. But a new feature as of 1.0-alpha1 reduces the need to reduce additional CSS by automatically tree-shaking the CSS added to the page. - You can use is_amp_endpoint() to output different markup for AMP and non-AMP pages, such as when you are using the paired mode (doesn't apply to Native AMP). For example, a social sharing widget or shortcode might output the
amp-social-share
component on the AMP page:
<?php if ( function_exists( 'is_amp_endpoint' ) && is_amp_endpoint() ) : ?>
<amp-social-share type="twitter"></amp-social-share>
<?php else : ?>
<a href="https://twitter.com/intent/tweet/?url=http%3A%2F%2Fexample.com">Share</a>
<?php endif; ?>
- The plugin will automatically output the required scripts for any AMP components that you output. In the example above, the plugin will recognize the
amp-social-share
component and output the required script.
Notice: Please also see the plugin documentation on amp-wp.org