Cocoonフォーラム

前略、Ikkyushindanshi7さん 出先なので、調べていませんが、よくある事例としては、子テーマ内のtmp-user/head-insert.phpの中に書いてある、とか、でしょうか。

@benoki さん ｍｋ２さんご案内のCocoon設定の「全体」タブの設定の「サイト幅の均一化」のところの「サイト幅を揃える」にチェックを入れて、「ヘッダー」タブの設定の「高さ」を300にすると以下のような感じになります。 ヘッダーの背景画像がブラウザの幅いっぱいには広がらず、サイ...

チャーチルさん 私のテストサイトですと、クラシックエディターのテキストエディター場合は、以下のように・・ ブロックエディターですと以下のような感じのコードエディター上の表示になるみたいです。

合っているのか間違っているのか・・  next-page.png

誤字訂正します。 ブラウザの幅をパソコンの前面にして見ている ブラウザの幅をパソコンの全面にして見ている

@mk2_mk2 さん けんさん きゃりーさん ｍｋ２さんの発生条件ですと、キャレットを先頭に置いたら、shift キーと 右矢印キーで文字列を選択すると良いかもしれませんね。

前略、ｍｗさん これ、私はよくわからないのですが、子テーマに「tmp」というフォルダを作成して、その中に親テーマの「tmp」ファイルの中にある「pagination.php」をコピペして、36行目辺りを書き換えると、イケないかな・・と。 よくわからないで書いているので、何とも・・

@benoki さん 背景画像１枚だけのときは、以下のような計算式で、CSSのコードの数値を設定すればOKです。 背景画像の高さ÷(背景画像画像の幅+17px(縦スクロールバーの幅))×100＝数値vw #header { height: 数値vw; }

@benoki さん もう一つ方法としては、1920×440px ぐらいの背景画像１枚だけで済ましてしまう、という方法です。 ブラウザの幅をパソコンの前面にして見ている方もいらっしゃいますが、少しウィンドウを小さくして見ている方もいらっしゃるかと思います。 私はFiref...

@benoki さん ちょうど、昨日、２枚の画像を差し替えて表示させる、というトピックがあったので、リンクを貼ってみます。 [解決済] グローバルナビメニューの高さを変更したい（太くしたい） PCとモバイルで、背景画像を差し替えるには、CSSでのカスタマイズが必要に...

@benoki さん 上記で説明したとおり、Cocoonは、基本的には２枚の画像を使ってヘッダーをデザインするように設計されています。 この仕組みを上手く利用するのが、難しいようで一番簡単です。 １枚の画像をPCとモバイルで差し替えて表示するとなると、Cocoonの標準の...

@benoki さん Cocoonのサイトでブラウザの幅を広げたり、縮めたりしてみてください。 ブラウザの幅を広げると、背景画像の下の方が隠れるのがわかるかと思います。  e0fc30ba0de293348238f6a613277e8f.gif

@benoki さん Cocoonのヘッダーは、背景画像とロゴ画像の２枚の画像が利用できるように設計されています。 背景画像は文字どおり背景画像で、画像の下側の方は、画面幅によって隠れても差し支えない画像を使います。 ロゴ画像の方は、サイトのタイトルで利用も可能です。タイ...

@benoki さん これは、画像のアスペクト比の問題ですね。 今お使いの画像は、1280 × 720pxですので、横縦の比率は、1：0.56 ぐらいです。 例えば、多くのパソコンで利用されている解像度は、横が1920ですので、高さを300pxにするには、 1920 × 300pxの...

@mk2_mk2 さん 私も、少しだけテストしてみたのですが、太字でもマーカーでも、私のテスト環境では、少ない頻度ですが、症状が再現しました。 まだ、詳しくテストしていないので、症状が出現する条件は全く掴めていません。

前略、チャーチルさん フォーラム冒頭の案内にありますとおり、不具合対象ページのURLをご提示いただき、不具合箇所のキャプチャ画像を添付いただくと、不具合の原因を突き止めるのにとても役立つ場合があります。 また、プラグインが影響しているケースも、フォーラムのお問い合わせの中には多々あり...

わいひらさん 早速、ローカルのテスト環境にインストールしてみました。 マイクロバルーンの中央寄せについては、問題が解消されたように思います。 ただ、まあ、ボタン等との組み合わせだとエディター上の表示が上手くいかないこともあるかもしれません。 このごろ、WordPressでもf...

benokiさん ヘッダー画像の件は、このConoHaからインストールしたテーマの件が解決してから、行った方が確実です。

benokiさん 別件ですが、ConoHa WING で提供されている Cocoonのテーマのフォルダ名が、標準のフォルダ名と異なっていることが原因で、ダッシュボードの操作でCocoonの親テーマをアップデートできない方が多くいらっしゃるようで、benokiさんも、そのお一人のようです。 ...

前略、benokiさん ヘッダーの表示より重要な事があるのですが、先ずは、ヘッダー画像の件。 以下のコードを追加CSSか、子テーマのstyle.cssファイルにコピペすると、PC、モバイルとも背景画像が同じように表示されるかと思います。 #header { height...

わいひらさん style.cssの4332行目辺りを .micro-balloon.aligncenter { margin-left: auto; margin-right: auto; display: table; } とすると、イケそうな気もするのですが・・

sora00さん 私のテストサイトでも症状が再現されました。 おそらく、display: table; でなければならないところが、 display: block; となってしまっているようです。  5c861235730a6fa6d0a0c37e114b01dd.pn...

sora00さん 環境情報を拝見すると、PHPのバージョンが7.2系と古いようですので、7.4系に切り替えることをオススメします。 あと、WordPressを日本語環境で利用する際は、プラグインの「WP Multibyte Patch」のインストールは必須だそうです。インストールして...

前略、@sora00 さん 不具合かな？と思ったら、先ず、プラグインを全て停止して、ブラウザのキャッシュを削除して、表示を確認してみる、というのが最初に行う作業です。 フォーラムへのお問い合わせの際は、案内にありますように、Cocoonの高速化設定はOFFにしていただくと遠回りせずに...

やなぎさん 以下のコードを追加して・・ /*トップページ以外のヘッダーの高さを調整*/ .header .header-in { min-height: 0; height: 10vw; } @media screen and (max-width: 834px...

やなぎさん もう一度書き込みます。 以下の部分をそっくり・・ /*トップページ*/ .home .header{ background-image: url('https://moena-y.com/wp-content/uploads/2021/09/8818d4830dac5...

やなぎさん 上記のコードは大幅に変えていますので、一部を抜粋せずに、その部分をそっくり差し替えてください。

やなぎさん トップページのヘッダーの背景画像はPCとモバイルの２種類でイケそうです。 子テーマのCSSの以下の記述の部分を /*トップページ*/ .home .header{ background-image: url('https://moena-y.com/wp-content/...

やなぎさん ２枚の画像を使い分けていたんですね。 だとすると少しCSSのコードを変えなくてはならないので、少しお待ちくださいませ。

やなぎさん 例えば、ipadで縦表示のとき、現在は上の画像のようになっていますが、比率を保つことにより、下の画像のようになります。 ipad01.png  ipad02.png

やなぎさん 以前のトピックではるさんがご案内くださったコードですね。はるさんのコードは、閲覧するデバイスの画面幅が834px以下のとき、ヘッダーの高さを300pxにする、というものです。 以下のコードは、おおまかに説明すると閲覧する画面幅を100とするとヘッダーの高さを45にする、と...

やなぎさん ご質問とは別ですが、以下のCSSを適用すると、ヘッダーの背景画像がどの画面幅でも、同じアスペクト比で表示されるかと思います。 #header { height: 45vw; }

@yoko51 さん なるほど、アクセス解析にご利用になっているのですね。 フォーラムへのお問い合わせで、Jetpackが原因だったことも多く、個人的に良い印象がなかったため、伺いました。 きっとyoko51さんだけではなく、他の多くの方も、その機能を重宝しているのか...

@yoko51 さん 「Jetpack」は必要性を感じないので、一度も使ったことがありません。 「Jetpack」にも独自のCSSを適用させないような設定があるような気もしますが、そこは「Jetpack」に詳しい方に回答いただいた方が良いと思います。 ところで、「JetP...

@mk2_mk2 さん Jetpackにはそのような機能があるんすね。 @yoko51 さん CDNであることと別のCSSが適用されていることは、少し違うのかもしれないですが、一旦、停止してみるとやはり、何かわかるかもしれません。

@mk2_mk2 さん 確かに、CDNっぽいURLですね。

@yoko51 さん figure要素が display: table;でないといけないのに、なぜかdisplay: block;に指定されちゃってますね。 .body .aligncenter { display: block; margin-right: auto; ...

@yoko51 さん ローカルのテストサイトで高速化設定をONにしてみたのですが、症状が再現できないでいます。 ? ということは、しばらくの間、高速化をONにしていただくのが手掛かりを掴む手段かもしれません。 わいひらさんは、だいたい19時～20時30分ぐらいにフォーラ...

前略、やなぎさん 以下のCSSを適用すると、どうでしょうか？ ちょっと、やってみないと何とも・・ @media screen and (max-width: 834px) { #navi .navi-in > .menu-mobile li { he...

@yoko51 さん 親テーマに切り替えても症状が出るということは、CSSの記述以外の可能性があるかもしれません。 時間がとれたら、もう少し調べてみます。

Yoko 51さん 表示を確認するときは、ブラウザのキャッシュを都度削除するようにしてください。

@yoko51 さん ざっと見ただけなので、見逃しているかもしれません。 インデント等の記述が揃っていないので、判読しづらいです。 親テーマに切り替えてみると、ご自身で記述した影響がないので、ご自身で記述したCSSの影響かどうかがわかるかもしれません。 また、他の原因も含めて調べる必...

@yoko51 さん ちょっと時間がとれないので、とりあえず。 115行目→全角の空白２つ 194行目→全角の空白２つ 884行目→px数値指定ない 115.png 194.png  884.png

@yoko51 さん 他にもあるのかもしれませんね。

@yoko51 さん あと、Cocoon バージョン2.3.6 では、画像ブロックを「中央寄せ」にした場合、キャプションも画像の左右幅の中央に配置されるように仕様が変わっているかと思います。（以前は、全てキャプションは画像の幅の左寄せ） 以下のトピックをお読みいただくと、経緯がわかる...

@yoko51 さん WordPress5.5辺りから画像の遅延読み込み機能がWordPressに組み込まれたので、プラグイン（JetpackやEWWW Image Optimizeなど）の lazy load(画像の遅延読み込み)機能 は、OFFにしておいた方が無難かと思います。 あと、プ...

前略、Yoko51さん とりあえず、プラグインのGutenbergは停止することをオススメします。 いま出先なので詳しくみれませんが、高速化設定をoff にすると改善するというのは、ご自身で記述したコードのどこかに不備がある場合が多いです。 css の括弧が足りないなどが...

前略、はなぶささん 私もFontawesomeは、よくわからないのですが、以下のようにしたら、表示されるっぽいです。 HTML <h2 class="pen-aikon">新着記事</h2> CSS h2.pen-aikon::before { ...

前略、saihousha さん プラグインを全部停止して、キャッシュをクリアして表示を確認してみる、というのはもう試してみましたか？ 以下のツールを利用しても良いのかもしれません。 WordPressのトラブルシューティングを劇的に楽にする「Health Check ＆ Trou...

miyoshiさん WindowsのPCのインテルのCPUでしたら、Corei5以上のものをオススメします。 ストレージは、今からの購入でしたら、SSD一択です。256GBでもいいのですが、500GBぐらいあった方が良いかもしれません（HDDのPCより起動が速いですし、動作も早いです...