12 May welcart 郵便番号から住所を自動入力する zipaddr-jp zipaddr-jpという新しめのプラグインを使いました。 welcartに最初から対応されているので、プラグイン有効化で何も設定せずに 自動入力できていました。 他のページに自動入力デモ画面などありますので、使い心地を試してみてください http://zipaddr2.com/wordpress/ http://welcustom.net/zipaddr-jp/ welcartカスタマイズブログで有名なかたが使用しています。 新しいプラグインということで不安でしたが、有名どころのかたが使っていることと、 ありがたいことにwelcart用の設定が最初から組み込まれているため、 煩わしいことなく即使えるのがいいですね EC-CUBE版も出ています。 styleの変更 styleを変えようと思ったら、htmlに直接出力されていました。 メールで伺ったところ、!important をつけまくることでcssで上書きできます。 !importantのこと忘れてました。 というか直接出力されてしまうやつ、jQueryでわざわざstyle置き換えてたことあったような･･･。 !importantは直書きよりも上位だったんですね･･･。 カート入力ページでポップアップ表示ということもあって、確認作業が非常にめんどいため、 !importantなしで効く効かないをいちいち見るのがしんどくなりました。 そのため!importantつけまくりました。 文字サイズを大きくしたり、paddingなどで幅をふやすと、<span>で囲われている 地域名とヒット数のところがおかしくなります。みえなくなります。 <span>にdisplay:block;をすると、上部になぞの空白ができて取れないので display:inline-block;にしました。 背景は区切り線のように横棒のに細長く色をつけたかったから、ブロック要素の display:block;がよかったんですけど、余計な空白あるとまた何いわれるかわかんないから display:inline-block;で妥協します。 「閉じる」の誤マウスオーバー対策 「閉じる」というところにマウスオーバーすると勝手に閉じてしまいます。 閉じる気がなかったのにマウスが行って閉じるとイラっとしますよね。 それを少しでもさけるために、「閉じる」の上に余白を作りました。 2番目の<span>（ヒット数のところ）にmargin-top:15pxをつけました #autozip span:nth-of-type(2){ margin-top:15px !important; } ガイダンスの位置変更 「ガイダンス」とは住所選べるツールチップ？のところのことです。 出現位置が入力している郵便番号にかからないように、見やすい位置に変えましょう。 「プラグイン」→「zipaddr」のところで設定します。 こういうのは「設定」のところに通常いれるのに、「プラグイン」に出力されています･･･。 ここのガイダンスの位置補正で数値いれてみてください。私は縦50、横30でやってます。 PR
12 May ワードプレス Search Everything 検索範囲を広める Search Everything というプラグインを使う http://sharinglab.info/wordpress/wordpress-plug-in/seo/search-everything/ オプションは日本語表記なので、使いたい場所にチェックいれましょう。 カスタムフィールドを使ってるなら絶対いれたほうがいいですね。 ハイライト使用で日本語が文字化けするので、ハイライト使用するならphp編集必須です。 http://web-clutch.com/search-everything-mojibake/ 何行目っていうのはバージョンアップで変化しますので、search-everything.phpの中を $postcontent = preg_replace( で検索し、2ヶ所でてくるので、その次の行の "i' を "iu' に変えればよいです。 自分でサイト内検索してみて、「あれ引っかからないぞ」って思ったらだいたい カスタムフィールドで作ってる項目だと思います。 ワードプレスはtitleと投稿記事の文章しか見ないみたいです。 よく使うからカスタムフィールドでテンプレート化してるのに、 検索結果に入らないんじゃ意味ないですよね。
03 May WP管理画面のロゴ画像を変更したい //ログイン画面のlogo画像変更 function custom_login_logo() { echo '<style type="text/css">.login h1 a { background: url('.get_bloginfo('stylesheet_directory').'/images/logo-login.gif) 50% 50% no-repeat !important; width:320px; border-radius:5px; }</style>'; } add_action('login_head', 'custom_login_logo'); http://htdsn.com/blog/archives/wordpress-admin-customize.html １、このサイトのコードをまずコピペる ２、logo-login.gif という画像ファイルでロゴ画像を作り、使用テーマのimagesフォルダにいれる サイズは自分の表示させたいサイズで。私は面倒なのでオリジナルの幅320px高さ80pxで作りました。 ３、子テーマを使用しているので、読み込むテンプレタグを変える get_bloginfo('template_directory') 親テーマ使ってる人用 get_bloginfo('stylesheet_directory') 子テーマ使ってる人用 デベロッパーツールなどでcssをのぞくとwidth:80px;と指定してあったので、 ４、これをwidth:320px;で上書きします。さらにborder-radius:5px;をつけたしてみたりします。 しかし画像がWPのロゴサイズでしか表示されないので、セレクタ指定のところに .login を足すと幅320pxで表示されました。 ロゴのCSS調整のことをまったく書いてないので自分でやる必要があります。 おわりです
02 May welcart 関連商品の表示 Yet Another Related Posts Plugin（YARPP） http://riyomaru.minibird.jp/wordpress/185/ http://mesiopress.com/yarpp-thumbnail-custom-3780.html welcartの「関連商品」の出力として用意されているものの使用法 １、タグに関連商品として表示させたい「商品コード」を入力する ２、関連商品のところに綺麗に表示される メリット 関連商品として出したいものだけ出せる 個別に設定できるので、A商品には２関連商品、B商品には４関連商品とか自在です。 デメリット タグを <?php the_tags(); ?> で出力すると、「商品コード」という出したくないものが 表示されてしまう。タグは関連商品以外にも、なんらかの分類で使いたいですよね。 商品コードということを認識させるような判定とかして非表示に出来る、 なんてあるんでしょうか。私にはできるわけがないですが。 表示させた関連商品がなくなってもタグは残ります。 自分でタグ管理しなくてはいけません。商品数が多い場合はすごく面倒になります。 つまり、「適当になんか拾ってきて表示しといて」ではなく、 「これとこれ見てね！！」ってのを主張する場ということです。 普通の記事と違って、ショップサイトの商品目録だからという意味合いらしいです。 実用例としては果物屋さんのショップだとします。 色んな果物を扱ってますが、りんごのページにはリンゴジュース、リンゴジャム、を 関連商品として絶対載せたいとき、ジュースとジャムの商品コードをタグに記入します。 もうひとつの実用例。何らかのパーツ屋さんだとします。 適合パーツのみを関連商品としてのっけたい場合に使えます。 関連記事のプラグインってある程度表示を絞れますけど、記事数は一定だし 特別そんなに関係のない記事まで出ることもあります。 そんなのは気にせずどうでもいい人はプラグインでやったほうがいいです。 Yet Another Related Posts Plugin（YARPP） http://riyomaru.minibird.jp/wordpress/185/ このサイトからほぼコードを丸パクリし、そこから自分用に改変しほぼ別物となった。 雛形がないと何もできませんよ私は。 このプラグインのフォルダ内から yarpp-template-thumbnail.php をコピーし、 自分の使用テーマ内にペーストする。 表示設定を「<?php カスタム」にし、テンプレートファイル選択で yarpp-template-thumbnail.php を選ぶ。 yarpp-template-thumbnail.phpの中の該当箇所を改変していく。 まず上のサイトのお手本のコードをコピペ。 値段表示させたい、本文表示させて続きを読むさせたい、となり、 他のページで使っていたコードをそのまま当てはめたいところへコピペ。 htmlのセレクタとcssでレイアウト調整をする。 なんか<h4>に備わってるwelcatのcss設定が変な余白を引き起こしていて、 上書きできる場所にあるcssのやつじゃないわ、リセットできないわ、 どうしようもないので<h4>をレイアウトのために封印する。 <span>は意味の無いくくりとして、ただのレイアウトのために使いたいのだが、 <span>は複雑なレイアウトに向かないセレクタということがわかった！ margin、padding、text-alignなど希望通りにならないことが多くあり、 わざわざdisplay:block; にしたり、したらしたで他の何かが効かなかったり もう面倒になったので<p>と<div>で囲む。おちつくわー･･･ floatを使いたくないがための足掻きが無駄足となり、結局floatを使う。 css3のfloatに変わるやつ使いたいけど、float系に関してはレイアウトが重大事項なので 対応してないブラウザの場合はどうしようもなくひどい状態になるので 使いたいけど使えない状況です。つまりIE死ねよってことだ。 他のcss3に比べてfloatのやつは 全然対応が遅いし何かコロコロ書き方かわりまくってません？ display:box; って書き方がもう古いやつって前にみて衝撃うけたんですけど･･･。 自動表示にチェックをいれると、のループ内の下段に出力されます。 自分で設置場所決めたい人は、チェック外します。 welcartのタグ使用の関連商品 Yet Another Related Posts Plugin（YARPP）使用のランダム関連商品 両方使って、タグ使用のほうを主張したい関連品やおすすめ品、最新関連商品とか、 自分で別の用途として使えますね。上のサイトの受け売りです。
02 May ソーシャルボタンが重い http://www.digitalboo.jpn.org/blog/snsbutton http://fukuyama.co/lazyloadsns パクリと改変と他人に頼るしか知識のない私です ソーシャルボタンを記事にのっけたら、ホームの記事ループでホームが重い 本当はスクロールで読み込みがよかったけど、コピペして改変してもjQueryが動作してんだか してないんだかわかんない。 もうめんどくさいので、指定秒数後にボタン読み込みにした。 これは見た目でよくわかるので動作したのがわかった。 ちょっと私の設置法が違うので疑問点もあるんだけど、考えるのも検証もめんどいのでやめやめ 1行目のリンク先の人の言葉に共感した 「ご自身の環境に合わせて設定してください」（曖昧な引用） あーまさにこれこれ！私もこれがイライラするんだ だからその変え方がわかんねーんだよって。 １つでも実例があれば改変できる。でもhogeだのsampleだの 基本構造の羅列だので、仮の言葉でやられるとわかんなくなる みんながやりたいのは応用なのに基本しかない 実際に使うようなの書いてほしい 乞食の分際ですみませんね！ まあ勝手だけどイライラするんです 最近富みにむかつくのが、プラグインの使い方でインストールするところから 画像つきで解説してるところ。 プラグインを色々入れてる時点でもうそこ必要な人いなくね？ わかってないやつはWPインストールしたてホヤホヤの人のみじゃね？ ここは順番かくにしても文章で表現するだけで十分じゃね？ そういうとこ丁寧にやるくせに、基本の解説しかかいてない。 細かい設定解説と応用がみたいんだよこっちは。 乞食の自己中ひとりごとです。
