SWELLのメインビジュアルの動画のループを停止するカスタマイズ方法です。
自分でfunctions.php
を編集する場合や、Code Snippetsプラグインを使用してコードを追加する場合、コードの追加の仕方を誤ったときにWordPress自体がエラーが発生して、サイトが閲覧できなくなることがあります。そうした場合の注意点を以下の記事にまとめたので、ぜひご覧ください。
カスタマイズ手順
子テーマのfunctions.php
またはCode Snippetsプラグインに、以下のコードを追記します。
add_action( 'wp_footer', function () {
if (is_home() || is_front_page()) { ?>
<script type="text/javascript">
element = document.querySelector('.p-mainVisual__video');
element.removeAttribute('loop');
</script>
<?php } } );
コードのかんたん解説
if (is_home() || is_front_page())
で、トップページのみスクリプトが読み込まれるようにしています。
また、中のJavaSctiptのコードでは.p-mainVisual__video
クラスの要素からloop
属性を削除しています。
この記事は、ユーザーさんからのお問い合わせで生まれました
ユーザーさんから、「こんなことはできないかな?」というご質問をいただき、実際にアクションフックやJavaScriptなどを用いて実装してみました。