Cocoonフォーラム

サイト内検索
書き込みの前に以下の3点をご確認ください。
  1. 1つのトピックにつき1つの質問を書き込んでください
  2. 不具合・カスタマイズ対象ページのURLを提示高速化を無効にしてください
  3. 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります

何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。

不具合・カスタマイズ対象ページのURL:

相談内容:

不具合の発生手順:

解決のために試したこと:

※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:

※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。

環境情報の取得方法はこちら。
https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
https://wp-cocoon.com/theme-trouble/

フォーラム利用ガイドリンク

  1. フォーラムガイドライン
  2. よくある質問と答え(FAQ)
  3. サポート対象外のケース
  4. 原因不明の不具合用トラブルシューティング
  5. トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw
  6. 真っ白画面でのエラーメッセージの確認方法
  7. ブラウザ環境チェックツール
  8. Cocoonカスタマイズ依頼

フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。

トップページを2カラムにしたい。
 
共有:
通知
すべてクリア

[解決済] トップページを2カラムにしたい。

18 投稿
3 ユーザー
7 Reactions
8,321 表示
(@まひろ)
Active Member
結合: 5年前
投稿: 11
Topic starter  

初めまして。お世話になっております。
初心者にも優しいcocoonにはとても助けられてます。

トップページに指定した固定ページを2カラム表示にしたいのですが、サイドバーに設定したコンテンツが画面の下の方に表示されてしまいます。おそらくメインカラムとサイドバーが、上下に並んでしまっているのではないかと思います。

試したこと。
・外観からサイドバーにウィジェットを追加
・全体設定のサイドバーの表示状態は全てのページで表示
・カラムからコンテンツ幅とサイドバー幅を変えても変化なし
・固定ページのページ設定はデフォルト
・スキンの変更
・プラグイン停止
・cocoonの全てのキャッシュの削除
・ブラウザのキャッシュとcookie削除

すべてスマホから操作しており、PC表示もスマホから確認しています。
何か見落としがあるのかもしれませんが、ご教示いただければ幸いです。よろしくお願い致します。

----------------------------------------------
サイト名:まひろの語り草
サイトURL: https://mahiroblog.com
ホームURL: https://mahiroblog.com
コンテンツURL:/wp-content
インクルードURL:/wp-includes/
テンプレートURL:/wp-content/themes/cocoon-master
スタイルシートURL:/wp-content/themes/cocoon-child-master
子テーマスタイル:/wp-content/themes/cocoon-child-master/style.css
スキン:/wp-content/themes/cocoon-master/skins/skin-season-autumn/style.css
Wordpressバージョン:5.2.1
PHPバージョン:7.2.14
ブラウザ:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.157 Safari/537.36
サーバーソフト:Apache
サーバープロトコル:HTTP/1.1
言語:ja-JP,ja;q=0.9,en-US;q=0.8,en;q=0.7
----------------------------------------------
テーマ名:Cocoon
バージョン:1.7.7.2
カテゴリ数:4
タグ数:0
ユーザー数:1
----------------------------------------------
子テーマ名:Cocoon Child
バージョン:1.0.7
----------------------------------------------
Gutenberg:0
AMP:1
PWA:0
ホームイメージ:/wp-content/themes/cocoon-master/screenshot.jpg
----------------------------------------------
ブラウザキャッシュ有効化:1
HTML縮小化:1
CSS縮小化:1
JavaScript縮小化:1
Lazy Load:1
WEBフォントLazy Load:1
JavaScript(フッター):1
----------------------------------------------
利用中のプラグイン:
----------------------------------------------


   
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17179
 

2カラムに表示されているように見えます。
よろしければ、キャプチャを撮影してアップしていただいてよろしいでしょうか。


   
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17179
 

以下の、利用環境チェックツールのブラウザーサイズは幾つになっていますか?
http://mysys-check.com/


   
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17179
 

すべてスマホから操作しており、PC表示もスマホから確認しています。

これを見落としていました。
おそらく、画面の横サイズが狭いので、レスポンシブ表示上そのような表示になっているのではないかと推測します。
画面幅が1300ピクセル以上の端末があれば確認してみていただけますでしょうか。


   
(@まひろ)
Active Member
結合: 5年前
投稿: 11
Topic starter  

早いお返事ありがとうございます。

ブラウザは980×1391でした。

画面サイズのせいかもとは思いましたが、他のcocoon利用者の方のページは2カラムで表示されていたので確認不足でした。

スマホの画面を横にして見ても変わらないようなので、後日改めてPCから確認してみます。

ありがとうございます。


   
わいひら reacted
(@もち)
Active Member
結合: 5年前
投稿: 7
 

はじめまして。
サイドメニューが下に表示されてしまい、対処法を検索してこちらにたどり着きました。

質問者さんと同じ現象のようですが、PCより制作しています。
chromeのF12で確認したところ、769~1022pxの画面幅で現象が出ています。

添付の通り、サイドバーのボタンは右下に表示されていて画面下の物と同じものが現れます。
サイドメニューが下に表示されないようにできますか?


   
(@もち)
Active Member
結合: 5年前
投稿: 7
 

すみません、一定の画面幅でサイドバーが下に表示されるのは仕様のようですね

こちらも参考にしましたが、他のサイトでもみなさんそうでした。

他の方は私のように画像のボタンを使っていないので、おかしくないのですね ? 
けっこう無理やりですが、サイドバーのコンテンツだけ、CSSで非表示にしました ? 

ちなみに、750px以下(?)では、元々非表示でした。

また、何かありましたらよろしくお願いします。


   
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17179
 

chromeのF12で確認したところ、769~1022pxの画面幅で現象が出ています。

確かにその範囲は、表示させるべきではないと僕も思うので、その画面幅で表示しないように修正しておきました。
------------------------------------------------
https://github.com/yhira/cocoon
最新ファイルをダウンロードする場合は、上記ページのダウンロードボタンからzipファイルをダウンロードしてください。

FTPでのアップデート方法はこちら。
https://wp-cocoon.com/ftp-update/
------------------------------------------------
ご連絡ありがとうございます!


   
(@もち)
Active Member
結合: 5年前
投稿: 7
 

修正ありがとうございます!

CSSで769~1022pxを非表示にしたら、サイドバーも非表示になっていたことに気づいて戻ってきました!(^^;

ファイルを上書きしてサイドメニューは直ったのですが、599~749pxで2カラムにしてあるところの画像が小さくなって?しまいました。

前はどうだったか覚えていないのですが、598px以下と同じ表示ではなかったかと思います。直せますでしょうか?

こちらのページのヘッダーが左に寄ってしまうのと、真ん中に画像とテキストが並んでいる所があり添付のようになります。
https://seikatsuichiba.com/

よろしくお願いします。


   
かうたっく
(@kautakku)
Famed Member Moderator
結合: 7年前
投稿: 4764
 

ヘッダーが左に寄ってしまう

#header-in .column-wrap > div {
	width: 100%;
}

真ん中に画像とテキストが並んでいる所があり添付のようになります。

HTMLを変更したら良いと思いますけど、どのようにしたいですか?

2カラムの1:2など使ってみるとかで対応できると思います?おそらく


   
わいひら reacted
(@もち)
Active Member
結合: 5年前
投稿: 7
 

かうたっくさん、ありがとうございます!
ヘッダーが左に寄ってしまうのは直りました!  ? 

2カラムの部分は、元々1:2で作っていたのですが最初から作り直したら画像は直りました。幅などを調整中で、うまくいかなかったらまたご質問させていただきます。

さらに、今回のアップデートで質問なのですが

モバイルで見た時にフッターのメニューに枠が付いていたのですが、なくなってしまいました。こちらのサイトでは枠というか背景色が付いているので、どこかで設定できるのかと思いますが、見つかりませんでした。

枠が付いていた時のスクショがありましたので関係ない矢印とかありますが添付しておきます。
FTPで個別に前のファイルに戻すのでも良いのでアドバイスお願いしますm(_ _)m

また、index.htmlになっている被リンクがいくつかあったため、.htaccessでリダイレクトしていたのですが、それが効かなくなってしまいました。今回のアップデートのタイミングかは不明ですが、対策はありますでしょうか?

ちなみに.htaccessの内容は以下です。
ドメイン直下に入れてあり、入れた直後のテストでは機能していました。

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

何度もお手数をおかけしますが、どうぞよろしくお願いいたします。


   
かうたっく
(@kautakku)
Famed Member Moderator
結合: 7年前
投稿: 4764
 
.navi-footer-in > .menu-footer li.menu-item {
	border: 1px solid #ccc;
}

これんな感じ。

スマホのみでしたら、子テーマのしたにあるメディアクエリ内に入れてチェックしてもらえますか。

また、index.htmlになっている被リンクがいくつかあったため、.htaccessでリダイレクトしていたのですが、それが効かなくなってしまいました。今回のアップデートのタイミングかは不明ですが、対策はありますでしょうか?

コチラは新規トピックを立ててください。このページは『トップページを2カラムにしたい。』っていうトピックなのでご理解ください。

ついでに、リダイレクトのURLも双方書いておけば分かりやすいと思います。解決される回答が付くかは不明ですけどね❦


   
わいひら reacted
(@もち)
Active Member
結合: 5年前
投稿: 7
 

早々の解答ありがとうございます!
だんだんとトピックタイトルから離れてしまっていましたね。
失礼しました。
もう少し調査してみて、解決できなかったら新規トピック立てさせていただきます。
ありがとうございましたm(_ _)m


   
かうたっく
(@kautakku)
Famed Member Moderator
結合: 7年前
投稿: 4764
 

あるあるですよね^^

そっちはそっち。こっちはコッチで、結果だけでも投稿いただけたら。って思います。

※今後、万が一の話。『トップページを2カラムにしたい。』で同じ内容を行いたい人に、結果をお伝えいただけたら。って感じで思ってます。

くっそ面倒くさい事を言って申し訳ないです ? 

ご配慮いただけたら助かります!


   
(@もち)
Active Member
結合: 5年前
投稿: 7
 

ちなみに.htaccessファイルを再アップロードしたら直りました。
なにかの原因で壊れたのかもしれません。。。
同じ現象で検索して来る方がいるかもしれないので念の為記載しておきます…それではm(_ _)m


   
わいひら reacted
かうたっく
(@kautakku)
Famed Member Moderator
結合: 7年前
投稿: 4764
 

会話が噛み合ってない ? ? 

いっぱいいっぱい感満載ですけど、回答サイドのお願いもホンノリチェックしていただけたら助かります❦

※このトピックで該当ファイルのエラーと解決方法は、検索ユーザー的には無用ってことなんです ? ? ? ゴメンナサイね

 

例えばWordPressのエラーの件で検索してきた人は、エラーの原因関連を知りたいのに

思いつきで今日食べたご飯の事を書かれても、食べたご飯の事やその改善点を書かれても『はぁ??』何?興味ないんだけど、イキナリ何言ってんの。

ってなると思うんですけど。

回答している人・質問している人の事は興味がないし『検索した内容の事』を早く解決したいだけ。じゃないっすかぁ。って第三者なら思う気がします。

This post was modified 5年前 by かうたっく

   
わいひら reacted
(@もち)
Active Member
結合: 5年前
投稿: 7
 

かうたっくさん、すみません ? 
画面を更新していなくて21:11の投稿を見ずに入れてしまいました。
.htaccessの件はテーマとは関係ないのでこちらで新規トピック立てるのは悪いかと思い補足程度で済ませてしまいました。。そして更にトピックとは関係ないスレを増やしてしまってすみません、これにて失礼します(汗)(汗)


   
わいひら reacted
かうたっく
(@kautakku)
Famed Member Moderator
結合: 7年前
投稿: 4764
 

いえ。大丈夫です。よくある事ですので❦

 

https://wp-cocoon.com/community/cocoon-theme/%e3%83%88%e3%83%83%e3%83%97%e3%83%9a%e3%83%bc%e3%82%b8%e3%82%922%e3%82%ab%e3%83%a9%e3%83%a0%e3%81%ab%e3%81%97%e3%81%9f%e3%81%84%e3%80%82/#post-20165

.navi-footer-in > .menu-footer li.menu-item {
	border: 1px solid #ccc;
}

これんな感じ。

スマホのみでしたら、子テーマのしたにあるメディアクエリ内に入れてチェックしてもらえますか。

この件が気になってる感じですかね。

どの範囲、ボーダーを付けたいのかとか、書き込みだけでは不明ですので。

 

※追記

てかコレも関係ないや^^;

 

もう書いちゃったんですが、よく分からない。思い通りではない。って場合。

新規トピックで、上記質問をコピペ+補足を付けていただけたらと思います!

This post was modified 5年前 by かうたっく

   
わいひら reacted
共有:

問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。

また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。

「いいね!」機能はフォーラム登録者のみが利用できる機能です。

CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。

フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。

最近の書き込みはこちら。

詳細なカスタマイズ依頼をするならこちら。

タイトルとURLをコピーしました