WordPressのテンプレート プラグイン カスタマイズ 情報を紹介 | mono-lab

2009年 7月 21日

WordPress 自作テーマ monochrome の紹介

今日は、わたしが作成したWordPress用テーマ【monochrome (モノクロ)】を紹介します。

対応しているWordPressのバージョンは2.6以上になります。
(2.6以下は未検証)

このテーマは、サイドバーウィジェットやWordPress2.7から導入された入れ子コメント機能に対応しています。

上部メニュー(グローバルメニュー)はドロップダウン式になっており、
カテゴリーまたは、ページのどちらかを管理画面から選択できるようにしました。
階層はひ孫カテゴリー(ページ)までは表示できます。
(ひ孫以降はCSSを修正する必要があります。)

管理画面からは、右サイドに表示されるインフォメーション部分の編集や、
様々な部分の表示・非表示が設定できるようにしてあります。

設定項目

  • タグを表示する
  • 投稿者名を表示する
  • 検索の下に、折りたたみ式タグリストを表示する
  • 右下の「return top」を表示する
  • などいろいろ

また、サイドバー(サイドコンテンツ)を表示しないページをページ作成画面から簡単に
作成できるようにしました。

jqueryを使用していますので、若干他のプラグインと競合する可能性がありますが、
もし不具合があった場合はご報告ください。

デモページを用意しましたので、動作をご確認ください。
一つ目の記事の「read more」をクリックしたら様々なHTMLタグの表示具合が確認できます。
デモサイトは英語で表示されていますが、このテーマは当然日本語化してあります。

monochromeのスクリーンショット
デモサイトを見る

ダウンロードはWordPress本家公式サイトからダウンロードしてください。

ダウンロードページへ進む

バグや不具合、ご意見、ご要望などがございましたらコメント欄へ書き込んでください。

追記です。(7月25日)

上部に表示する親カテゴリーや親ページの数が多いと、
以下のようにメニュー部分がはみ出してレイアウトが崩れてしまいます。

はみ出した例

大変もうしわけないのですが、回避策としては親メニューや親ページの数を
減らしていただくしか方法はありません。

North Wind さま、情報と画像を提供していただきありがとうございました!



関連記事

前のページに戻る
    • Yoh
    • 2009年 9月 7日

    かっこいいテーマを、本当にありがとうございます。早速使わせていただいています。
    お忙しいと思いますが、カスタマイズをご依頼することは可能でしょうか。

    • はじめましてYohさん。

      昨夜メールを差し上げましたので、使用しているメーラーの迷惑メールフォルダの中と、ゴミ箱の中をご確認ください。

        • Yoh
        • 2009年 9月 7日

        ありました!誠に失礼しました。
        丁寧で親切なご返事をありがとうございます。メールで返信させていただきます。

  1. Hi,

    I encountered an error with the Theme Options. The RSS feed will only work if the Information box is activated. It appears that the RSS option php if is nested within the Information option php if. I don’t know that much code, but I think I fixed it by moving these lines before the RSS php if:

    It kinda works. Anyway, I really like your theme, and just thought I let you know about this little glitch. Thanks.

    • Hi anselmogz.

      >I encountered an error with the Theme Options.

      Well, it’s not an error … but I should change this part little bit.

      I’ll fix it at next version.

      Thank for your advice!

  2. I’ve added a Dutch (Holland / Netherlands / Nederlands) translation of this wonderful theme!

    Ik heb een Nederlandse vertaling van het monochrome thema van mono-lab gemaakt.

    Download >> http://ritme.levendebrief.nl/wp-content/uploads/nl_NL.zip

    • Hi Niels.

      Thank you very much for your translation.

      I will put it into next version!

      • Hi there! Is there a possibility to enlarge the comment button in the left column /meta-sidebar? I want it bigger so people will make a comment more often…

        • Hi Niels.

          Plese add this line in style.css line 108.

          .post_meta dt.meta_comment { font-size:12px; }

    • Sskuzenski
    • 2009年 9月 10日

    Thank-you for your design! Is there a way to replace the fill the logo div with my logo instead of calling for the blog title and description? Very new to PHP, I’m guessing this is the way if possible. Is it possible?
    Thanks

    • Sskuzenski
    • 2009年 9月 10日

    Forgot important details: I’m customizing the monochrome theme.
    Again thank you!

    • Hi Sskuzenski.

      I’ll send you an e-mail about this customizing.

    • Nina
    • 2009年 9月 10日

    Hi!

    Great theme. Really like it! :)

    How do you change the font size of a post’s title? Thank you!

    :)

    • Hi Nina.

      Open style.css and goto line 72.You can find

      .post h2, #single_post h2, .page h2 { font-size:16px;

      So change the number “16″ to whatever you wan’t.

      You can change from WordPress dashboard.

      Go Dashboard > Appearance > Editor

      and select stylesheet(style.css).

      Thank you for using my theme!

        • Nina
        • 2009年 9月 10日

        Thanks so much for the info! :) Great work!

        arigato gozaimasu!

  3. はじめました。:)
    私は韓国人ですから日本語が下手です。

    とにかく mono-labさん(^^?)のテーマとてもきれいです。
    おかげでwordpressを作るの楽しいです。

    ありがとうございもす。

    • はじめまして、DynOさん。

      >とにかく mono-labさん(^^?)のテーマとてもきれいです。
      >おかげでwordpressを作るの楽しいです。

      ありがとうございます。

      これからも色々なテーマを発表していきますので、ご期待ください。

  4. Searched through hundreds of themes and love this one! Love your simple design – thank you so much. I would love to add a photo in either my header or in the “information contents.” Is this in any way possible? thank you!

  5. Hello
    Your style is really good, but the next question is, how can home page shows a summary of the article or the contents of the first part of it, pictures can show, thank you, bother to reply me where, under E-MAIL!

    PS: is not English, google translation

  6. Hi, I’d like to contribute to this GLORIOUS theme translating it to SPANISH.
    Please could you send me some information or the file to translate? I’d like you to include my translation into the distribution.

    Thank you

    From Spain

    • Hi Ignacio!

      Thank you for the support.

      I will send you an e-mail about translating.

  7. hi!
    テーマ利用させていただいてます。
    lightboxのことで質問させてください。

    http://wppluginsj.sourceforge.jp/i18n-ja_jp/lightbox-2-wordpress-plugin/
    こちらのpluginを使用しているのですが、
    まったく動作しません。

    何がわるいのかもわからない状態なのですが、
    なにか確認されている情報がありましたら、教えていただけないでしょうか?

    • はじめまして、hosoiさん。

      hosoiさんが使用しているlightboxはprototypeというjavascriptを使用しているため、monochromeで使用しているjqueryとバッティング(競合)しているのが原因だと思います。

      Lightboxにはjqueryをベースにしたバージョンもありますので、

      WP-Slimbox2add-lightboxを併用して使用してみてください。

      2つ目のadd-lightboxプラグインは、投稿された画像に自動的にrel=”lightbox”などの必要な情報を書き込んでくれるプラグインになります。必要の無い場合は、一つ目のプラグインだけご利用ください。

      テーマをご利用していただきありがとうございます!

      • 返答ありがとうございました。
        教えていただいたpluginを導入してみます!!

        あとひとつ教えていただいきたいのですが。
        記事本文のfont-sizeを変更したのですが、
        style.cssのどこに手を加えればよいでしょうか??

        • 記事本文の文字サイズを変更するには、style.cssの76行目近辺にある、

          .post_content {line-height:160%; }

          に、

          font-size:14px;

          を追記してください。数字はお好みの数字を当てはめてください。

          分からない場合は、カスタマイズしたstyle.cssファイルを送信いたしますので、遠慮なくお知らせください。

    • lokuba
    • 2009年 9月 21日

    U are better man.

  8. Love the theme! One question. How do you change the font on the header/title? I want something a little more snazzy. I see how to change size, but don’t see a font option.

    • Hi John.

      To change the style of the blog title,

      goto style.css line 54

      >#logo a, #logo a:visited { color:#333; font-size:24px; }

      add

      font-family:Verdana;

      >#logo a, #logo a:visited { color:#333; font-size:24px; font-family:Verdana; }

      Change the font-family name to whatever you wan’t.

  9. Hi there!
    I know you’ve heard it a thousand times before, but I gotta say that I’m absolutely amazed with your theme! Wonderfully intuitive and clean :) I’m just tweeting it a bit and plan to start using it in the near future. Also, you’re dedication in answering everyone is quite admirable!
    This said, I have to give it a shot and hope that you’ll also take some of your precious time in answering my little noob questions:
    1. How do I change the blog’s name written at the top, for an actual image?
    2. Is there a maximum height and width for the image substituting the text, before it messes about with the whole theme?
    3. Your “theme options” section is very well done. You’ve even left the option to include the tags in the sidebar (brilliant!). The problem is that I DO want the tags, but want to remove the info about the Category (since I only got 1). Is there any change in the code which would do that?
    4. The “return to top” link is very good as well. Is it an image? If it is, could you tell us how to substitute it with a text, so that we can translate it?
    5. Finally, in order to thank you for your wonderful job and in the hope that you’ll be so kind as in answering these questions, I would love to translate it into European Portuguese (pt_PT). As someone asked before, could you send me an email with the instructions on how to do so?
    6. Last and not least, thank you dude! You’re the bomb! Japanese people really have good taste :)

  10. Dear mono-lab!
    Sorry for my bad english!

    I`ve installed the Theme at my blog and translated it to German. I have got a little problem.

    How can i translate the words “REPLY” “QUOTE” and “EDIT” at the comments (right side)???

    Best regards
    Rene

    • Hi Rene.

      >How can i translate the words “REPLY” “QUOTE” and “EDIT” at the comments

      You have to change from function.php file.
      The word “reply” is at the bottom of the function.php file.

      By the way my theme have language file inside, so It will be more easier if you can translate default.po file.

      To translate default.po file download

      POEDIT (translation soft. freeware)

      and save as de_DE.po file.

  1. 2009年 7月 24日
  2. 2009年 7月 30日
    トラックバック先 : HELLO WORLD | Do Andromeda Dream of Earth?
  3. 2009年 8月 4日
  4. 2009年 8月 8日
    トラックバック先 : WordPress theme: monochrome – 主题吧
  5. 2009年 8月 8日
  6. 2009年 8月 11日
  7. 2009年 9月 1日
    トラックバック先 : Monochromatyczny – polska skórka
  8. 2009年 9月 2日
  9. 2009年 9月 3日
  10. 2009年 9月 3日
  11. 2009年 9月 21日
  12. 2009年 11月 2日
    トラックバック先 : D/A Traffic Report #5 | DAVE/AVENUE
  13. 2009年 11月 6日
  14. 2009年 11月 13日
  15. 2009年 11月 16日
    トラックバック先 : WordPressテーマ mono-lab | abilict
  16. 2009年 12月 28日
  17. 2010年 1月 10日
  18. 2010年 1月 13日
  19. 2010年 1月 14日
  20. 2010年 1月 25日
  21. 2010年 1月 28日
  22. 2010年 2月 21日
  23. 2010年 2月 24日
  24. 2010年 3月 8日
    トラックバック先 : WordPressテーマ工房
  25. 2010年 3月 22日
  26. 2010年 4月 1日
    トラックバック先 : En Güzel Wordpress Temaları (2) | VESON
  27. 2010年 4月 13日
  28. 2010年 6月 13日
:wink: :-| :-x :twisted: :) 8-O :( :roll: :-P :oops: :-o :mrgreen: :lol: :idea: :-D :evil: :cry: 8) :arrow: :-? :?: :!:
  • move
  • close
use smiles