ブログの作り方

MAGのブログのイメージ

TCDの「MAG」でブログを作る手順。簡単に美しいブログが完成します

TCDの「MAG」を購入したので、実際にMAGを使ってブログを作ってみました。

MAGでブログを作ると、どういう感じになるのかイメージが湧くと思います。

今回の設定にかかる時間は、記事を書く時間を除いた設定だけだと、20分もかからないくらいで完成します。

記事数がわずか5つしかないのに、それなりのブログができるというのはMAGの良いところですね。

★TCDのテーマはこちらもどうぞ↓
デザインの美しさは最上級!「TCD」のWordPressテーマを5段階評価してみた>>

★MAGはブログ部門の3位にさせていただきました↓
2018年、WordPressテーマの部門別お勧めベスト3を発表!>>

1 MAGをインストール

MAGをインストールしましょう。手順が分かっている方は飛ばしてくださいね。

MAGを購入すると、メールでダウンロードURLと設定マニュアルサイトURLを教えてもらえます。

ダウンロードURLから、mag_tcd036.zipをダウンロードしておきます。ZIPファイルですが、解凍しなくてOKです。

では、ワードプレスのメニューにログインしましょう。

MAGのインストール1

外観→テーマ→新規追加

とクリックします。すると下の画面になります。

MAGのインストール2

画面上の方にある「テーマのアップロード」からMAGのZIPファイルをアップロードします。

MAGのインストール3

「ファイルを選択」から、mag_tcd036.zipを選択し、「今すぐインストール」をクリックします。

これでインストールは完了です。忘れずに有効化しておきましょう。

2 TCDテーマオプションを設定

テーマがインストールできたら、TCDテーマオプションを設定します。

TCDテーマオプション

ワードプレスのメニューから、外観→TCDテーマオプションとクリックします。

すると上の画像を見てのように、TCDテーマオプションには、次の7つの設定項目があります。

  1. 基本設定
  2. ロゴの設定
  3. トップページ
  4. アーカイブページ
  5. 記事ページ
  6. ヘッダー
  7. フッター

ここで最初からすべての項目を設定する必要はありません。「ここ変えたいなぁ」という気分になってから変えればOKです。

今回は「基本設定」だけ設定しておきます。基本設定をクリックすると、最初にブログのカラーを変えるところがあるので、好きな色に変更しましょう。

カラーは、設定欄をクリックすると自動的にパレットが出てくるので、見た目で好みの色を選びます。

メインカラー、第2カラー、第3カラーを見た目できれいそうな色にしてみましょう。いつでも変えることができるので適当で大丈夫です。

私は、緑色のブログにしてみることにしたので、上の画像のように設定しました^^

設定したら忘れずに保存しておきましょう。

基本設定の中には、カラーの他にも…

  • レイアウトの設定
  • カスタムCSS
  • 絵文字の設定
  • レスポンシブデザインの設定

がありますが、とりあえずはデフォルトのままにしておきます。これだけでTCDテーマオプションは設定完了です。

3 記事を入れてみる

続いて、ブログがどんな感じになるのか確認したいので、記事を入れてみました。犬の画像があったので、適当に文字を入れて、画像を設定してみようと思います。

では、まずは投稿画面です。MAGの投稿画面は、下の画像のように、記事を書くのに必要な機能がデフォルトでたくさんあります↓
記事投稿欄

記事を書く場所の上に、ボタンがたくさん並んでいるのが分かるでしょうか?

ボタンを少し書き出してみると…

  • YouTube動画
  • 関連記事カードリンク
  • レイアウト
  • 見出し
  • 囲み枠
  • ボタン
  • 広告

といった、ボタンがあります。

このボタンはクイックタグと言って、文字の装飾をすることができます。

例えば、文字を選択してから「囲み枠」のクイックタグを押せば、その文字が線で囲まれます。MAGはデフォルトでクイックタグの種類がたくさんありますね。

さて、とりあえずブログの完成形が見たいので、ダミー記事をいくつか作成してみましょう↓
記事プレビュー

「投稿」メニューをクリックするし、一番上の「新規追加」ボタンをクリックすると記事を書く画面になります。

その画面で文章を書いて、アイキャッチ画像を入れてみました。アイキャッチ画像の設定は、投稿記事の画面から好きな画像を選ぶだけなので簡単です。

5つダミー記事を入れて、それぞれアイキャッチ画像を設定すると、記事一覧画面は上の画像のようになります。

記事一覧画面はテーマによって違うんですが、MAGの一覧画面は見やすいですよ。

では、適当に作った5つの記事ですが、実際に訪問してくる人にどのように見えているのかプレビューしてみます↓
記事投稿欄2

あれ!?

シンプルすぎますね^_^;

現時点では、ウィジェットを設定していないので、記事の右側に何も表示されていません。

これだけでは寂しいので、記事の右側にウィジェットを表示させてみましょう。雰囲気が変わりますので。

4 ウィジェットを入れる

MAGのウィジェットを設定していきます。「外観」→「ウィジェット」と選択します。

すると、MAGのウィジェット設定画面になります↓
MAGのウィジェット1

「利用できるウィジェット」と書かれている下にある項目がウィジェットです。

この中から自分のブログで使いたいものを選びます。MAGのウィジェットは、

  • Googleカスタム検索(tcdバージョン)
  • カテゴリー一覧(tcdバージョン)
  • スクロール追尾型広告(tcdバージョン)
  • デザインされた記事一覧(tcdバージョン)
  • ユーザープロフィール(tcdバージョン)
  • 広告(tcdバージョン)
  • 動画
  • 画像
  • 音声

などがあります。追尾型広告やユーザープロフィールが特徴的です。

(tcdバージョン)と書かれている項目は、TCDオリジナルデザインのウィジェットです。デザインが美しいので是非使ってみましょう!

今回は、デザインされた記事一覧(tcdバージョン)、ユーザープロフィール(tcdバージョン)、カテゴリー一覧(tcdバージョン)、カレンダーを使いたいと思います。

MAGのウィジェット2

上の画像のように、「トップページ」と書いてある項目に、上の4つのウィジェットをマウスでドラッグします。

ドラッグできたら、それぞれの項目を設定していきましょう。と言っても、今回はユーザープロフィール以外はデフォルトのままにしておきます。

では、ユーザープロフィールを作成しましょう。

「ユーザープロフィール(tcdバージョン)」の▼をクリックして詳細を表示させます。

MAGのウィジェット3

プロフィールを入力する欄が出てくるので、画像やプロフィールを入力します。

このときに、その下にあるツイッターやフェイスブックなどの項目を入力しておくと、プロフィールの下にリンクアイコンが自動で作成されます。

これでプロフィールは完成です。ここまでで、画面はこうなります↓
MAGウィジェット1

画面の上半分はこんな感じです。だいぶ画面がにぎやかになってきましたよね^^

プロフィールの下には、ツイッターやフェイスブックのアイコンができているのが分かります。カーソルが乗ると緑色になりますよ。

また、「最近の記事」では、自動的にアイキャッチ画像のサムネイルが表示されています。

上から2番目のアイキャッチ画像で使っているのは、縦長の画像なんですが、綺麗にサムネイルになっています。

MAGウィジェット2

画面の下半分はこうなっています。一番上の記事が大きく表示され、二番目以降は少し小さく表示されていますね。

カレンダーは目立つ必要は無いので、デザインに上手く溶け込ませたデザインになっています。

これで、だいぶブログらしくなってきました。でも、タイトルの上にメニューがあった方がいいですよね。ということで、次はグローバルメニューを作っていきます。

5 グローバルメニューを作る

画面の一番上にある、グローバルメニューを作ってみます。それには、まず元になるメニュー項目を作らないといけません。

ワードプレスのメニューから、「外観」→「メニュー」とクリックします。

MAGのメニュー2

メニュー名を付けます。ここでは、「メニューわん」にしました。「メニュー作成」をクリックしてメニューを作ると、次の画面になります↓

MAGメニュー1

  • 固定ページ
  • 投稿
  • カスタムリンク
  • カテゴリー

の中から、メニューにしたい項目にチェックを入れ、「メニューに追加」ボタンをクリックします。

MAGメニュー2

今回は上の画像のように、5つの項目をメニューにすることにしました。

この5つの項目の下に、「グローバルメニュー」というチェック欄があるので、忘れずにチェックします。

ここまでで、画面は以下のようになります。一番上にメニューができていますね^^

MAGメニュー3

グローバルメニューは、カーソルが乗ると色が変わるようにできています。見た目も操作性も良くなるので、グローバルメニューは作ることをお勧めします。

6 お気に入り記事をフッターに表示

さて、最後に一番下のフッター部分に、お気に入り記事を表示させてみましょう。

ワードプレスのメニューから、投稿→投稿一覧とクリックしてください。
MAGフッター1

記事の行にカーソルを合わせると、「クイック編集」というメニューが出てくるのでクリックします↓
MAGフッター2

クイック編集の中に、「おすすめ記事に表示する」というチェック欄があるのでチェックし、更新ボタンを押します。

これで投稿一覧のおすすめ記事の列に、「おすすめ記事」と表示されました↓
MAGフッター3

この要領で、おすすめしたい記事すべてに同様の設定をします。さあ、これで完成です! 画面は以下のようになります。

画面の一番下にあるフッター部分に、おすすめ記事が5つ並びました↓
MAGフッター4

MAGでブログ完成

以上でMAGでブログを作る手順は終わりです。完成した画面は以下のようになります。

MAGブログ完成

MAGブログ完成

いかがでしょうか。たった5つの記事でできているようには見えないんじゃないでしょうか。

もっとウィジェットを増やして「人気記事ランキング」を表示してみたり、ツイッターなどを埋めこんでみたりすると面白いブログになりますよ。

基本的にはカスタマイズ無しで充分に美しいブログができるのですが、慣れてきたらカスタムCSSを使うとオリジナリティーが出せます。

CSSって知識が無いとどこをどう変えたら良いのか初心者では分かりません。でも、MAGは投稿記事欄の下にカスタム欄という専用の場所があるので本当に分かりやすいです^^

CSSは専門のサイトからコピペすればいいし、気に入らなければすぐに元に戻せます。

この辺りはMAGは良く出来ているなと思います。

ちなみに、こちらはカスタムCSSを使ったボタンのカスタマイズ方法です。コピペで使えます↓
MAGのクイックタグをカスタマイズ。ボタンのデザインを変えてみた>>

それから、MAGはロゴやプロフィールを設定するところがあります。ロゴや似顔絵アイコンを作ると、さらに独自の色が出ると思います。

ロゴやアイコンについては、こちらもどうぞ↓
デザイナー作成のロゴやアイコンを格安で。お得なサービスを使おう>>

今回は簡単にブログの形を作ってみましたが、初心者に優しい作りになっているなと思いました。

そして、シンプルに見えるけれどこだわって作ってあり、デザインは美しく見えるように工夫されています。

MAGは、シンプルで美しいブログ向けテーマを探している方にお勧めできます。

MAGの詳細はこちら>>
 
 

関連記事

  1. Diverでブログを作る

    Diverでブログを作る手順1。プロフィールや記事スライダーを設定しよ…

  2. スワローでブログ作成1

    スワローでブログを作る手順1。基本設定と人気記事を作成

  3. プロフィールトップ

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

  4. スワローでブログ作成

    スワローでブログを作る手順3。スライダーを設置してみよう

  5. Bloomでブログを作る

    Bloomでブログを作る手順1。記事スライダーとウィジェットを設置

  6. カスタムCSS欄

    TCD「MAG」のカスタムCSSを使ってみた。ボタンのデザインを簡単に…

コメント

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

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

CAPTCHA


PAGE TOP

メーカー別おすすめ

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

スワロー

メーカー別おすすめ

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

EMANON

メーカー別おすすめ

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

SANGOテーマ

メーカー別おすすめ

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

MONOSTYLE

メーカー別おすすめ

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

Diverのテーマ

メーカー別おすすめ

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

TCDのSwitch

メーカー別おすすめ

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

wing-affinger5

メーカー別おすすめ

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

fresco