「Tumblr」PCの表示と同じようにスマホでも表示できるようにしたい【T】

「Tumblr」でこだわりのテーマを選んでカスタマイズしていると、スマートフォンで見た時にデフォルトの簡素なデザインに切り替わってしまい、少しがっかりすることがありますよね。

「Tumblr」には、モバイル端末からのアクセスに対して専用のレイアウトを適用する機能が標準で備わっていますが、これをオフにすることでスマホでもPCと同じデザインを表示させることが可能ですよ。

自分の世界観を反映した背景やフォント、独自のレイアウトをどのデバイスでも一貫して見せたい場合に役立つ設定です。

画面サイズを問わず、自分のブログを本来の姿で見てもらうための設定手順を確認してみましょう。

モバイルレイアウトの設定をオフにする

スマホでPC版と同じデザインを表示させるには、Tumblrの表示設定を変更する必要があります。

• ブラウザからダッシュボードの設定を開き、対象のブログを選択して「外観を編集」に進みます。

• 詳細設定や表示オプションの中にある「モバイルレイアウト（デフォルトのモバイルテーマを使用する）」というスイッチを探してください。

• このスイッチをオフに切り替えることで、スマホからアクセスしてもPC版と同じテーマ（カスタムテーマ）が読み込まれるようになります。

注意点として、スイッチをオフにしても反映されるまで少し時間がかかる場合があります。

変更後はスマホのブラウザでキャッシュをクリアしてから、実際の表示を確認するようにすると失敗しにくいですよ。

レスポンシブ対応のテーマを活用する

PC版と同じデザインを表示させる際、そのテーマが「レスポンシブデザイン」に対応しているかどうかが重要になります。

1. レスポンシブ対応のテーマであれば、PCと同じ雰囲気を保ちつつ、スマホの画面幅に合わせて自動で要素が最適化されます。

2. 逆に対応していない古いテーマの場合、スマホ画面にPC用の広い画面がそのまま縮小して表示され、文字が豆粒のように小さくなってしまうことがあります。

3. PC版の表示を優先させたい場合は、あらかじめ「Responsive」というタグが付いたテーマを選んでおくのが安心です。

アドバイスとして、PCと同じデザインに固定した後は、メニューの押しやすさや画像の読み込み速度を実機でチェックしておくのが、訪問者のストレスを減らすために非常におすすめですよ。

スマホ表示での不具合をCSSで微調整する

PC版のデザインをスマホで表示させた際、どうしても一部のパーツが重なったり崩れたりすることがあります。

• そんな時は、テーマ編集画面にある「カスタムCSS」を活用して、スマホ時専用の調整コード（メディアクエリ）を書き加えてみましょう。

• 例えば「スマホの時だけサイドバーを非表示にする」「文字サイズを少し大きくする」といった調整を行うだけで、PCのデザインを活かしつつ使い勝手を向上させられます。

• 標準設定のスイッチを切るだけでなく、こうした一工夫を加えることで、より完成度の高いブログに仕上がります。

注意点として、モバイルレイアウトをオフにすると、Tumblr公式の便利なナビゲーションバーが消えてしまう場合があります。

フォロワーがスムーズに他のページへ移動できるよう、自前で分かりやすいメニューリンクを設置しておくことが、ブログの回遊性を高めるための鍵になるはずですよ。