WordPress なら最高!

WordPressを使いこなすために学んだ事をWordPressに綴っています

同じカテゴリの記事

WordPressテーマ「Arthemia」を使う

WordPressテーマの中でもマガジンスタイルと言われる高機能のテーマを使い倒してみた。というのも、新しく作った料理サイト「cook-le(クックる)」に「Arthemia」テーマを選んだのだ。テーマを選ぶ時の私は、常軌を逸した執念深さで、テーマ数にして2、300テーマくらいは見る気がする。その内の数十テーマはライブデモを見て研究、そのまた幾つかを実際に自分のWordPressに入れてみて、サイトとの整合性を検証。そして今回、最終的にコレと思ったのが「Arthemia」だった。

実際は、途中で1度見送ったのだけど……。見送った理由は、シングルページなどのエントリー表示部分がどうも冗長な感じなのと、他のマガジンスタイルのフラッシュやタブ辺りの機能に目を奪われたからなのだ。仕掛けモノが好きだんなだー、なぜか。

今回カスタマイズを試みた部分は……

[1]ヘッダ下の右画像を3枚に
[2]その下のカテゴリの表示
[3]コンテンツ部分とサイドバーの間にもう1コラム
[4]コンテンツとフッタの間にアフィリエイト欄
[5]シングルページに「関連する投稿」を挿入
[※]タイトル、小見出し、パンくずナビ、サムネールのサイズなど、テキスト部分はすべて変更

Arthemia テーマのダウンロードはこちら

 

81 Responses to “WordPressテーマ「Arthemia」を使う”

  1. marimo より:

    HANA さん

    サイト、拝見しました。見事にキレイなページに仕上がっていますねー。ちょっぴりでもお役に立てたのなら、私こそ嬉しいです。ファビコンも可愛いですね。

    初婚生活のままですが、「夫改造計画」は熟読&追跡読みさせていただきます。

    リンクの件、ありがとうございます。そういえば、このサイトにはリンク集がないと気づきました。Arthemia など当サイトを参考に作ったよ!と言ってくださる方のリンク集を作ることを今決めました。その時は「Arthemia」のカテゴリに「はなまる再婚生活」も入れさせていただきますね。

    励みになるコメント、本当にありがとうございました。

  2. marimo より:

    TAKADOさん

    お困りのようですね。詳しく書かれていないので、要領を得ませんが、ソースから判断すると、プラグインWP-PageNavi を入れ、ページ下部にページナビゲーションを付けたけれど、次ページ&最終ページが、404 error になるということですね。

    WP-PageNavi プラグインを使っていなかったので、クックるに入れてみました。全く問題なく動作しましたので、「動作しない」状態を確認できず、なのでお答えも難しいです。

    が、検索をかけるといくつかヒントが見つかりました。

    1.「WP-PageNavi はバージョンごとに対応する WordPress のバージョンが違いますので、ダウンロードがちょっと難しいです。」

    2.パーマリンクの設定の問題
      TAKADOさんのサイトは数字ベースなので、関係ないと思いますが、↓ 。
      http://wp.mmrt-jp.net/plugin-japanization-project/wp-pagenavi/

    あと、こちらのページ(http://39kn.com/2009/03/11/1019/)は、同じテーマで、TAKADOさんのサイトと同じ現象が報告されています。未解決のようですが……。

    もう少し詳しい状況の説明があれば、マシなお答えが出来るかも?しれません(出来ないかもしれません)。お役に立てなくて、すみません。

  3. takado より:

    MAEIMOさま

    お世話様です。
    わかりずらい説明ですいません。

    「プラグインWP-PageNavi を入れ、ページ下部にページナビゲーションを付けたけれど、次ページ&最終ページが、404 error になるということですね。」

    はいそうです。

    ご指南ありがとうございます。
    色々やりましたが今のところパーマリンクをデフォルトに直すことで解消されています。
    http://nakahashimeriyasu.com/

    ただSEO的には数字ベースの方が良いと言われていたので・・・
    まあページが移動できないよりは良いですよね。

    WP自体は最新バージョンですが「WP-PageNavi」自体をバージョンアップしたら
    エラーで使用不可能になってしましましたので入れ直してバージョンはアップしていません。

    特に使用には問題がありませんがやはり数字ベースの方がよろしいのでしょうか?

    いつもありがとうございます。

  4. marimo より:

    TAKADOさん

    おはようございます。

    とりあえずの問題は解決したようですが、今度は別の心配が……という感じですね。

    問題なく動作している私の環境は、

     WordPress 2.8.4 / WP-PageNavi バージョン 2.72 で、パーマリンクは /%post_id%.html としています。

    アドレスの件ですが、昨年5月に受けたSEOセミナーではやはり静的URLの方が断然有利と言われましたが、事情も刻々と変化しているようで、近頃は動的URLでも全然問題ないという記事も目にします。さらに下記のような情報もあるので、何とも……。yahooはちょっと困りますが、きっと近い将来テクノロジが追いつて問題なくなるという気がします。

    http://www.suzukikenichi.com/blog/google-prefers-dynamic-url-rather-than-static-url/

    仕事柄、SEO対策セミナーに行ったり、情報をチェックしたりしていますが、近頃ひしひしと感じるのは、SEOなど考えず、有益な情報を発信するのが1番検索サイトに好かれる方法じゃないかと……。これはご質問の趣旨とは全然違うベクトルでしたね。

  5. uno より:

    marimoさん

    こんにちは。
    以前悲惨なできばえのサイトでお世話になりました。
    本業のサイトの方でまたarthemiaを使ってみました。タグなどだいぶ見慣れてきて以前より多少前進しました。
    もっかの気になる点はフォントのことです。日本語がどうもかくかくしているので適当にチェンジしてみたのですが、どれにしてもしっくりときません。ついでにサイズも変えてみると、ど~んと大きくなったり、小さくなったり、と色んなところに影響してフォントは結局元にもどしました。
    marimoさんはフォントは変えられましたか?こうした英語のテーマの場合フォントは何がよいのでしょうか。一概には言えないかもしれませんが、おススメなどありましたら教えてください。よろしくお願いします。

  6. marimo より:

    UNOさん、こんにちは。

    きれいなサイトに仕上がっていますね。

    さて、テーマとフォントの話ですが、日本語はそこが悩ましいところですよね。英語だと、フォントの組み合わせやフォントの色で充分デザイン性を上げることができるのに対し、日本語は行間を含めかなり慎重に吟味しないとテーマのデザインを台無しにしてしまいますから……。

    テーマのカスタマイズで一番時間を取るのは、フォント関連かもしれないなーと、UNOさんのコメントを読んで思ったりしました。

    私は基本的に下記のフォント指定です。古いPCだと、ご本人がメイリオをダウンロードしないとダメなので問題ですが、気持ちとしてはメイリオで見てね、という感じです。好きなんですよ、メイリオが。それに、このフォントがすごいのは、例えば9pxくらいのサイズでも可読性を落とさないコトです。ショッピングサイトの商品説明に、豆粒のようなテキストが並んでいるのに、ちゃんと読めて……、これは良いなーと思って、割と早い段階から使い始めました。

     font-family:’メイリオ’,Meiryo,’MS Pゴシック’,sans-serif;

    サイズの指定は、それこそ頭おかしいんじゃない?っていうくらい、指定を変えて繰り返し検証します。周りに表示される他のテキストサイズとのバランスや、激しくシャギーがでるサイズは避けるとか……。

    ただ、上記はプライベートサイトの話で、仕事の時はともかく「MS Pゴシック」と「メイリオ」でキレイに見える、を目指すので、多少の妥協を常とします。

    こんな感じですが、如何でしょうか。やっぱり好きなフォント(といっても、相手の環境が必須なのでナンともですが)で、気に入るまでサイズ変更を繰り返すしかないんでしょうねー、と思います。

  7. uno より:

    marimoさん、こんばんは。

    アドバイスありがとうございました。
    そういう名のフォントですか。教えて頂いたのに知識無く・・・。勉強してまたトライしてみます。クライアントさんのサイトではないので、自分でやってみて確認することですね。そうすれば次につなげられますし。

    またチャレンジして(できた暁には)ご報告します。ありがとうございました。

  8. takado より:

    MARIMOさん

    SEOのお話し確かにです。
    お近くでしたら今度是非お会いして色々お話しをお聞かせ願いたいです。

    いつもありがとうございます。

  9. marimo より:

    UNOさん、こんにちは。

    メイリオはvistaから標準搭載されました(xpで使う時はダウンロード&一手間)。すでに多くのサイトがメイリオ指定でwebを作っているので、普段もしょっちゅう目にしていると思います。丸っこいヤツです。

    嬉しい報告を待っていますね(ワクワク・・・)。

  10. marimo より:

    TAKADOさん、こんにちは。

    ええ、かなりなご近所のようです。お聞かせするほどの情報は持ち合わせていませんが、まぁ何かありまりたら……。

  11. takado より:

    MARIMOさん

    お世話様です。
    例のもんだいですが
    再度条件を全く同じにして試しましたがダメでした。

    ◎テストサイト
    http://www.next30.com/

    ・WordPress 2.8.4
    ・WP-PageNavi バージョン 2.72
    ・パーマリンクは /%post_id%.html

    TOPページから下の次のページに移動ボタンを押すと
    『Error 404 – Not Found』となってしまい
    パーマリンクをデフォルトにすると問題ありません。
    また、数字ベースや他のパターンでもダメでした。

    別のドメインでも試したのでおそらくこちら側の何らかの問題なんでしょうね。
    『.htaccess』ファイルに何か書き加えたりすることはありますか?

    今度プレミアムを使ってみようと思っていますが
    テーマを変えたからといってこの問題は解決されないですよね?

    いつもありがとうございます。

  12. uno より:

    marimoさん、こんにちは。

    お世話になります。
    フォントのことですが、bodyとpを「font-family: “century gothic ,ヒラギノ角ゴ Pro W3″, “Hiragino Kaku Gothic Pro”, “メイリオ”, Meiryo, Osaka, “MS Pゴシック”, “MS PGothic”, sans-serif; 」に替えてみました。

    しかし私のPC環境が古いのでカテゴリーの英語が変わったくらいで自分の環境ではぱっと見変化がこれと言って分かりませんでした。

    この領域は私のレベルではきちんとしたことができなそうなので、今のところここまでにしました。またレベルアップしできたらチェンジすることにします。

    それから上記のTAKADOさんのテストサイトも動画など入れられていて動きがありますね。とても参考になりました。こうして他の方のサイトをみれると勉強になります。ありがとございました。

  13. [...] WordPressテーマ「Arthemia」を使う | ブログで行こう! WordPress なら最高! [...]

  14. zakuro より:

    はじめまして。
    わたしもarthemiaをつかっています。
    設置のときに、参考にさせてもらいました。

    TAKADOさんのページナビの件なんですが・・・・・・
    横から失礼します。
    もしかして、解決しているかもしれませんが、私も同じ症状で悩まされ、
    解決したので参考になればと思います。

    arthemiaテンプレートで1ページに表示するページ数を変更したら、
    wordpressの管理画面の表示設定でも、ページ数を変更すること。
    テンプレートと管理画面の表示設定の、ページ数を同じにならないと、
    ページナビゲーションが動かないことがわかりました。

  15. marimo より:

    ZAKUROさん

    貴重な情報、ありがとうございます。TAKADOさんや同様の症状で諦めてしまった方は、救われますね。TAKADOさんには、直接メールして、「ZAKUROさんの投稿を読むと良いことがあります」とお伝えします。このページを必ず見るとは限らないし、見てくれるとしても早い方がいいに決まっていますから。

    ももすけ君、思いっきりカメラ目線でグッときちゃいますね。でも私は10年前から突然猫派なんですが……。

    また、ヒントやアドバイスお願いします。ありがとうございました。

  16. takado より:

    MARIMOさん
    ZAKUROさん

    ありがとうございます。
    _(_^_)_ _(_^_)_ _(_^_)_

    本当に感謝です!

    解決しました♪

    長い間のモヤモヤが解決です!
    本当に!本当に!!ありがとうございます。
    http://www.next30.com/

  17. marimo より:

    TAKADOさん

    即行でしたね。メールを差し上げてから、まだいくらもたっていませんよ。それだけ悶々としていた課題だったんですねー。ホント良かったです。私もすごく嬉しいです。

    ZAKUROさん、わざわざお知らせくださって、ありがとう。ZAKUROさんのファンが2人増えちゃいましたよ。

  18. こんばんは。
    Arthemia を使用する上で、参考にさせていただきました!
    「cook-le(クックる)」の配色をかなり真似しておりますが・・・
    これからたくさんカスタマイズして、自分色を出していきます!
    これからも参考にさせていただきます!

  19. marimo より:

    トレンドアイさん

    書き込み、ありがとうございます。
    サイト、拝見しました。色味が同じでも内容が違えば全然別物に見えますよ。1981年生まれですか? 我が子より若い(笑)!

    頑張って、ドンドン作り込んでください。楽しみにしていますね。また、お邪魔します。

    おっと、トレンドアイさんのお蔭で、画像のリンク切れを発見。助かりました。

  20. 管理人様

    早速のご返信ありがとうございます!
    今後も参考にさせていただきたいと思いますので、勝手ながらサイトにリンクさせていただきました!
    よろしくお願いいたします。

  21. marimo より:

    トレンドアイさん

    ありがとうございます。来ていただいた時に1つでもお土産になる記事があるよう頑張ります。

  22. こんんちは。
    クックルのように、コンテンツ部分とサイドバーの間にもう1コラムを設置したいと思い、チャレンジしているのですが、思うようにいきません・・・
    コンテンツ部分のサイズの変更は出来ているのですが、そこにバナーを設置しようとすると、レイアウトが乱れてしまいます。。
    何かアドバイスいただけますと幸いです。
    よろしくお願いいたします。

  23. marimo より:

    トレンドアイさん、こんにち!

    ソース確認のために、Trend-iサイトにジャンプしたら、昨夜の対アルゼンチン戦のニュース。記事を読んだ後、サッカーニュースを読み回ってエラい時間の無駄をしてしまいました(笑)。トホッ

    ところで、ご質問の件ですが、「コンテンツ部分のサイズの変更」だけでは、レイアウトを維持できません。バナー設置用の空いた部分をDIVタグで囲って、その中にソースを書き、cssにコンテンツの右側に××pxの要素を入れるよ……と指定しなくては。

    私の場合は、

    【index.php】のコンテンツ部の後ろに
    <div id=”center”>■■</div>
    ※■■の部分にバナーのソースを書けば良いと思います。<>は全角にしてあります。

    【css】に
    #center {
    width:130px;
    background:#ECECEC;
    padding:10px 0px 0px 0px;
    float:left;
    text-align: center;
    border-right: 1px dotted #ccc;
    border-left: 1px dotted #ccc;
    font-size:10px;
    }

    として、狭いカラム部分を確保しています。ちょっと説明がヘタですが、おわかりですか? お分かりにならないようでしたら、再度質問してください。もっと上手な説明を考えます。

  24. marimoさま

    出来ました!!!!

    本当にありがとうございます。

    marimoさまのおかげで私のブログも充実してきています。
    またご相談させてください!

    よろしくお願いいたします。

  25. s-project より:

    MARIMOさんへ
    相変わらず、時々お邪魔させていただき、勉強させていただいております。感謝感謝です。

    さて、「Arthemia」についてひとつ伺ってもよろしいでしょうか?
    記事投稿の権限などは知り合い任せて自分で投稿させています。
    が、本日突然サムネイル系の画像が出なくなってしまいました。下記サイトです。

    http://kyokushin-matsushima.jp/e/

    サムネイルのリンク先には、元の画像がちゃんと存在します。ワードプレスの管理画面上で、何かの設定をいじってしまったのかと知人に訪ねましたが、特に変わったことはしていないようです。

    このサイトを訪れていただき、MARIMOさんのお気づきになられる原因がございましたら、ぜひアドバイスをください。

    いつも変なお願いで、申し訳ありませんがよろしくお願いいたします。

  26. marimo より:

    s-projectさん

    忙しくてなかなか記事をアップ出来ないのに、読んでくださってありがとうございます。こちらこそ、大感謝です。

    ところで、サムネイルの件ですが、パスが違っていますよ。サムネイル用のキャッシュされた画像もちゃんと存在していますが、パスが1階層上を読みにいっています。timthumb.php の設定が怪しいですが、「本日突然サムネイル系の画像が出なくなって……」とあるので、私の推測は違っているかもしれません。サムネイルを見ることが出来るので、パーミッションはOKです。timthumb.phpのcacheディレクトリがドメイン直下となっていて、そこにサムネイルのキャッシュファイルを貯めているのに、サイト内のパスは /e/ 内のサムネイルを表示しようとしているんじゃないかと……? 暑さのせいか、今日は日本語がヘタです(笑)。意味、わかりますか?

    ▼ソース上のサムネイルのパス
    http://kyokushin-matsushima.jp/e/wp-content/themes/arthemia/scripts/timthumb.php?src=/e/wp-content/uploads/2011/05/New-Zealand-Apr2011-020.jpg&w=100&h=65&zc=1&q=50

    ▼サムネイルのパス
    http://kyokushin-matsushima.jp/e/wp-content/themes/arthemia/scripts/timthumb.php?src=wp-content/uploads/2011/05/New-Zealand-Apr2011-020.jpg&w=100&h=65&zc=1&q=50

  27. s-project より:

    MARIMOさん
    いつも丁寧なアドバイスをありがとうございます。
    そして、分かりやすい表現でご指摘いただくので、本当に勉強になります。
    MARIMOさんのご想像と同じことに、ものすごい時間をかけて気がつきましたぁ!感謝感謝です。
    でも、なぜこの症状が出たのか不思議でなりません。もしこの原因にピンときたら、また教えてくださいね。

    この度も心より感謝するとともに、今後もアドバイスをよろしくお願いいたします。ありがとうございました。

  28. MUBEI より:

    はじめまして。wordpressのことは こちらでとてもよく勉強させて頂いています。ありがとうございます。

    すみません、
    http://cook-le.com/breakfast/
    のように 写真が ひゅーーー と並んででてきて、
    綺麗なページは、 どうやって 作ったのでしょうか。
    または、どういうWORDPRESSのテーマでしょうか。
    教えて頂ければとても嬉しいです。
    よろしくお願いします。

  29. marimo より:

    MUBEIさん

    コメント、ありがとうございます。ちょっとでもお役にたっているのでしたら、本当に嬉しいです。

    http://cook-le.com/breakfast/のテーマは「tanzaku」です。日本製の可変テーマで、とても使い易いです。

    「朝ごはん ときどき お弁当」はメチャクチャカスタマイズしているので、本家のモノとは動作が違いますが、ソースもきれいですし、丁寧な解説もあるので、自分好みにする事が可能と思います。

    ステキなサイトが出来るといいですね。

  30. MUBEI より:

    marimoさま

    すぐに教えて頂きましてありがとうございます。

    あー  でも 「朝ごはん ときどき お弁当」は、見ていてすごく楽しいし、おいしそう! 

    ありがとうございます。

Trackbacks

  1. Arthemiaがいい感じ
  2. WordPress マガジンスタイルテーマ | WordPress なら最高!

コメント欄

参考になった時は、ポチッとよろしく!

にほんブログ村 IT技術ブログ WordPressへ