対応の仕方が判らないので、AMP機能をいったんオフにしました。

現在、不具合状態を見れないので、具体的な対応方法を見るのは難しいかもしれません。

「必須属性「height」がタグ「amp-video」にありません」という文言がありました。

ただ上記のエラーメッセージであれば、挿入した動画にwidth と height属性で幅と高さを指定してやれば、改善されるかもしれません。

もう一度、AMPをオンにしてみました。修正を指摘された「amp-video」で思いつくのはサイドバーのトップに貼り付けたものだけです。

ネットでさがして以下のようなコードを見つけました。これを子テーマの「functions.php」に追加すればいいのでしょうか。

＜修正例＞
$append = '<amp-video layout="responsive" width="16" height="9"';

ちなみに「functions.php」は、これまで触ったことはないです。なにぶん知識がないので、下手にいじりたくないのですが...。ご指導のほどよろしくお願いいたします。

その前に、エラーメッセージが出ているいずれかのページで、以下は試してみられましたでしょうか。
うまく改善されない場合は、エラーメッセージが出ているページのURLを提示していただければと思います。

挿入した動画にwidth と height属性で幅と高さを指定してやれば、改善されるかもしれません。

あと、独自カスタマイズについては、サポートの対象外とさせていただいています。というのも、こちら側から、どのようなカスタマイズをされたのか確認できないからです。

投稿者:: @cragycloud

ネットでさがして以下のようなコードを見つけました。これを子テーマの「functions.php」に追加すればいいのでしょうか。

いずれにしても、こういうのは、情報元のURLを提示していただけると助かります。
※提示していただいても問題のあるカスタマイズだった場合は、修正案を書くとかまではサポートできないのでご了承ください。

お手数をお掛けします。もういちど整理してご報告いたします。

課題：サイドバーの動画ウィジェットに「widthとheight」を入力するにはどうしたらいいのか判りません。

＜経緯＞
「AMP HTML タグの属性で指定されたレイアウトが無効です」というAMPエラーが、4月8日時点で702ページ分あります。（なお、いったんAMP機能をオフにしましたので、実際にはもっとあると思います）

＜参考ページ＞
https://cragycloud.com/blog-entry-604.html

＜検証の問題＞
「必須属性「height」がタグ「amp-video」にありません」

<h3 class="widget-sidebar-title widget-title">音楽創作｜cragycloud</h3><div class="wp-video"><amp-video layout="responsive" class="wp-video-shortcode" id="video-26785-2" preload="metadata" controls="controls"><source type="video/youtube" src="https://youtu.be/ICWzrKJPr4Y?_=2"/><a href="https://youtu.be/ICWzrKJPr4Y">

<amp-video layout=以下の部分が赤色になっています。

この投稿ページには動画はありません。上記コードを見る限り、サイドバーの「動画ウィジェット」がエラーを起こしているようです。

投稿ページの「amp-video」の修正については、以下のようなCSSを子テーマの amp.css に追加します、というフォーラム記事がありました。

amp-video {
margin: auto;
width: 640px;
}

動画ウィジェットの「amp-video」への対応として、「widthとheight」を入力するには、どうしたらいいでしょうか。

不具合とは言えないかもしれませんが、ご指導いただけると幸いです。よろしくお願いいたします。

追記：

カスタマイズについて、特別なことはしていません。ほとんどデフォルトに近いと思います。

以下、子テーマに追加したコードです。

.tagline {
color: #6d6d68;
padding:0px 20px;
margin-top:0px;
margin-bottom:5px;
}

.logo {
padding:0px 20px;
margin-top:20px;
margin-bottom:0px;
}

.article h5{
border-left:6px solid #6AA3C9;
padding:6px 10px;
font-size: 20px;
border-bottom: 0px solid #fff;
}

以上です。

フォーラムの案内にもありますように、以下の高速化設定の無効を行っていただいてよろしいでしょうか。

不具合・カスタマイズ対象ページのURLを提示し高速化を無効にしてください

ソースコードが圧縮されていると見づらいので。
https://validator.ampproject.org/#url=https%3A%2F%2Fcragycloud.com%2Fblog-entry-604.html%3Famp%3D1

「widthとheight」は、以前の返信でも書いているように、CSSではなく属性です。

ただ上記のエラーメッセージであれば、挿入した動画にwidth と height属性で幅と高さを指定してやれば、改善されるかもしれません。

詳しくは「HTML 属性 width」等で検索するといろいろ出てくるかと思います。

おそらくサイドバーに入っている添付画像の部分にwidth と height属性で幅と高さを指定してやれば改善するような気がします。
※HTMLが縮小化されていて読みづらいので、詳しくは見ていないので高速化を解除後詳しく見ます。

ありがとうございます。
高速化を無効にいたしました。

＜参考ページ＞
https://cragycloud.com/blog-entry-604.html

お手数ですが、よろしくお願いいたします。

現在「動画」ウィジェットを利用されているのでしょうか？
だとしたら、動画ウィジェットはAMPに対応していないかもしれません。

違うようでしたら、ウィジェットの設定画面のスクリーンショットをいただければと思います。

なので「HTMLカスタム」ウィジェットを利用して、以下のようにvideoタグに対してwidth・height属性を加えた、コードを貼り付けるとどうでしょうか。

<video class="wp-video-shortcode" id="video-9610-1" preload="metadata" controls="controls" width="336" hight"189"><source type="video/youtube" src="https://youtu.be/ICWzrKJPr4Y?_=1" />
  <a href="https://youtu.be/ICWzrKJPr4Y"> https://youtu.be/ICWzrKJPr4Y</a> 
</video>

ありがとうございます。

「動画」ウィジェットを使って、YouTube（URL）を挿入しました。

「動画」ウィジェットがATPに対応していないのは知りませんでした。

ご指摘いただいた「HTMLカスタム」ウィジェットを使って貼り直してみます。その結果は、のちほどご報告いたします。

なんどもお手数をお掛けしています。

ご案内いただいたコードを挿入したところ、3つのエラーを修正してくださいという指摘がありました。（別添えでスクリーンショットをお送りします）

したがって、通常のYouTubeの埋め込みコードを「width=“336” height=“189”」に直してから挿入しました

AMPテストでは、エラーは出ませんでした。

ただし、当方のPC環境で見るかぎり、幅が狭く見えます。これは仕方がないのでしょうか。

とにかく、AMPエラーは出なくなりました。ありがとうございました。

一応、わいひらさんからの御返事を待ってから、この問題を解決済みにしたいと思います。よろしくお願いいたします。

AMPテストの画面を添付いたします。

ただし、当方のPC環境で見るかぎり、幅が狭く見えます。これは仕方がないのでしょうか。

width と height の値のダブルクォーテーションが全角になっています。半角に修正しなければなりません。

Akiraさん、ありがとうございます。

ご指摘どおり修正したところ、ジャストサイズになりました。

ちなみに、当方のPCはiMacなのですが、ダブルクォーテーションを半角で打ち込んでも、なぜか全角なってしまい、しょうがないのでコピペで対応しました。

お手数をおかけしました。わいひらさんから返事はありませんが、この問題を解決済みにしたいと思います。

わいひらさん、Akiraさん、ありがとうございました。

投稿者:: @cragycloud

ご案内いただいたコードを挿入したところ、3つのエラーを修正してくださいという指摘がありました。

申し訳ないです。
これは僕の書き損じです。

もしよろしければ、エラーのないコードも貼っておいていただけると幸いです。

わいひらさま

スクリーンショットをお送りします。

よろしければテキストでお願いしてよろしいでしょうか。

コピペして、コードボタンで囲むだけで良いので。
そうすると、後からこのトピックに訪れて同様のことをしようとした方が、コピペしてちょっと編集するだけで使えるので。

https://www.youtube.com/embed/ICWzrKJPr4Y

すみません、これは間違えました。のちほど再送します。

なんだか、うまく送れません。

コピペしてコードで囲って送ったのですが、YouTubeのショートコードに変換しているようです。

Youtube の埋め込みは、「共有」→「埋め込む」で表示される iframe をコピペします。HTML エンコードをしても iframe が変換されるため、notepad に HTML を貼り付けました。

https://notepad.pw/share/31j1zju3v

僕は送信できたのは、何でだろう。管理者だからだろうか。
とりあえずよろしければ以下の方法でコードをいただければ幸いです。
https://wp-cocoon.com/notepad-pw/
何度も、お手数おかけして申しわけありません。

あ、よくよくコード見てみたら、videoタグは使われておらず、普通にYouTubeの埋め込みなんですね。

Akiraさんがコードを貼り付けてくださったので大丈夫そうです。
なのでトピックを閉じておきますね。