サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
トピックスターター 2018年11月21日 22:43
いつもお世話になっております。
サイトのタイトルが長く、スマホで見たときに言葉の途中で改行され 添付画像のようにバランスが悪くなってしまうので、任意の文字で改行したいと思っています。
cssで出来れば嬉しいのですが、方法はありますでしょうか。
サイトのタイトルは
●●●●
○○○○○○○
のように2行目のほうが長いです。
以下のサイトを参考にしたのですが…改行してくれませんでした。
https://wp-cocoon.com/site-name-text/
h ttps://jumbleat.com/2017/11/20/make_newline_on_main_title/
h ttps://saruwakakun.com/html-css/reference/css-break
simplicityのフォーラムで同じ質問を見つけたのですが、cssではできないのでしょうか？
どうぞよろしくお願いします。
2018年11月21日 23:08
CSSではちょっとできないんじゃないかと思います。
やれるとしても、それぞれのタイトルに対応して書くには毎回毎回複雑なCSSを書く必要があるので現実的ではないような気がします。
タイトルを改行するのであれば、改行したいところでbrタグを入れるのではダメなのでしょうか？
https://notepad.pw/code/xk67ygjj
トピックスターター 2018年11月22日 00:34
わいひらさん、お返事ありがとうございます。
cssでは 難しいのですね…
代案をありがとうございます。
brタグですが、「カスタマイズのサイトのタイトル」のところで入れるのでしょうか。
入れてみますと、パソコンでは改行されているのですが、iPhoneで見ると<br>とタグのまま表示され改行してくれません…
あと、少し不安なのが、サイトのタイトルにbrタグが入っていて googleが不自然なサイトタイトルと判断したりしないでしょうか。
2018年11月22日 07:29
パソコンでは改行されているのですが、iPhoneで見ると<br>とタグのまま表示され改行してくれません…
そうであればSNSでシェアしたときや、検索結果にあるタイトルをチェックしてみるのが早いと思います。
何年も前WordPressではないブログで書いたことがありますが、もろにタグが出ていた記憶がありますが、やったついでにテスト程度でチェックしてみると良いと思います。
**追記**
サイトタイトルではなく、記事タイトルで試したんですが。
*****
少し不安なのが、サイトのタイトルにbrタグが入っていて googleが不自然なサイトタイトルと判断したりしないでしょうか。
不自然ととるか、誤字程度、タグを書いてミスったなみたいにとるか、それってGoogleさんしか分からないと思いますよ。
サイトタイトルであれば、ヘッダーに画像を入れて2行で表示すれば良い気もします。
この投稿は6年前ずつかうたっくに変更されました
トピックスターター 2018年11月22日 14:29
かうたっくさん、ありがとうございます！
検索結果にタグが表示されたら困りますね＞＜
なかなか難しいものですね…
かうたっくさんがおっしゃるように、ヘッダーに画像を入れてみます。
実はcocoonに変えたときにやってみたのですが、背景とロゴの設定が上手くいかずにやめてしまったんです。
もう一度やってみます。
もし、上手くいかなかったときはフォーラムで質問させていただこうと思いますので、そのときはどうぞよろしくお願いいたします。
かうたっくさん、わいひらさん、ありがとうございました！
2018年11月22日 14:34
了解です。頑張ってくださいね＾＾
2018年11月22日 20:41
brタグですが、「カスタマイズのサイトのタイトル」のところで入れるのでしょうか。
違います。通常のタイトルを入れるところにbrタグを挿入します。
そうするとどうなりますでしょうか？
トピックスターター 2018年11月22日 21:43
わいひらさん、お返事ありがとうございます。
すみません、一つ確認させてください。
わたしは「サイトのタイトル」を改行したいと思い質問しました。（質問の仕方が分かりづらかったかもしれません…）
「通常のタイトル」のところに「サイトのタイトル」を入れるのでしょうか？
わいひらさんが貼って下さった添付画像（通常のタイトルをいれるところ）にbrタグを入れてみますと、記事のタイトルは改行されます。サイトタイトルにも反映できるのでしょうか？
（今のサイトは、かうたっくさんにアドバイスいただき、サイト名を２行にしたロゴを貼りました。ただ、近々始める新サイトでもcocoonを使いたいと思っています。そちらもサイトタイトルが長いので 改行の方法があればご教示いただけると有り難いです。）
2018年11月22日 21:59
ページの見出しのことと勘違いしていました。
サイトタイトルを改行したいのであれば、サイトタイトルの横幅widthを改行したいところで改行されるまで狭めるとできるのではないかと思います。もしくはmax-width。
http://www.htmq.com/style/width.shtml
http://www.htmq.com/style/max-width.shtml
トピックスターター 2018年11月22日 23:02
わいひらさん、URLをありがとうございます。
２行目のほうが長い場合でも出来ますでしょうか。
例えば
「●●●○○○○○○○」というタイトルを
「●●●
○○○○○○○」
のように、改行して２行にする。
simplicityのフォーラムでは３行になってしまうとコメントされてた方がいました。わたしも3行になってしまうように思います。
2行に表示する方法があれば教えていただきたいのですが、初心者には難しいようでしたら画像を作ることで対応しようと思います。
2018年11月23日 19:47
確かに。
CSSでの幅指定の場合は、下の文字列を長くするということはできないです。
そういう場合は、JavaScript（jQuery）を利用するしかないかもしれません。
子テーマのjavascript.jsに以下のように追記するとどうなりますか。
https://gist.github.com/yhira/bc4084b3abb8fbe892ba0792f3079039
サイトタイトル（Cocoonデモサイト）部分は、自前のものに変更してください。
トピックスターター 2018年11月24日 00:08
わいひらさん、改行されました！
これからcocoonを使わせていただこうと考えているサイトのタイトルも長いので、これで２行にすることができます。
親切にコードを書いて下さり感謝です。ありがとうございました！
2018年11月24日 23:14
うまくいったようで良かったです ?
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。