サイトタイトルの改行について

PR 2015/9/3

このトピックには7件の返信、2人の参加者があり、最後にわいひらにより9年、 10ヶ月前に更新されました。

7件の返信スレッドを表示中

投稿者

投稿
- 2015年9月3日 6:39 PM #31861
  
  さくら
  ゲスト
  
  初めて質問させていただきます。さくらと申します。
  本日、ＷＰ初挑戦で、Simplicityを導入させていただき、
  カスタマイズにも挑戦中です。
  
  ヘッダー画像を設定し、サイトタイトルやキャッチフレーズの表示を編集中ですが
  サイトタイトルやキャッチフレーズを途中で改行したい場合は
  どのようにしたらいいのでしょうか？
  
  モバイル・ＰＣにかかわらず、一定の場所で改行したいと思っています。
  具体的には
  『ぐ～たら主婦のブログアフィリ実践記』
  というサイトタイトルなのですが
  『ぐ～たら主婦の
  ブログアフィリ実践記』
  というように表示させたいと思っています。
  
  キャッチフレーズについても、文章の切れ目で改行を入れたいです。
  
  サイト内検索等でも、解決策が見つけられませんでしたので
  質問させていただきました。
  あまりにも基本的な内容でしたら、申し訳ありません。
  よろしくお願いいたします。
- 2015年9月3日 6:47 PM #31864
  わいひら
  キーマスター
  style.cssに以下のように書き込めばいけるのではないかと思います。
```
#site-title {
    max-width: 500px;
}
#site-description {
    max-width: 500px;
}
```
  数値は適当なので調節してください。
- 2015年9月3日 8:41 PM #31877
  
  さくら
  ゲスト
  
  回答ありがとうございます！
  試してみたところ、
  
  ぐ～たら主婦の
  ブログアフィリ
  実践記
  
  というように、２行目も同じ文字数の部分で改行されてしまいました…。
  
  思い通りの場所にのみ改行を入れるのは、やはり難しいのでしょうか。
  
  サイトタイトルを無くして、画像に入れ込むしかないのか？と思いつつ
  ＳＥＯの事を考えると、タイトルもキャッチフレーズも消してしまうのは
  ためらいがあります。
- 2015年9月3日 9:32 PM #31881
  わいひら
  キーマスター
  1行目よりも2行目が長い場合は、CSSでは無理かもしれません。
  
  そういった場合には、子テーマのjavascript.jsに以下のように書くと思い通りのところで改行できるかもしれません。
```
(function($){
  $('#site-title a').html('ぐ～たら主婦の<br>ブログアフィリ実践記');
  $('#site-description').html('キャッチフレーズについて、<br>文章の切れ目で改行を入れたいです。');
})(jQuery);
```
- 2015年9月3日 10:48 PM #31888
  
  yokudekiru
  ゲスト
  
  私の見解ですが、画像でも良いと思います。
  私もはじめは文字でしたが、途中で画像に変えましたがアクセス数が減るということはなかったです。(逆に少し増えた)
  
  seoのことについては画像は確かにテキストに比べて悪いです。だからといって、タイトル画像にaltタグをつければグーグルのボットはこれがタイトルだと認識してくれますし、画像への変更は直帰率改善に繋がるので、テキストでも画像でもあまり変わらないと思います。
  
  後は文字を装飾するかの有無でわいひらさんの方法と画像にする方法を選べばいいと思います。
- 2015年9月3日 10:58 PM #31889
  
  わいひら
  キーマスター
  
  僕もタイトルを画像に変更するのは特に問題ないと思っています。（ヘッダー画像のみで設定するのではなく、あくまでロゴ機能を利用した場合）
  Simplicityのロゴ画像には、Alt属性が入るので、特に変わりはないかと思います。
  キャッチフレーズを消すと、多少の違いはあるのかもしれませんが、そこまで変わりはないかと思います。
  それよりも、内容（コンテンツ）のを充実させることのほうが、はるかにそれを凌駕すると思います。
- 2015年9月3日 11:45 PM #31891
  
  さくら
  ゲスト
  
  わいらひさん
  ykudekiruさん
  回答ありがとうございます！
  
  わいらひさんの書かれていた、javascript.jsに追記するという方法を
  試そうと思いましたが
  そもそも子テーマの編集などを見まくっても
  javascript.jsというものが見当たらず
  試すことができないまま、あちこちさまよっていました。
  
  最新の子テーマをダウンロード・インストールしたので
  どこかにはあるはずだと思い
  再インストールなどもしてみましたが、出てきませんでした。
  
  もしかして、ダウンロードした圧縮ファイル内の該当ファイルを
  書きかえるのかと思い、そちらも試しましたが
  上書き保存ができず、こちらも失敗してしまいました。
  
  javascript.jsに関わるほかの質問等を閲覧した所
  見つけられないというものではないようですので、
  
  javascript.jsが見つけられないこと自体、
  そもそも自分自身の勉強不足と思いますので
  もう少し、サイト作成について勉強してから
  挑戦しようと思います。
  
  今は、ヘッダー画像については
  ロゴ・もしくは画像での対応をすることにいたします。
  
  何よりコンテンツの充実、とのアドバイス、ありがとうございます。
  そちらについて、まずはしっかりやっていこうと思います。
- 2015年9月4日 12:57 AM #31894
  わいひら
  キーマスター
  最新の子テーマを見たらちゃんと入っているようです。（添付画像）
  
  おそらく、Wordpressの管理画面上では表示されないのかもしれません。
  ダウンロードしたフォルダ内のファイルを編集しFTPとかでアップロードする必要があるかと思います。
  
  けど、画像でもOKだと思います。
  Attachments:
  2015-09-04_00h55_05.png
投稿者

投稿