(タイトルなし)YMS:Stripe決済システム構築手順いよいよです。特定商取引法に基づく表記HOME新着記事ブログブログデザインをいい感じに作る方法【WordPressテーマの選び方・編集方法】ブログデザインをいい感じに作る方法【WordPressテーマの選び方・編集方法】ブログブログブログのデザインがイマイチしっくりこないな...。綺麗で、見やすいデザインにしたいけど、その具体的な方法がわからない。主要WordPressテーマの使用経験こういった経験を積む中で、ブログをいい感じのデザインにするにはコツがあることが分かりました。よって今回は、いい感じのデザインを作る上で必須のWordPressテーマを選ぶコツや、ブログ初心者でも出来るデザイン修正方法を解説します。ちなみに、デザインが悪いままだと...ユーザー行動データが悪化ブログのSEO評価が悪化アクセスが減り、収益も減るこのような実害が及ぶので、ブログデザインは重要ですよ。2019年10月にブログでご飯食べられるようになり、その経験を生かして、現在はYoutubeにてブログで稼ぐノウハウを発信中。まとめ:ブログデザインは追い追い改善でOK1WordPressテーマ選びのコツWordPressテーマとは、ブログのデザインテンプレートのことで、要はデザイン一式が揃っているファイルです。ブログのデザインはこのWordPressテーマで9割決まります。ここで良いテーマを選べるかが重要。筆者がWordPressテーマを選ぶ際に気をつけているポイントは3つあります。デザインカスタマイズの自由度SEO対策が十分かどうか表示速度が速いかどうかこの3ポイントが高水準のWordPressテーマを選ぶと、デザインに後悔しないブログ運営ができますよ。テーマ選びのコツ1:デザインカスタマイズの自由度まず、どれだけそのWordPressテーマのデザインに自由度があるかが重要です。いうのも、デザインの自由度が低いWordPressテーマだと、しかるべきところで最適なデザインを選択できないから。THORだと、カスタマイズ画面が20項目くらいあります。これくらい自由に編集できると、色々とカスタマイズするときに便利。効果的なデザインが可能です。以下のように、見出しデザインを変更できたりします。THORは見出しデザインだけで50種類以上あり、理想のブログデザインにできます。デザインボックスも以下のように色々あるし...びっくりボックスハテナボックスQuestionボックス付箋ボックスピン留ボックスボタンも幅広いデザインがあります。こんな感じのボタンが10種類あるよこういった様々なデザインが最初から入っているWordPressテーマを選ぶと、カスタマイズの作業が減って執筆に集中できます。自由度の高いWordPressテーマかどうかって、どこで判断すればいいの?その場合は、WordPressテーマのデモサイトを見てみましょう。デモサイトはテーマのアピールできる所をまとめており実際のテーマのイメージと近いので、ここを見てデザインの自由度を判断できます。THORについて詳しく知りたい方向けに、以下の記事を作りました。THORの評判を正直にレビュー【こんな人にはおすすめしない】テーマ選びのコツ2:SEO対策が十分かどうかWordPressテーマって、デザインテンプレートだよね。SEO対策が関係するの?こう思う方も多いと思いますが、実はけっこう重要です。いうのも、SEO対策に強いWordPressテーマは、検索エンジンのクローラーから高い評価をもらいやすい構造だから。そもそもブログ記事が検索結果に表示されるのは、クローラーと呼ばれるロボットがブログと検索エンジンを行き来することで成り立っています。いうことは、クローラーが巡回しやすいサイトの構造でないと、そもそも僕らのブログ記事は検索結果に表示されない。いうと、クローラーが巡回しやすいサイト構造であれば検索順位が上がりやすいことが分かっています。サイトの構造が重要なんです。サイト構造が最適化されてるSEOに強いWordPressテーマを選ぶためには、どこを見ればいいの?ここが気になりますよね。これを説明するとプログラムの話になってしまうので省きます。筆者の使用経験がある中でも、SEOに強くて人気のWordPressテーマを列挙します。THORSANGOAFFINGERSEOに強いテーマは他にもありますが、この辺りを選べば間違いはないと思いますよ。テーマ選びのコツ3:表示速度が速いかどうか表示速度って、ブログを伸ばすために必要かな?こう思う人いるかもしれないですが、めちゃめちゃ大事です。表示速度が2秒落ちただけで、50%の読者がサイトを見るのをやめてしまうくらいなので、アクセス数にも直に影響しますし、SEOにも悪影響です。DeNA事例から学ぶWebの自動最適化手法なので、できるだけ高速表示されるWordPressテーマを選びましょう。WordPressのテーマ選びのコツということで、WordPressのテーマ選びのコツをまとめると...デザインカスタマイズの自由度SEO対策が十分かどうか表示速度が速いかどうかこの3つが重要なポイントです。よし、WordPressテーマを使って良さげなデザインにするぞ。あれ、でも、具体的な方法が分からない...。このような方向けに、WordPressテーマを設置して、編集する方法を解説していきます。3WordPressテーマを設置して、編集する方法テーマを用意するテーマの新規追加テーマのアップロードデモサイトをインストールこの流れで解説していきます。1テーマを用意するテーマを購入する方法は、そのテーマによって違うんですが、流れはどこも一緒。THORの流れを紹介します。次は、WordPress側の設定です。自分の説明する手順だけではなく、購入したWordPressテーマの取扱説明書と、公式ホームページの注意書きをみてから進めましょう。WordPressの左のバーから「外観→テーマ」を押します。Seventeenくらいしかテーマが入っていないと思います。上記テーマを使ってもいいんですが、使ってみるとシンプルすぎるし分かりにくいので、新しいテーマを入れましょう。新しいテーマは「新規追加」をクリックします。3テーマのアップロードそして、以下の「テーマのアップロード」というボタンを押すのですが、注意点があります。zip」という2種類のファイルが出てくるはずです。zip=子テーマ親テーマがメインのWordPressテーマファイルで、子テーマはサブ。両方とも使いますなぜ、子テーマも必要なの?それは、親テーマを直接編集し、ミスった時に取り返しがつかないから。親テーマの一個下の階層である子テーマで編集することにより、復旧作業ができる...みたいな感じです。いうことで「ファイルを選択」を押して、親テーマを選択して、インストールします。ここでは有効化は押さず、次に、子テーマをインストールし有効化します。すれば、適切な形でテーマのデザインが変更されているはず。4デモサイトのインストール3の手順のままだと、まだ良い感じのブログデザインになっていないはずなので、更にもう一つ手順を踏んでいきます。何をするかというと、デモサイトをインストールすることです。THORのデモサイト一覧デモサイトとは、テーマの公式ホームページにあるテンプレート。THORだとこんな感じです。デモサイトのページでは、ダウンロードボタンがあるはず。そこを押せばファイルがダウンロードできます。ここの手順は、WordPressテーマによって違うので、各自ググってみてください。THORの手順はこんな感じ。Export/Importというプラグインをインストール外観→カスタマイズ→エキスポートを開くダウンロードしたデモサイトファイルをインポート4細かいところを修正し、いい感じのデザインにする方法ここまでの手順で、それっぽいブログデザインができましたよね。...このままでは他のブログと被る自分好みのブログデザインにしたいひと工夫加えて、良い感じにしたいこう思う方も多いと思うので、いい感じのデザインにする方法を解説していきます。重要なデザインが...トップページのデザイン本文のデザインこの二つなので、ここを良い感じにする方法を説明します。→テーマ(デモサイト)をインストールしたままのトップページ。固定ページ→自分で一から自由にデザインできるトップページ(当ブログもコレ)。デフォルトのデザインを根本的に変えたい人は固定ページ、デフォルトを少しいじる程度でOKなら最新の投稿...というイメージです。THOR独自の設定もあるので注意)。最新の投稿の場合、これだけ。ちなみに、WordPressのデザインを編集する際、「サルワカ」というサイトが非常に役立ちます。固定ページこのやり方は少し手間がかかるし、部分的にCSS・HTMLの知識が必要なので、そこは注意してください。全体の流れ表示設定の「固定ページ」にチェック「外観→ウィジェット」を開く必要な要素を追加コードをコピペ保存1、2は上でわかると思うので、3以降を解説します。外観からウィジェットを開き、トップページ上部エリアに必要な要素を追加。ここに何を入れるかは、完全に皆さんのやり方次第なので、今回は当ブログのトップページデザインの作り方を紹介します。当ブログのトップページデザインは3つの構成で成り立っていて...4枚のカード新着記事ブログの稼ぎ方(記事ID指定)下二つは、ウィジェット上の設定でできます。4枚のカードはHTMLを入れる必要があります。当ブログと同じようなカードを入れたい方は以下をどうぞ。CodePen.ちなみに、URLの部分は変更して使ってくださいね。これをそのままコピーしても、今表示させているようなデザインにはならないと思います。その場合は、CSSをいじってもらう形。ここでつまづく人が多いと思いますが、そこは自分で勉強してくださいね。この辺りは、WordPressテーマによって違います。ググれば解説記事がたくさん出てくるので、それを見ながら試してみてください。2本文のデザイン本文はブログデザインの中でもかなり重要。いうのも、読者は本文を読んでいる時間が何よりも長いわけで、本文が読みにくいデザインなら離脱されてSEOにも悪い影響を与えてしまいます。本文は、皆さん黒で表示させると思いますが、あまりにも真っ黒すぎると、白と黒のコントラストが強すぎて目がチカチカします。「なんかこのブログ読んでいて疲れるなあ...」と思われるので、若干グレーにした方が良いです。ちなみに、当ブログが使っている本文の色は、カラーコードだと「#3d3d3d」。本文を変更する方法は、カスタマイズ画面か、追加CSSでできます。行間WordPressテーマのほとんどは、デフォルトだと行間狭すぎます。ここは改善した方が良いです。いうのも、行間ってこれくらい空いていないと、見にくいんですよね。これくらいの行間ならどう思いますか。コレが本文中、ず〜〜っと続くと、見にくいと感じるはずなので、自分は2.7emくらい空白を入れています。すると、だいぶ読みやすくなったと思います。細かいところを修正して、いい感じのデザインにする方法を解説してきました。ブログのデザインは最初から完璧を目指してはダメです。そんなことをしていたら、いつまで経っても記事をかけません。デザインをいじっても稼げません。デザイン編集と同時進行で、ブログで稼ぐ方法についても勉強しましょう。当ブログでは、ブログで最初の1円稼ぐ方法について解説してます。WordPress.。