上記、質問をさせていただきましたが、不具合のあるページに上手くリンクしていなかったため、【問題】という項目を訂正させて頂きます。

＜訂正前＞

【問題】
下記ページ「 https://issyonisukusuku.net/?cat=0 」のメインカラムに設置しております新着記事について、表示幅を修正したいです。

＜訂正後＞

【問題】

下記ページ「 https://issyonisukusuku.net/?cat=0 」のメインカラムに設置しております新着記事について、表示幅を修正したいです。

ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー

以上、どうぞよろしく御願いいたします。

ちひろ

ちひろさん

ちょっと、「はいどうぞ、これで」という感じでご提示して良いものかどうか、私には分からない状態です。

ご提示いただいたものだけでなく、以下のような状態も発生しています。

「サイトマップ」と「未分類」

前略、ちひろさん

タイトルのご質問とは違ってしまいますが、ｍｋ２さんもおっしゃっている「そもそもヘッダーも何だか変なような。。」についてですが、サイトのソースコードをコピーしてCocoon設定の「アクセス解析・認証」タブの「ヘッド用コード」に記述されている以下のコードをコメントアウトしてみたら、正常と思われる表示になりました。

https://notepad.pw/share/8uk0uuib

mk2様

早々にお答えくださってありがとうございます。

メインカラムの症状しか確認していなかったので、他の現象のご指摘に感謝しつつも面食らっております…。

①メインカラムが左に寄ってしまう現象について

本当ですね。
ご指摘の「サイトマップ」ページや「未分類」ページも同様の現象を確認しました。
ありがとうございます。

その後、画像URLにアクセスすると、これまた同様で、左に寄っておりました。

②ヘッダー画像のSSL化について

私の確認方法では、画像URLはSSL化されておりました。

画像URLについては、スラッグが英数字ではないものもあったので、ヘッダー画像含めてスラッグを変更しました(添付画像A)。

他、私が思い当たることとしては、キャッシュを削除するという方法くらいです。
今は、そのままにしておきます。
必要であれば、キャッシュ削除等、実施いたします。

③アドセンス403エラー
④何かの404エラー
⑤ヘッダー画像(であろう)混雑コンテンツ
⑥ヘッダーのズレ

③④⑤は、これから調べてみます。

あと、⑥のヘッダーが大きく下にずれている現象については、私のPC環境では初めて見たもので、ちょっとこれも調べてみないとわかりません。
ダッシュボードの「外観/カスタマイズ」周辺かなぁ？と推測しております。

何もできていませんが、取り急ぎお礼申し上げます。

ちひろ

ちひろさん

おそらく上記のコードはアドセンスの広告コードかと思いますが、それでしたら、Cocoon設定の「広告」タブの方に設定する箇所がありますので、そちらに設定すると良いような気がします。

また、コードに何かしらの問題があるようですので、もう一度コードを取得し直してみてはいかがでしょうか。

以下は、cocoonのマニュアルページです。

広告（AdSense）を手っ取り早く設定する方法

https://wp-cocoon.com/how-to-set-adsense/

mk2様

早々にお答えくださってありがとうございます。

メインカラムの症状しか確認していなかったので、他の現象のご指摘に感謝しつつも面食らっております…。

①メインカラムが左に寄ってしまう現象について

本当ですね。
ご指摘の「サイトマップ」ページや「未分類」ページも同様の現象を確認しました。
ありがとうございます。

その後、画像URLにアクセスすると、これまた同様で、左に寄っておりました。

②ヘッダー画像のSSL化について

私の確認方法では、画像URLはSSL化されておりました。

画像URLについては、スラッグが英数字ではないものもあったので、ヘッダー画像含めてスラッグを変更しました(添付画像A)。

他、私が思い当たることとしては、キャッシュを削除するという方法くらいです。
今は、そのままにしておきます。
必要であれば、キャッシュ削除等、実施いたします。

③アドセンス403エラー
④何かの404エラー
⑤ヘッダー画像(であろう)混雑コンテンツ
⑥ヘッダーのズレ

③④⑤は、これから調べてみます。

あと、⑥のヘッダーが大きく下にずれている現象については、私のPC環境では初めて見たもので、ちょっとこれも調べてみないとわかりません。
ダッシュボードの「外観/カスタマイズ」周辺かなぁ？と推測しております。

何もできていませんが、取り急ぎお礼申し上げます。

ちひろ

ちひろさん

【症状】
上記ページをPC画面上(Chrome・Firefox)で確認すると、SNSフォローボタンと一緒にメインカラムのおよそ1/3幅になり、左寄せになったまま表示されています。
サイトのホームにある「続きを見る」ボタンから遷移したら表示されるページです。

モバイルでテストすると、美しく表示されます。

こちらは、スキンのCSSの指定の不具合かもしれません。

わいひらさんが修正してくださるかと思いますが、応急処置として、以下のコードを追加CSSにコピペすれば、回避できるかもしれません。

.no-sidebar .content #main {
    width: 100%;
}

追加CSSは、ダッシュボートの「外観」→「カスタマイズ」→「追加CSS」とたどると開けます。

コードをコピペしたら、すぐ上にある、「公開」ボタンをクリックして確定します。

ちひろさん

あと、やはり、Cocoon設定の「アクセス解析・認証」タブの「ヘッド用コード」に？記述している以下のAMP用のコードも、要らないような気がします。

https://notepad.pw/share/cn4j0nnc

以下、参考トピックです。

[解決済] Googleアドセンス AMPスクリプトを貼り付ける場所について

https://wp-cocoon.com/community/postid/24000/

ちひろさん

あと、Cocoon設定の「アクセス解析・認証」タブの「ヘッド用コード」のところに、アドセンスの審査用コードのようなものが見受けられますが、もし審査中の場合は、他のアドセンスの広告コードは、設定せずに、審査用コードだけにするのが良いような気がします。

そうではなくて、アドセンスの審査に合格している場合は、逆に審査用のコードは削除して、アドセンスの広告コードをCocoon設定の「広告」タブのところに適切に設定すれば良いかと思います。

mk2様
リフィトリー様

ご回答下さりありがとうございます。
ご指摘いただいた以下の点について、修正いたしました。

＜メインカラムが左に寄ってしまう症状について＞

まず、ご回答とは前後いたしますが、タイトルにありますメインカラムの症状について、cssを追加いたしました。

★

すると、PC環境でもメインカラムいっぱいに3列の記事を並べることができました。
mk2様にご指摘いただいた「サイトマップ」ページ＆「未分類」ページも、添付画像のように改善いたしました。
ありがとうございます！

＜広告コードの403エラー＆ヘッダー画像について＞

リフィトリー様に教えていただいたアドセンス審査用コードの貼り方を実践いたしました。

さらに、アドセンスのディスプレイ広告用コードを再度取得し、「cocoon設定/広告」に貼り替えました。

※私が迂闊に貼ってしまいました…お手数をおかけいたしました。

＜画像URLについて＞

SSLに関しては現状では確認できないのですが、「混在コンテンツ」と表現されていたことから、日本語表記のスラッグを英数字に変更いたしました。

＜404エラーについて＞ 現段階ではまだ着手しておりません。

----------------------------------------

以上、お二方にサイトの整理にまでご指南いただき、なんとお礼を申し上げればよいのか…。
本当にありがとうございました。

ちひろさん

いろいろ解消に向かっているようで良かったです。

しかし、混在コンテンツは解消しておりません。

mk2様

ありがとうございます。

＜画像URLの混在コンテンツについて＞

混在コンテンツの所在は、私でも分かるのでしょうか？
手入力で変更できるのですか？

あと、添付してくださった黄色いバーに英語が書かれた警告の表示は、Chromeか何かのコンソール画面ですか？

私のPCではFireFoxを使っているのですが、「ファンクション12」で出てくる開発ツールから確認すると、似た画面が出てきました(添付画像)。

添付した画像で例えると、「Content Security Policy: script-src: ‘strict-dynamic’ が指定された “http:” を無視します。」というところが、mk2様の仰っている内容でしょうか？

もしこの画面から手入力でできるのであれば、方法を教えて頂きたいです。
タイトルのご質問から遠くに行ってしまいすみません…。

ちひろ

ちひろさん

mk2さんご指摘の混在コンテンツとなっているヘッダーの背景画像については、よくわからない場合は、タンポポの画像をもう一度、パソコンからWordPressにアップロードして、そのアップロードした画像を、Cocoon設定の「ヘッダー」タブの設定で、ヘッダーの背景画像に設定し直せば良いかと思います。

ところで、ひとつ質問なのですが、アドセンスの審査には合格しているのでしょうか？それともまだ、審査中なのでしょうか？

mk2様

ヘッダー画像は、今取り掛かっているところです。

アドセンスは、いま審査中です。

↑すみません、mk2様ではなくリフィトリー様でした。

失礼いたしました。

ちひろさん

ヘッダーの背景画像による混在コンテンツは解消されているようです。

アドセンスは、いま審査中です。

であるとすると、Cocoon設定の「広告」タブに設定した広告コードは消しておいた方が良いような気がします。

Cocoon設定の「アクセス解析・認証」タブの「ヘッド用コード」に設定されているコードは、審査用のコードだと思うので、そのままで良いかと思います。

ちひろさん

ちよっと他のことをしながらですので、なかなか頻繁にフォーラムに顔を出せません。

リフィトリーさんも仰っている通り、混在コンテンツは解消したようですね。

おそらくヘッダー背景画像を「https」にするだけだったのではないかと思います。

私の添付していたものはChromeですが、Firefoxでも確認は可能です。
画像を取ろうとしたのですが、迂闊にも再読み込みしたところで解消されました。

Firefoxで見ても、アドセンス絡みのエラーがたくさん出ているようです。
その理由は調べてはおりません。

審査中であれば、間違いなく支障になると思います。

mk2様
リフィトリー様

＜混在コンテンツについて＞

ヘッダー画像について「cocoon設定/ヘッダー」から確認すると、ご指摘のとおりSSL化されておりませんでしたので、画像を削除して改めてアップロードいたしました。

また、Cocoonとの相性が分からなかったのですが、ひとまず「Really Simple SSL」を有効化してみました。

ちひろさん

何が原因か分かりませんが、サイトの表示が不安定な時があります。

文字が大きくなって、まるで拡大率が100%超になったかのようになる時があります。
私のブラウザの拡大率は変更していません。

ちょっと原因は分かりません。

ただ、アピールエリアの改行タグが変なところはありそうです。
これが原因とは思いませんが、修正しておいた方が良いと思います。
（おそらく無視はされていると思います。）

リフィトリー様

アドセンスは、いま審査中です。

であるとすると、Cocoon設定の「広告」タブに設定した広告コードは消しておいた方が良いような気がします。

広告タブに設定した広告コードは一旦取り除きました。

mk2様

おそらくヘッダー背景画像を「https」にするだけだったのではないかと思います。

プラグインまで導入してしまいましたが、修正されていたのをリフィトリー様に確認して頂いて安心しました。

また、

アドセンス絡みのエラーがたくさん出ているようです。
その理由は調べてはおりません。

審査中であれば、間違いなく支障になると思います。

これにつきましては、自分自身で調べて改善したいと思います。

思わぬ問題にお付き合いいただき、本当にありがとうございました。

mk2様

本当ですね…！

改行タブを終了していましたが、これからは開始タブだけにします。

アピールエリアを修正しましたが、他の記事にも改行の終了タブを付けていますので、近日中に修正したいと思います。

ありがとうございました。

ちひろさん

アドセンスのエラーは解消されませんね。
なんとなくですが、アドセンス側の設定が上手くいっていない気はします。
（403ですから、拒否されているということで、URL・ドメインの登録など上手くいっていないのかな。。。と。）

自分自身で調べて改善したいと思います。

とのことですので、これ以上は申し上げるのを遠慮しておきます。

【追記】

改行タグについては、開始・終了という考えではなく、単なる改行です。
タグの数だけ改行されます。

【追記の追記】

XHTMLでは、開始・終了という考えがあるみたいです。
XHTMLでは、<br></br>という感じみたいですね。
<br />もXHTMLのようです。（上記の省略形）

XHTMLは廃止になっているようです。

HTMLでは、<br>で良いみたいです。
（<br />も使えるみたいです。）

ちひろさん

もしかしたら、わいひらさんがスキンを修正くださるかもしれません。

その際は、修正したCocoonのテーマを適用してご確認いただけますと幸いです。

mk2様

アドセンスのエラーは解消されませんね。
なんとなくですが、アドセンス側の設定が上手くいっていない気はします。
（403ですから、拒否されているということで、URL・ドメインの登録など上手くいっていないのかな。。。と。）

<br />もXHTMLのようです。（上記の省略形）

XHTMLは廃止になっているようです。

ヒントをくださりありがとうございます…！
実は、私側の通信速度が遅く(理由は把握しており改善中です)、このフォーラムにコメントをアップするのもやっとの状態です。
もうそろそろ改善されるはずですが、まだ数日はかかると思いますので、アドセンス403エラーとXHTMLに関しては時間帯を見て行なっていきます。

リフィトリー様

かしこまりました！
とってもシンプルなcssを教えてくださってありがとうございました。

わいひら様、お手隙の際で結構ですのでぜひよろしく御願いいたします。

わいひら様、お手隙の際で結構ですのでぜひよろしく御願いいたします。

すいません。
トピックの内容がいろいろ混在していて、どこがどうなったのか完全にはちょっと把握しません。
よろしければ、スキンの現象のみのトピックを立てていただいてよろしいでしょうか。
不具合ページのURLと不具合状態のスクリーンショットとともにお願いいたします。

https://issyonisukusuku.net/?cat=0
上記ページを見た限りでは、特におかしな表示には見えなくて。

わいひらさん

ちひろさんは、既に追加CSSで対処はなさっているため、今は分からないものと。

以下のような感じで対処なさった様子。

わいひら様

返信ありがとうございます。

mk2様に解説して頂いたことで十分だと思うのですが、新たにトピックを立てたほうが良ければ、教えてください。

mk2様

通信環境を変更したタイミングで、DNSレコードも変更するのを忘れておりました。
403エラーについて、ひとまず修正を加えました。
サーチコンソールのレスポンス待ちです。

また、投稿記事について、HTML5のルールを再度確認してタグの修正を行いました(改行タグ・pタグ・divなど)。

ちひろ

追加したコードとともに新しくトピックを立てていただければと思います。
あと該当ページのURLとともに。

わいひら様

大変お待たせいたしました。

改めて、フォーラム内にてご相談をさせて頂きましたので、ご確認頂けると幸いです。

https://wp-cocoon.com/community/bugs/%e3%83%a1%e3%82%a4%e3%83%b3%e3%82%ab%e3%83%a9%e3%83%a0%e3%81%ae%e8%a1%a8%e7%a4%ba%e5%b9%85%e3%81%8c%e7%b8%ae%e5%b0%8f%e3%81%95%e3%82%8c%e3%82%8b%e7%97%87%e7%8a%b6%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/