ブログの作り方

ONEでブログを作る

TCDの「ONE」でブログを作る手順。トップ画面と記事の設定をします

TCDの「ONE」を購入したので、さっそくブログを作ってみようと思います。

実際に作ってみると、ONEはシンプルでブログを始めるまでの設定が少ないです。

すぐに記事を書き始めたい方にとって、かなりのメリットになりますよ。

少ない労力でインパクトのあるブログを作ることができるテーマですが、画像の取り扱いだけは注意が必要です。

何も気にしないでいると、素晴らしいテーマなのに、かっこ悪いブログになっていまいます。

では、今回はONEを使って、

・記事の作り方(注意事項)
・TCDテーマオプションの「トップページの設定」
・フッターウィジェットの設定

の部分を作ってみます。

これだけ設定できれば、かなりデモサイトに近い雰囲気になりますよ。

ONEのデモサイトはこちら>>

ブログ記事の設定

まずは、最低限必要な記事を用意します。

記事には、ONEで見栄えが良いように画像サイズを調整します。

画像は一手間かかりますが、そこだけはこだわった方が断然おすすめです。

1.記事の設定

ONEを使ったブログで、見た目がそれなりに見える記事数を考えてみると…

画面横幅いっぱいに表示される記事が3つ、おススメの特集記事が6つは必要です。

これだけの記事数があれば、おすすめ記事一覧や最近の記事などの表示を含めて、ボリュームがあるように見えます。

ということで、最低9記事くらい必要ですが…

今回は、ちょっと余裕をもたせて、ダミーの12記事で作成してみます。

WordPressメニューの、「投稿」→「新規追加」で記事12ほど作成してください。

文字の大きさの設定

記事を作成したら、少しフォントサイズを大きくしておきましょう。

「外観」→「TCDテーマオプション」→「ブログ」→「記事ページの設定」

の順にクリックします。

本文記事を14px→16px
本文記事(スマホ)を13px→15px

に変更してみてください。

文字数が多い人は、デフォルトのままの方がいいかもしれません。

2.最適なアイキャッチ画像

アイキャッチ画像は、だいたいどのテーマも同じサイズを使えばいいのですが…

ONEの場合は、横幅が長いアイキャッチにする必要があります。

いつも使っているアイキャッチをONEで使うと、画面のほとんどがアイキャッチになりますよ^_^;

では、最適なサイズですが、デモサイトの画像と同じサイズが良いでしょう。

横が1150p×、縦が420px

の画像だと美しいレイアウトになります。

そして、このサイズで切り抜くということは、高解像度の画像が必要になりますよね。

フリーでも高解像度の画像はありますので、イメージに合うものを探してみてください。

★高解像度画像はこちらからをどうぞ↓
アイキャッチ画像のおすすめサイトを探してみました>>

それから、切り抜きの方法ですが、無料のウェブサイトを利用するのが簡単です。

ピクセル単位でサイズを指定して切り抜きができますよ。

また、画像の圧縮もすることができます。

ONEは高解像度画像を使うので、画像サイズが大きくなりがちです。

切り抜いた後で、圧縮も忘れずにしておきましょう。

★画像の切り抜きはこちら↓
オンラインで画像編集できる無料サイト。指定サイズで切り抜き最適化する方法>>

トップ画面のアイキャッチ画像は、下の部分がタイトルやカテゴリーで隠れてしまいます。

それを考慮して、画像を切り取るようにしてくださいね。

トップページの設定

TCDテーマオプションの中に、「トップページの設定」をするところがあります。

トップページの設定をすれば、ブログの形がおおよそでできあがります。

今回は、ヘッダーコンテンツ、ブログ一覧の設定、おすすめ記事一覧の設定をしてみたいと思います。

CTAやフリースペースは後回しで大丈夫です。

1.ヘッダーコンテンツの設定

記事が用意できたら、次にヘッダーコンテンツを設定しましょう。

ヘッダーコンテンツは、ワードプレスメニューの、

「外観」→「TCDテーマオプション」→「ヘッダーコンテンツの設定」

を設定していきます。

ヘッダーコンテンツ

①ヘッダーコンテンツのタイプ
スライダーと動画が選べますが、ここはスライダーにしておきます。

②記事のタイプ
今回は、「すべての記事」にしました。
好みで「おすすめ記事1」にしてもいいですね。

③記事の並び順
ここは「ランダム」にしておきます。
訪問者がアクセスする度に違うトップ画面になるので、新鮮に感じると思います。

④表示する記事の数
今回は「7」にしました。
見てもらいたい記事の数に設定します。

⑤スライダーが切り替わるスピードの設定
「5秒」に設定しました。
訪問者は何秒もまってくれません。
すぐにスクロールしてしまうので、最短時間の5秒がおすすめです。

上記の5つを設定すれば、ヘッダーコンテンツの設定は終わりです。

2.ブログ一覧の設定

続いて、ブログ一覧の設定をします。

ブログ一覧の設定では、横幅いっぱいのアイキャッチがある記事の設定をすることができます。

「ブログ一覧の設定」は、先ほどの「ヘッダーコンテンツの設定」の下にあります。

ブログ一覧の設定

この中で設定するのは、「表示する記事の数」という部分です。

デモサイトは5にしてありますが、私としては強調する記事は3つでいいと感じました。

今回は「3」にしてあります。

3.おすすめ記事一覧の設定

おすすめ記事を設定していきます。

おすすめ記事一覧の設定では、2列表示で記事が表示される部分の設定ができます。

「おすすめ記事一覧」は、「ブログ一覧の設定」のすぐ下にあります。

おすすめ一覧の設定

①記事のタイプ
「すべての記事」にしておきます。

②記事の並び順
「ランダム」を選びます。

③表示する記事の数
「6」にします。
ここを少なくしすぎると、バランスが悪くなります。
6か8くらいがちょうど良いと思います。

④見出し
デフォルトのままにしています。
ここは好みでタイトルを変えてもいいですね。

上記の4つを設定したら、おすすめ記事一覧の設定は終わりです。

4.ウィジェットの設定

最後にフッターウィジェットを設定しましょう。

ここは、デモサイトのように3列のコンテンツに分けるのが一番バランスが良いです。

その3つのコンテンツを何にするかですが…

・最近の記事
・人気記事
・ピックアップ記事

がおすすめです。

では、それぞれに表示させる記事を選び、その後でウィジェットを設定していきたいと思います。

フッターウィジェット用記事の選択

フッターウィジェットで表示したい記事を選びましょう。

「投稿」→「投稿一覧」

で、投稿一覧画面を表示させます。

記事の設定

この画面で、おすすめ記事(上の画像の赤枠の部分)を設定します。

設定するには、マウスカーソルを記事タイトルの下付近に持っていきます。

すると、上の画像のように「クイック編集」というメニューが浮かび上がってくるのでクリックします。

記事の詳細設定

クイック編集画面になったら、上の画像の赤枠の中を設定してください。

それぞれの記事を一つずつクリックして設定し、最終的に、

「おすすめ記事1」を5つ
「ピックアップ記事」を3つ

作ってください。これが後でフッターウィジェットに表示されます。

これは後で変更できるので、適当に選んでしまってかまいません。

ウィジェットの設定

WordPressメニューの「外観」→「ウィジェット」→「フッター」に設定をしていきます。

フッターウィジェット1

まずは3列ある一番左に、最近の記事を5つ表示させます。

「フッター」ウィジェットの中に、「デザインされた記事一覧1」をドラッグしましょう。

すると、上の画像のようになります。

ここはデフォルトのままでOKです。

フッターウィジェット2

続いて真ん中の列に、人気記事を表示させます。

人気記事には、個々の記事に設定してある「おすすめ記事1」を使います。

もう一つ「デザインされた記事一覧1」をドラッグしましょう。

①タイトル
「人気記事」と入力します。

②記事のタイプ
「おすすめ記事1」を選択します。

フッターウィジェット3

一番右の列に、ピックアップ記事を表示させます。

ピックアップ記事には、個々の記事に設定してある「ピックアップ記事」を使います。

「デザインされた記事一覧2」をドラッグします。

①タイトル
好きな言葉を入力します。
上の画像では「おすすめ」となっていますが、「ピックアップ」とした方が分かりやすいですね。

②記事のタイプ
「ピックアップ記事」を選択します。

③表示する記事の数
ここは「3」にします。
最近の記事と人気記事が5つですが、ピックアップ記事は大きいので3つにしておくとピッタリです。

これでフッターウィジェットの設定は終わりです。

ここまでのまとめ

ここまで設定すると、

・ヘッダーコンテンツ
・大きい記事3つ
・小さめの記事6つ
・フッターウィジェット3列

の設定ができています。

それでは、ここまで作ったブログの外観を見てみましょう。

ONEの全体像

デモサイトと同じような雰囲気のブログになっていると思います。

他のテーマに比べて、基本設定はかなり早く終わらせることができますよね。

後は、メガメニューと、必要に応じてCTAの設定をしていけば完成です。

★次の記事でトップページはほぼ完成です↓
「ONE」でブログを作る手順2。カテゴリーメガメニューとCTAを設定>>

★記事下CTAの設定方法も書きました↓
「ONE」で記事下CTAを設定しよう。表示回数やクリック数等が測定できます>>

ONEの詳細はこちら>>

関連記事

  1. MAGの広告スペース

    TCDテーマ「MAG」の広告設置方法。広告ウィジェット編

  2. プロフィールトップ

    スワローでブログを作る手順2。カスタムHTMLでプロフィールを作成

  3. SANGOメニューボックス

    「SANGO」のテーマでメニューボックスを設置してみよう

  4. BRIDGEの注意点

    TCDのテーマ「BRIDGE」の設定をするときに気をつけたこと

  5. Diverの入力補助機能

    Diverの入力補助が超多機能。ボタンやバッジ作成機能を紹介します

  6. BRIDGEのカスタム投稿タイプ

    TCD「BRIDGE」のランキング機能の使い方を紹介します

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

CAPTCHA


PAGE TOP

メーカー別おすすめ

多機能かつ洗練されたWordPressテーマ「DigiPress」を5段階評価し…

fresco

メーカー別おすすめ

ブログに特化した「OPEN CAGE」のWordPressテーマを5段階評価して…

スワロー

メーカー別おすすめ

Web集客に特化した「EMANON」のWordPressテーマを5段階評価してみ…

EMANON

メーカー別おすすめ

マテリアルデザインのWordPressテーマ「SANGO」を5段階評価してみた

SANGOテーマ

メーカー別おすすめ

検索上位表示と収益化「Diver」のWordPressテーマを5段階評価してみた…

Diverのテーマ

メーカー別おすすめ

アフィリエイト専用のWordPressテーマ「AFFINGER」を5段階評価して…

wing-affinger5

メーカー別おすすめ

美しい日本語にこだわった「isotype」のWordPressテーマを5段階評価…

MONOSTYLE

メーカー別おすすめ

デザインの美しさは最上級!「TCD」のWordPressテーマを5段階評価してみ…

TCDのSwitch