体験を伝える―『ガジェット通信』の考え方

面白いものを探しにいこう 本物を体験し体感しよう 会いたい人に会いに行こう 見たことのないものを見に行こう そしてそれをやわらかくみんなに伝えよう [→ガジェ通についてもっと詳しく] [→ガジェット通信フロアについて]

自分でカスタマイズしよう!WordPressでCSSを編集する方法【初心者向け】

WordPressの各テーマで使用されているcssファイルを編集する方法を、管理画面から行う方法とFTPクライアントを使用してファイルを更新する方法の二つを紹介します。自分でカスタマイズできるようになると好きなデザインに整えられるので覚えておくとよいでしょう。

なお本記事は、TechAcademyのWordPressオンラインブートキャンプの内容をもとに紹介しています。

 

20160620

 

田島メンター!!WordPressで良いテーマがあったんですけど、ちょっとそのままじゃなくて自分なりに修正したいんです。どうしたらいいですか!?

20163020-2

 

それなら、テーマのCSSを修正するとできるよ。ちょっとやってみようか?

 

20160620

 

はい、お願いします!!!

 

 

今回はwordpress.orgで配布されている公式テーマTwenty Fifteenを使用します。
カスタマイズ等を行っていない状態だと、PCではこのように表示されています。

wpcss_p_1

 

管理画面から編集する

WordPress管理画面の左メニュー「外観」から「テーマの編集」を選択します。

wpcss_p_2

右のファイル一覧から「スタイルシート(style.css)」を選択します。

wpcss_p_3

この画面からcssの編集を行います。
テーマによっては作成者による解説も表記されているため、編集の際に参考にすることができます。

wpcss_p_4

Ctrl+Fを押すと表示しているページ内で検索ができます。
変更したい箇所に関する単語などを入れると便利です。

wpcss_p_5
1 2 3次のページ
TechAcademyマガジンの記事一覧をみる
  • 誤字を発見した方はこちらからご連絡ください。
  • ガジェット通信編集部への情報提供はこちらから
  • 記事内の筆者見解は明示のない限りガジェット通信を代表するものではありません。