MENTAやTimeTicketでZoomオンライン指導・メンタリングを行っています。
WordPressやHTMLサイトのトラブル、SEO対策のご相談、HTML・CSS・WordPressなどのレクチャーなどが可能です。


【tomomi 様】WordPressでサイトタイトル、キャッチフレーズの改行について

初めまして。
サイトタイトル&キャッチフレーズの改行ができず悪戦苦闘しています。
ネットで出ているやり方は試したものの全く改行されず、表示されずで困っています。
もしよろしければ、教えていただくことは可能でしょうか?宜しくお願い致します。


>tomomiさま
ご相談ありがとうございます。

これらについては、管理画面からはほぼできないと思ってもらった方がよいでしょう。

一応方法はあります。

1.テーマに直接書き込む
2.CSSでwithなどを決める

1.テーマに直接書き込む(header.phpなど)

多くの場合、header.phpの中でサイトタイトルが表示されています。

<h1 class="site-title">
  <a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home">
    <?php bloginfo( 'name' ); ?>
  </a>
</h1>

この中の bloginfo という関数は一般設定のサイトタイトルやキャッチフレーズ、URLなどの登録されている情報を取得して表示しています。
bloginfo( ‘name’ )ならサイトのタイトル
bloginfo( ‘description’ )ならキャッチフレーズ
を表示します。
一般設定 サイトタイトル キャッチフレーズ

詳細はこちらで確認しましょう。
WordPressコーデックス bloginfo

この部分は直接書き換えてしまえば任意のテキストにすることも可能なんですね。

<h1 class="site-title">
  <a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home">
    任意のテキスト。<br>
    brタグで改行することもできます。
  </a>
</h1>

外観>テーマ編集 から可能ですが、テーマファイルを直接編集する時はFTPソフトなどでバックアップを取っておくことも忘れずに!

テーマの場所は
/wp-content/themes/twentytwelve(テーマ名と同じフォルダ)/
となります。

2.CSSでwithなどを決める

もしCSSに詳しければ、CSSで疑似的に改行することもできるでしょう。

.site-title {
    width: 7em;/* 7文字で折り返す */
}
.site-description {
    width: 8em;/* 8文字で折り返す */
}

emという単位は文字数に等しいものです。
この場合、文字数が多い場合は3行になってしまうなどの弊害も出てきますので用途は限られますが、文字数によってはアリかもしれません。
CSS改行

CSSの追記場所は外観 > カスタマイズ > 追加CSS などでも可能だと思います。style.cssに追記する場合は前述のとおりバックアップも取っておくか、子テーマで行いましょう。

参考にして頂ければ幸いです。

おすすめコンテンツ

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA