WordPressの記事タイトルを改行してサイズ縮小したサブタイトルをつける方法~WordPress覚書き~とあるWordpressサイトで、ブログ投稿の記事タイトルにサブタイトル(副題)を入れる時に、サイトデザイン的にサブタイトルを改行したい&サブタイトルのサイズを縮小したかったので、実装した際の覚書き。スポンサーリンクstr_replaceを使ってタイトルを改行する記事タイトルを改行したい場合は、str_replaceを使う方法が定番のようです。/>)に置換されるようにする方法です。$title;?>single.phpなどのタイトルを表示する場所に上のコードを書いて、記事を作成する際に、タイトルの改行したい場所に半角スペース×2を入力すれば完了です。(通常はタイトルの表示にthe_title()を使ってると思うので、それを上のコードに書き換えればOK)参考:WordPressで任意ページのタイトルだけ改行させる方法もちろん、function化して使うのもアリです。$title;}?>これをfunctions.phpに追加して、the_title()をthe_title_br()に書き換えればOK。個人的にはこっちの方がスッキリして好きです。ちなみに、別に半角スペース×2でなくとも(何か記号とか)でも良いのですが、トップページや関連記事のリンクに表示される記事タイトルなど、記事ページ(single.php)以外でもその記事のタイトルが使用される個所があるので、その部分で表記が乱れないようにするために、半角スペースが無難なのではないかと思います。(記事ページ以外の箇所では、置換される前のタイトルが表示されます。)str_replaceを配列で使って文字サイズを指定するこれを応用して、半ば無理やりですが、改行後の行の文字サイズを縮小させます。これで、サブタイトルっぽくスッキリしたデザインになりました。後ろに「半角ハイフン+全角スペース」を入れることで、半角スペース&エムダッシュ&span終了タグを出力するようにしました。後ろ側の検索文字列がなぜ全角スペースかと言うと、記事タイトル入力欄の最後の半角スペースは無視されてしまうからです。あと、記事タイトルの半角ハイフンの後ろが全角文字でない場合は、半角ハイフンはエヌダッシュに自動変換されてしまうので、検索文字列に半角ハイフンを指定する場合は要注意です。(WordPressのデフォルトの設定らしい。徹底するなら半角ハイフンではなく、全角ハイフンを使うのもアリかなと思います。誤入力の可能性が出てくるけど。)今回は、特にクラス指定などしませんでしたが、CSSのメディアクエリでPCビューとスマホビューでサイズを分けた方が、よりデザインが崩れなくて良いのかもしれません。参考:str_replace-文字列関数コードは若干無理矢理感ありますが、参考になれば嬉しいです。*Website上に表示された文字を入力してください。»AUTHORZack(♂)大学院修了後、26歳で国内IT企業に新卒入社するも約4か月で退職。その後、動画教育系サービスのローンチに向けて、日々奮闘。基盤を整えるべく映像制作にシフトした後、出張先でたまたま出会った数秘術に「人間教育」の可能性を実感し、仕事に取り入れ始めました。動画もwebも数秘術もほとんど独学。ここから、どこまで行けるか分かりませんが、行けるところまで行ってきます。Posts48時間放置!BOSEのBluetoothスピーカーの電源が入らないor充電できない時の対処法~BOSE覚書き~iTunesアップデート中に「このWindowsインストーラパッケージには問題があります。