晃(株式会社デック)2017年2月3日更新ツイート閲覧数5,644viewsこのコラムをPDF形式でダウンロードするはじめてWEBのホームページは「独自レイアウト」を利用するとHTMLやCSSを記述してオリジナルのレイアウトを作成することができます。「独自レイアウト」を選択している時に「スマートフォン表示」を有効にするとスマートフォンで表示専用のCSSを編集することができます。ホームページにログインをします。レイアウトを「独自レイアウト」に変更しておいてください。次に、ページ上部の「管理メニュー」ボタンをクリックします。画面の左側にメニューが表示されますので、「デザイン」をクリックします。デザインのメニューから「独自レイアウト(CSS)」をクリックします。「スマートフォン用レイアウトをCSSで編集」のチェックボックスをクリックしてチェックを入れてください。入力欄にCSSを書き込んでください。書き込んだCSSがスマートフォン用レイアウトに反映された状態をプレビューで確認できます。CSS内に画像を表示させる場合は、あらかじめ独自レイアウトの編集ページの「ファイル」のタブから画像をアップロードしておく必要があります。アップロードが完了している場合はCSSで画像を追加したい位置をクリックしてカーソルを合わせ、「画像の利用」ボタンをクリックしてください。アップロードした画像のリストが表示されますので、この中から使用したい画像を選択してクリックしてください。カーソルのある位置に画像を表示するためのCSSが追加されます。アップロードした画像は、URLではなくファイル名を指定して表示します。CSSを書き終えたら「保存」ボタンをクリックして保存してください。スマートフォン用のCSSがホームページに反映されます。スマートフォン表示が有効になってない場合は、スマートフォン用レイアウトのCSSを編集することはできません。画面右上の「スマートフォン表示」ボタンをクリックして、スマートフォン表示の機能を有効にしてください。執筆者の活用術スマートフォン用のレイアウトは13種類用意されていますが、色などは決まっているため、パソコンで表示したときとイメージが変わってしまう場合があります。そのような時にスマートフォン用のCSSを書き込んでレイアウトをカスタマイズしてみてください。代表取締役/JimdoExperthttp://s-deck.jp/http://jp-m.jimdo.com/愛知県名古屋市を拠点に活動するWeb制作の会社の代表。2009年Jimdoに出会い、より多くの人にJimdoの便利さ/楽しさを伝えるべく解説ページ「Jimdoでつくる簡単ホームページ!」を開設。JimdoJapan公式のJimdoCafeを運営するなど、Webサイトを多くの人にもっと身近に感じてもらうべく活動中。著書に『WebデザイナーのためのJimdoスタイルブック』(共著、マイナビ)。ための経理サポートサイト文具、通信、オフィスのことなら何でもお任せ問い合わせ件数をアップさせるなら!「通話料無料・わかりやすい番号」のフリーコール事務所開設するなら固定電話番号で信頼アップ本コンテンツは、掲載時点の内容となります。「みんなのビジネスオンライン」は「はじめてWEB」にお読み替えいただきますようお願いいたします。Reserved.「はじめてWEB」はKDDIが提供しています。