スマートフォンサイトを表示する

  1. TOP
  2. みんビズ制作講座 デザインカスタマイズ : 第10回 日付のカスタマイズと分類機能の活用方法

エキスパートコラム

みんビズ制作講座:デザインカスタマイズ(全10回)

第10回:日付のカスタマイズと分類機能の活用方法

執筆:赤間 公太郎(株式会社マジカルリミックス)

2013年3月21日更新

  • このエントリーをはてなブックマークに追加

閲覧数7,016views

このコラムをPDF形式でダウンロードする

みんビズのブログ機能は、日付表示のカスタマイズや、「分類」を使用して年月や記事の種類ごとに記事を表示させることができます。

それぞれの方法を見ていきましょう。

日付のカスタマイズ

みんビズのブログ記事を投稿すると、通常、記事タイトルの左側に青い背景色のついた状態で日付が表示されます。テンプレートのデザインによっては、位置や色を変更したい場合もあるでしょう。みんビズのブログでは、日付の表示位置や色、表示項目を設定することができます。

メニューのスタイルアイコンをクリックし、「ブログスタイル」をクリックします。

「スタイル」をクリック後、「ブログスタイル」をクリック

日付の表示を変更するための設定項目が表示されるので、変更したい箇所を変更していきます。

「ブログスタイル」で変更できる、日付の変更項目

1コンテンツ 日付で表示する項目を選ぶことができます。
2カラー 日付の背景色と文字色を変更できます。
カラー1が背景色、カラー2が文字色です。選択した色は、「標準」と「独自レイアウト」以外に適用されます。
3配置 日付を表示する場所を選択できます。記事タイトルの左に出すか、右に出すかを選択できます。
4日付のスタイルを選択 日付の表示スタイルを選択します。
Point

みんビズで選択できる日付は、基本的に日付が先に来るレイアウトになっています。これは、みんビズのシステムである「Jimdo」がもともとは海外で開発されたことに関係しています。
しかし、日本では通常「年・月・日」の順番で日付を表示するため、少し違和感があります。日付の並びを変更するには「日付のスタイルを選択」の「独自レイアウト」を選択し、CSSで調整します。ただし、CSSについての専門的な知識が必要になります。

「保存」をクリックすると、自動的にプレビュー画面に移動します。
ページ上部に「このブログスタイルを使いますか?」というメッセージが出るので、問題がない場合は「はい」をクリックして、スタイルを適用します。

自動的にプレビューに切り替わる。表示に問題がなければ「はい」をクリックする

ページ下部の「プレビュー」をクリックして、実際の表示を確認してみましょう。

自分で設定した日付のスタイルに変更される

分類の活用方法

一般的なブログでは、記事を何件か作成していくと、通常「カテゴリ」や「年月別」ごとの一覧が自動的に作成されます。
みんビズのブログ機能では、自動的にカテゴリや年別別の一覧は作成されないため、自分で各分類の表示用ページを作成する必要があります。

分類ごとのページを表示するには

分類ごとのページを作成する前に、記事に分類を入力しておく必要があります。今回は「2013年3月」という分類を作成します。

まず、ブログの記事を作成します。記事を作成する際、分類を入力します。

分類に「2013年3月」と入力する

Point

分類は、複数設定することができます。
また、分類を表示するページを作成するには、その都度ページを作成する必要があります。

次に、2013年3月の記事を表示するページを作成しましょう。
メニューにマウスカーソルを重ね、「ナビゲーションの編集」をクリックします。

メニューにマウスカーソルを重ねると出てくる「ナビゲーションの編集」をクリック

「+新規ページを追加」をクリックすると新規ページが追加されます。
追加するページの名前を入力して「保存」をクリックします。

「+新規ページ追加」をクリックして追加するページの名前を入力後、「保存」をクリック

メニューの「ブログ」をクリックします。

「ブログ」をクリック

ページ右側に表示されている、作成したページのタイトル「2013年3月」をクリックします。
※使用しているテンプレートによって、表示される位置は異なります。

「2013年3月」をクリック

「新項目を追加」をクリックします。

「新項目を追加」をクリック

「ブログ表示」をクリックします。

「ブログ表示」をクリック

「分類」の入力フォームをクリックすると、現在使用している分類が表示されます。
「2013年2月」をクリックして選択し、「保存」をクリックして保存します。

表示する分類を選択して、「保存」をクリックする

これで、このページには「2013年3月」の分類を設定した記事のみが表示されます。

2013年3月のページ。指定した分類の記事だけが表示される

まとめ

  • ブログ記事の日付は、表示項目、背景色、文字色、スタイルを変更することができる
  • 年月日の並びは、独自レイアウトを選択した上でCSSを調整することで変更できる
  • 分類ごとのページを作成するには、表示用のページを作成してから分類を選択する

さいごに
以上で全10回のリレーコラム「デザインカスタマイズ」を終了します。
デザインは、あらかじめセオリーやルールを知っておくとより良いものができあがります。
皆さんも、私たちのコラムを参考に、自分なりのデザインの強み・ポイントを見つけてみてください。
最後までお読みいただき、ありがとうございました。

  • このエントリーをはてなブックマークに追加
このコラムをPDF形式でダウンロードする

赤間 公太郎(あかま・こうたろう)

赤間 公太郎(あかま・こうたろう)

株式会社マジカルリミックス 代表取締役CEO/JimdoExpert
http://www.magical-remix.co.jp/
http://www.kotalog.net/

宮城県出身。コンピューター系の専門学校を卒業後、仙台のデザイン会社に入社。
Webサイトのデザイン・コーディングをはじめとし、各種デジタルメディアのデザインに従事。2002年に退職し、しばらくフリーランスとして活動。2007年に株式会社マジカルリミックスを設立。社内での業務担当は、Webサイト運用に関するコンサルティング、社内向けITトレーニング、セミナー出演、執筆など。2005年より仙台市内の専門学校において、非常勤講師としてWeb制作の講義を担当。
主な著書に『HTML5+CSS3の新しい教科書 基礎から覚える、深く理解できる。』(共著、エムディエヌコーポレーション)、『基礎から覚える、深く理解できる。Webデザインの新しい教科書』(同)、『ああしたい、こう変えたいが手にとるようにわかるCSS基礎』(同)。

10日でSEO&アクセスアップ Jimdoデザインブック

  • 1年間無料

    「はじめてWEB」でホームページをはじめよう!
  • 晴れ晴れホームページ -ホームページで失敗しないために知っておきたいコト-
  • 15分×7日間 無料でできる はじめてのホームページらくらく作成ガイド

ホームページを作るのがはじめてのかたはまずこちらをご覧ください

コラム週間アクセスランキング[期間:2016/8/14~2016/8/20]

おすすめコンテンツ

はじめてWEBおすすめ本

創業・経営のお役立ち情報

  • ソウギョウノート

    飲食・小売・サービス業での開業スケジュールから融資申込に必要な書類が作成できるサービスです

  • SmaBI

    会社設立から契約書作成ツール、オンライン上の経営顧問まで スマートな経営をサポート

  • 経理通信

    中小企業・小規模事業者の経営者と経理担当者のための経理サポートサイト