Indeed:
echo AMP_Content_Sanitizer::sanitize(
'<iframe src="https://example.com"></iframe>',
[
'AMP_Iframe_Sanitizer' => array(
'add_placeholder' => true,
),
]
)[0];
Results in:
<amp-iframe src="https://example.com" height="400" layout="fixed-height" width="auto" sandbox="allow-scripts allow-same-origin">
<span placeholder="" class="amp-wp-iframe-placeholder"></span>
<noscript><iframe src="https://example.com"></iframe></noscript>
</amp-iframe>
Nevertheless, this placeholder is not helpful as it’s empty. In reality, it is a workaround. It is preferable to actually provide the placeholder yourself, and you can do this as simply as put a child element under the iframe
. For example, consider this $content
which includes a linked image as a placeholder:
<iframe src="https://example.com/"><a placeholder href="https://example.com/"><img src="https://example.com/screenshot.png" alt="Example"></a></iframe>
When sanitizing that content:
echo AMP_Content_Sanitizer::sanitize(
'<iframe src="https://example.com/"><a placeholder href="https://example.com/"><img src="https://example.com/screenshot.png" alt="Example"></a></iframe>',
[
'AMP_Iframe_Sanitizer' => array(),
'AMP_Img_Sanitizer' => array(),
]
)[0];
It results in:
<amp-iframe src="https://example.com/" height="400" layout="fixed-height" width="auto" sandbox="allow-scripts allow-same-origin">
<a placeholder href="https://example.com/">
<amp-img src="https://example.com/screenshot.png" alt="Example" object-fit="contain" width="600" height="400" class="amp-wp-unknown-size amp-wp-unknown-width amp-wp-unknown-height amp-wp-enforced-sizes" layout="intrinsic">
<noscript>
<img src="https://example.com/screenshot.png" alt="Example" width="600" height="400" class="amp-wp-unknown-size amp-wp-unknown-width amp-wp-unknown-height">
</noscript>
</amp-img>
</a>
<noscript>
<iframe src="https://example.com/"></iframe>
</noscript>
</amp-iframe>