まだ続くカスタマイズ

トップページのおすすめ商品というテーブルを、新着商品に変更した

welcart_default/home.php  14行
<div>新着商品</div> に変更。お勧めを呼んでくるのはもっとややこしいコードだ。このへんがwelcartのめんどくさいところだと思う。同類項だと思われるものが、同類項ではない? 的な。

同じく17行
<?php $reco_ob = new wp_query(array(‘category_name’=>‘itemnew’, ‘posts_per_page’=>8, ‘post_status’=>’publish’)); ?>

に変更した。ここにはitemrecoと入っていたはず。コピーは取ってあるので大丈夫。 

トップページに表示される新着商品の数を増やしたいなぁと思っていろいろ。今のリンコルは新着商品をかなり無限に載せてるので。えーとこれはソースじゃなくて、ダッシュボードの設定→表示設定→1ページに表示する最大数をデフォの10から増やせばいいようだね。まだそんなにアップしてないんで検証してない 

新着商品のコードナンバーは不要なので削除した
&nbsp;(<?php usces_the_itemCode(); ?>) 削除

ちょと待て、このコード使えるんじゃ・・・?
<div><a href=”<?php the_permalink() ?>” rel=”bookmark”><?php usces_the_itemName(); ?>&nbsp;(<?php usces_the_itemCode(); ?>)</a></div> ヒントのようなそうでないような。

cssでサブ画像キャプションについて指定して、そいつをdivで呼んで、&nbsp;使って呼んだらいいんかな?
usces_the_itemImageCaption($number, $post, $out)
のはずなんだよなー 

&nbsp;(< ?usces_the_itemImageCaption($number, $post, $out); ?>)
と入れてみたら本日も全力でメイン画像のキャプションを読み込んだ
つまり
$numberが問題なんだよね

&nbsp;(<?php usces_the_itemImageCaption($id, $post, $out); ?>)
に変えてみたら、読み込んだよ! サブ画像のキャプ、読み込みましたー! 書けた書けた!  まぁ見てくれは今のところ悪いが、とにかく読み込みさえすりゃいいわ、やったやった、快調快調  カッコ不要なんで取ったわ 

style.cssの672行目あたりからサブ画像の指定をしてる。同階層のusces_cart.cssでも指定はあるが、パディング10のみだったので、こっちの方が指定が多いんだな、こっちでいじるのかな? でも画像じゃないからな、キャプのcss書けばいいんだか? 

トップページの新着商品(デフォ=お勧め商品)はテーブルなのか? だったらここをぱくってしまうと、サマにならないかな? home.php記述は下記
<div class=”thumbnail_box”><div class=”thumimg”><divclass=”thumtitle”>
だね。style.cssかな? 

style.cssに下記を記述してみた 681行目から subimage_boxは適当なネーミング
/* subimage_box */
#itempage .subimage_box {
    width: 119px;
    height: 190px;
    margin: 4px 0px 0px 4px;
    padding: 8px;
    background-color: #FFFFFF;
    float: left;
    overflow: hidden;
}
.subimage_box .itemsubimg {
    padding: 3px;
    border: 1px solid #CCCCCC;
    text-align: center;
}
.subimage_box .itemImageCaption {
    width: auto;
    margin: 10px 5px 5px 0px;
    padding: 0px;
    text-indent: 20px;
}
/* subimage_box */

wc_item_single.phpに下記を記述してみた
<div class=”subimage_box”>
    <div class=”itemsubimg”>
<?php $imageid = usces_get_itemSubImageNums(); ?>
<?php foreach ( $imageid as $id ) : ?>
        <a href=”<?php usces_the_itemImageURL($id); ?>” <?php echo apply_filters(‘usces_itemimg_anchor_rel’, NULL); ?>><?php usces_the_itemImage($id, 135, 135, $post); ?>
        <div class=”itemImageCaption”>&nbsp;<?php usces_the_itemImageCaption($id, $post, $out); ?></a>

あらま、ぶっ壊れた。元に戻す あれ、スタイルシートのほかの部分が戻らんなー

直った。どこかの時点でいったんcssが原本に戻ってたみたいだ。それを変更してアップしたので原本が反映されたということらしい。元に戻した

htmlなら<br>噛ませるだけで解決するんだけどね・・・。phpだと改行させるだけでえらい大変だわ、解決策見つからんわ

画像にfloat指定、かしらね?

style.css
#itempage .itemsubimg {
    margin-bottom: 10px;
}
#itempage .itemsubimg img {
    width: 135px;
    height: 135px;
    padding: 5px;
}
#itempage .cap01 {
width: 135px;
float: right;
margin: 0 3px;
}
追加  

あかんな。もっと単純に画像にfloatも試したけどアウト。

phpの中にhtmlって置けるのかな? もう滅茶苦茶になってきた ←今ココ

スルーしてください

原本に戻して、とりあえずcssいじって元通りにした。といっても、価格表示の部分をずらしただけw

usces_the_itemImageCaption($number, $post, $out)
usces_the_itemImageDescription($number, $post, $out)

$number は商品画像のインデックス、0がメイン画像
$post はglobal $post 、ループの中では省略できる
$out は省略するとechoされる、’return’でreturnされる

禅問答みたいだなぁ。

wc_item_single.php 103
<?php usces_the_itemSubImage(‘usces_the_itemSku()’, 50, 50, $post); ?> 追加

エラー発生w 

<?php usces_the_itemImage(‘usces_the_itemSku()’, 50, 50, $post); ?>に戻した。今日も全力でメイン画像を呼んでいる 前回の最終局面まで戻った

どうも完全に考え違いをしているのか・・・・・・。

<?php global $usces;
$pictid = $usces->get_mainpictid(usces_the_itemSku(‘return’));
echo wp_get_attachment_image( $pictid, array(50, 50), true ); ?>

できたある。
とうとう出来たある。
ヒントもらってあと微調整して、何とか呼べたある。
こんな難しいソースコード書けないよ、まじで。  
あー疲れた、ほとんど1週間かかったよ、このたった3行に・・・・・・ ←今ここ

というわけで原本に戻す

問い合せていたことの返事は来たのだが、うーん(笑)
答えているようで、肝心なことは何一つ答えていない、見本のような内容。つまり、ここから先を知りたければ無料のままでは無理よと、まぁこういうことなんだろう。

ということであきらめて、いったん原本に戻した。
モチベーションひたすら下がってるけどなんとかしなきゃ。

本日も構築中なり

スルースルースルーして

今構築中の新しいショップ、オープンソースのwordpressというブログシステム(?)のプラグイン、welcartというのを使っている。無料でシステムが組めるので、画期的。かなり細かいところまで網羅されていて、とにかく本体をきっちりやってしまえば、後のサイト運営、簡単に言えば商品を次々アップしていく作業は楽だと思う。

現在すでに運営しているショップは、自分でhtml+phpで組んでアップしている。デザインの自由度ははるかに高いし、正直言って、テーブルをずらすだの、色を変更するだのといった細かい作業で、welcartほど苦労はしない。全部自分でやったからだし、基本はhtmlで組んでいるからだ。phpは必要な個所に組み込んでいるだけ、なんちゃってphp。でもそれで今のところは十分。ただし、新規商品をアップするときには、ひとつひとつ自分で新しいページを書かなくちゃならない。もちろん前のをコピペして必要なところを書き換えていけばいいのだけど。あと、在庫管理とかはやっちゃくれない、当たり前だ、そんなシステムは組んでいない。

ところでこのwelcart、有償の拡張プラグインというのがあるのな。昨日気付いた。使う価値があるかどうかちょと検討する。

久しぶりなので画像登録おさらい。新規商品をアップしてみることにする。STC-13
STC-13.jpg  メイン画像
STC13-01.jpg カラー1のサブ画像
STC13-02.jpg カラー2のサブ画像
STC13-03.jpg カラー3のサブ画像
STC13-01-01,13-01-02,13-01-03,13-01-04 まとめて扱われていいサブ画像
以上をアップしてみる 

ダッシュボード → メディア → 新規登録 → ブラウザでアップロード
一括アップロードはできるんだっけか、とりあえず今は1コずつ。枝番の枝番がはじかれる可能性があるので、最下層のサブ画像は2個だけ

商品ページ追加
ダッシュボード → welcart shop → 新規追加 
SKUはSTC13-01,STC13-02,STC13-03 とした。

やってみたが、やはりjpg画像の名前の問題ではなかったようだ。本日も元気にメイン画像を読み込んでいる。
それはともかくとして、商品解説文を長く書いたら、今度は価格表が右にずれて枠からはみだしてるんだよ! こっちのほうが問題じゃねぇか!!! なんとかしなきゃ!

294行目あたりからのsku field かな? デフォ210を400に変えてる。これはたしか単品のときの価格表のマヌケな間延びをなんとかしたんだな。とりあえず戻してみる

元に戻したけど変化なし。単品ページは効いて元通りマヌケになった。なんだよもう。他にどこいじったんだっけか・・・・・・。
こうなった時に結局いちばん早いのはさ、原本に戻しちゃうってことなんだよな。一度やった作業を再度やるのは、最初にやった時よりずっとずっと早いからな。原本に戻す? どうする? それほど変更してないからそれが早いかな?
ほんじゃいい機会なんで、おおもとの原本から当たってみる。usc-cart-cssだっけ、それが2個存在している理由も知りたいしなぁ。

いったん中断します。
中断前の最後の処理。
wordpress、welcartとも原本もう一回確認した。それで、usc-cart.cssの原本を、wordpress\wp-content\themes\に転送上書きした。ただしここの編集は反映されない。この下の階層に転送するくと反映されるのだが、そもそも階層がここで合っているのかどうか不明なので、確認中。
現状、テーマフォルダ内にあるcssは原本。その下にあるcssは編集してある(エラーが出ている)12/09現在のcss。 ←今ココ

まだ構築中

スルーしてね
しつこくまだトライ&エラー続行中。

ローカルとサーバー側のファイル位置が違っておかしいと思っていたんだが、どうもやっぱりそれじゃよくないようだ。
ということで、
wp-contennt/themes/welcart_default/wc_templates/wc_item_single.php
ローカル側でもこっちへ統一。
というかどうしてここにwelcart_defaultがなかったのかがいま考えると不思議。まぁいいか。

問題はやっぱりここに商品番号+枝番のサブ画像を持ってくるタグだ。何とかせねば。 

<?php $imageid = usces_get_itemSubImageNums(); ?>
<?php foreach ( $imageid as $id ) : ?>
        <a href=”<?php usces_the_itemImageURL($id); ?>” <?php echo apply_filters(‘usces_itemimg_anchor_rel’, NULL); ?>><?php usces_the_itemImage($id, 135, 135, $post); ?></a>

サブイメージを呼んでいる部分。<a href>~</a>は不要だな。これしかわからんし・・・。

usces_the_itemSku( ‘return’ ) SKUコードを取得するためのソース
問題はこれをどう埋めるかってことなのか?

<?php $imageid = usces_get_itemSubImageNums(); ?>
<?php foreach ( $imageid as $id ) : ?>
        <?php echo apply_filters(‘usces_the_itemSku( ‘return’ )’, NULL); ?>><?php usces_the_itemImage($id, 135, 135, $post); ?>

<a></a>を取り去って(拡大画像へのリンクだから不要)、似てそうなソースのところにはめ込んでみた。やってみる。

商品ページすべてパースエラーになってる・・・orz T-RETURN のエラー。NULLが悪いのか? そんでもってNULLってなんだ? NULL取ってみたけど結果は同じエラー。
ソースよく見ると、PHP緑?が緑?で終わってないな、これが問題なのか。
ダメだなぁ、php締めてみたけど変わらない。おまけに他のパースエラーまで読み始めてお手上げ、そっちはいじってないのに。結局、保存しておいた元データ転送して復旧。
これじゃダメか・・・ 

<?php usces_the_itemImage($id, 150, 150, $post); ?>これ埋め込んだらとりあえずメイン画像は読み込める。メイン画像は呼べる、サブ画像枝番をどうやって呼んでくるか、なんだよなぁ・・・ 
<?php $imageid = usces_get_itemSubImageNums(); ?>じゃ、これはどうなのよと記述したが真っ白~~雪原だ~~こっ・おっ・やっ・より君を呼ぶ~~~
<?php usces_the_itemImage($id, 135, 135, $post); ?>これ埋め込んでみた、サブ画像を呼んでるところだが、よく見たらこの段落一行目とほぼ同じだな、てことは、これより前に「サブ画像を呼べ」というコードが必要なんだな 

どうも完全に行き詰ったな・・・。山頂は見えているものの垂直の崖に固定ロープなし、って感じだ。
もっとシンプルな方法なんじゃないかと思えたりもする。
<?php usces_the_itemSku(); ?>だけで商品枝番を引っ張ってくるわけだから、画像を呼んで来いという指定+その画像はこの商品枝番に連動する指定で、いいんじゃないか。で、それがわからんという・・・w

<?php usces_the_itemImage(0, 300, 300, $post); ?> これは呼ぶ 
<?php usces_the_itemImage($id, 135, 135, $post); ?> これは呼ばない
もとい
下段でも呼んでる、ただしメイン画像を。因みにこの横の数字を小さくすると画像も小さくなる。それはいいんだが。上の行がメイン画像を呼ぶのは、カッコ内最初の0がメイン画像を示しているからだ。では下の行がメイン画像を呼ぶのはなんでだ?
つまり、$idのところに、「それぞれの枝番画像を呼びやがれ」と指定する関数が入ればいいってことなのか?
<?php usces_the_itemImage(usces_the_itemSku(), 50, 50, $post); ?>
と入れてみた。すると品番2つ連続できてメイン画像orz
<?php usces_the_itemImage(‘usces_the_itemSku()’, 50, 50, $post); ?>
品番1つになったがメイン画像のままだ、枝番画像呼ばないorz
あとちょっと、のような気がする、気がするだけだが。もしかするとぜんぜん違う方法をやっているのかもしれないんだが。

もしかしたらという懸案ひとつ。
商品画像の枝番だが、
PA01  メイン画像
PA01-01  PA01-02 ・・・がサブ画像。
サブ画像は画像のタイトルとしては「PA01-01」なんだが、jpgファイルまで確認するとPA01-01-01.jpgになっている。これは各枝番商品の画像が複数になるに決まっているからなんだが、もしかして、これも問題なのかもしれない。
たとえばサブ画像として呼ぶ画像に関してはPA01-01 でアップして、
そのさらに下になるサブ画像をPA01-01-01・・・でアップする?

わき道に逸れるけどやってみますか? 
←今ココ

商品ページカスタムまだまだ

スルーしてくだされ

複数品番がある場合のいわゆる複数SKUの場合のカスタマイズ。日本語既におかしい。
商品詳細ページのカスタマイズはこちらで。テーマフォルダ内のwc_item_single.php詳細はこっち。こう辿れ。
\usc-e-shop\theme\welcart_default\wc_templates/wc_item_single.php
これをいじることでどうにか編集できるようだ。自分ができるかどうかは別にして。
<!--some SKU--> というコメントが有り、そこからが複数SKU用のソース。
ファイルを特定して、コメント検索すると見つかった。69行目。さて、ここからどうする・・・・・・ 

103行目あたりがどうも怪しいかな・・・。テーブル要素の中、この品番の横に画像が入れば一番いいんだが
場所としてはアタリ、103行目だ。さてここに何を埋め込めばいいんだ 
149行目あたりでサブ画像を呼んでいるな、ここから何とか割り出せないか

これいったん中断

\usc-e-shop\theme/usces_cart.css
27行目 float:none;プラス
332行目 margin-left:0;プラス 
このようにいじって上げてるんだが反映されない。フォーラムで見たコードなんだが。
因みにアップ先はここ
/public_html/wordpress/wp-content/themes/welcart_default/usces_cart.css
この1コ上の階層に上げても何も効かない。ほかのコードは効いてるから、単なるコードエラーなのか・・・?因みにh3要素をずらす作業 
float:none (画像の回り込み解除)は356行か? こっち変えたら回りこみは解除されたが肝心のh3の移動がないぞ

バカタレh3じゃなくてh2じゃねぇか、まったくもう、h2ずらしたらたしかに回り込みは解除されて左にずれたが、今度は価格表との兼ね合いでこれまたマヌケ、元に戻す

もしここんとこいじるとしたら、単品はこのままで、複数だけh2を価格表のすぐ上にずらす、という作業をすればいいんだと思われ それをどうやるかは知らん ← 今ココ

アップグレードはまりまくり6時間

スルー推奨

ついさっきまで構築中のバージョンは1.0.6。よく見ると既に1.0.9が公開されているではないか。これはアップグレードしなければまずい。ということで、ページのカスタマイズを中断して本体のアップグレードに。
できない・・・・・・・・・・・・・・・・・・・・・・・・・・・。
ありとあらゆる検索をかけまくるが、できない。フォーラムで質問しようとアカウントを取ろうとすると、これもなぜか出来ない、つうかパスワードの入ったメールが届かない。呪われているのか。
6時間悶絶して(合間にほんとに腹痛で1時間死んだ)、ようやくできた。もう、自分がどんな作業をやったのか判然としないくらいにいろんなことやったけど、次のアップグレードのときのために書いておく。

ダッシュボードのプラグインのページで、現行のwelcartを停止する。
言っておくがプラグインの自動アップグレードは使用不可(xreaのセーフモードの関係だと思う)
万が一のときのために、現行welcartをバックアップする。FTPで名前を変更しておく、または別階層に名前を変えてからコピーしておく。
新しいwelcartをダウンロード、解凍してしまう(zipのまま上げてもダメ)
解凍した中の、テーマ内のfunctions.php を開いて次の1行を先頭に入れる。ここに書いてあった

if(!defined('USCES_VERSION')) return;

プラグインフォルダにftpでアップロードする。
プラグインページで有効化する。

これでようやく1.0.9アップグレードできた。

C:\lamyai\usc-e-shop\templates/single_item.php が商品詳細ページのphp
通常はcssで変更するスタイルだけど、どうしてもの時はこっちをいじるらしい。ただし、フルphpという書式なのでわからん ←今ココ

商品ページの変更

usc-e-shop>css>usces_cart.css をテーマフォルダにコピー。
修正→同じくテーマフォルダにアップするも読み込まず。
ではstyle.cssと同階層にアップしようとするが、この階層にはすでに同名でcssがある。見てみると違う内容で、上書きするとまずいのでは・・・?
ということで、両方ともコピーを取った上で、修正版に前からあるcssをコピペで追加。
その上で、テーマフォルダにアップロード → 読み込んでいるようだ 

l298 #itempage .field { あたりをいじっている。
価格表がようやく小さくできた。margin:leftを210→400に変更。
しかしその上の商品名部分はそのままなのでこれも探して変えねば。 

l17 同じくmargin:left 310→400に変更で商品名もずれた。 

しかし単品ものはこれで何とかサマになったのだが、複数ものは、商品名だけが右上にあって、価格表は下に100%で表示なので、商品名がマヌケだ。どうする

商品名表示(最上段左)の色変更  l10 #content h1.item_page_title {
←今ココ

まだまだカスタマイズ

技術的備忘録、スルー推奨

フッターのカスタマイズ。背景色変更はcssで簡単に。コピーライトのセンタリングも簡単。
ところが、ナビ部分(1行目)のセンタリングがぜんぜん効かない。こりゃどうしたもんだ。cssでは埒があかないのでphpでコメントアウトしようとしたが、コメントアウト拒否または構文エラー。呪われている。

昨日がんばりすぎた(もちろん構築を)せいか今日は調子が出ないなぁ。
もうトップはこのくらいにして(後からでも直せる)、商品ページに行くべきか。

 左サイドバーのインフォメーション、お知らせに使えるかと投稿方法を模索。新規投稿で未分類のカテゴリに入れるとここに入るようだ。でもこの使い方でいいのか? 

パンくずリストを付けることに。プラグイン入れて、header.phpの下のほうにタグを入れる。
<div class=”breadcrumb”>
<?php
if(function_exists(’bcn_display’))
{
bcn_display();
}
?>
</div>
無事に表示

商品ページがどうもダメダメだと思うのは、価格表(テーブル)が横にびよーんと間延びしてみたり、なんとも締りがないところだと思うんだな。で、ふと気付いた。トップページは3カラムなのに、商品ページは2カラム。これが問題なんじゃないか。
通常は、自分では2カラムが好きで、このブログだって2なんだが、デザインをいじるのが余りにも難しいcssなので、3カラムにできたら少しは見てくれがすっきりするんじゃないかと。ところがこれも難しいらしく・・・・・・。2カラムのまま、商品解説本文の横幅とか、そのへんをいじるしかないのか、しかしいじっても変わらなかったりするからなー、挙句レイアウトが崩れるし。cssって便利なのか不便なのかもうわからなくなってきたよ。 ←今ココ

トップページ変更

トップページのカスタマイズ。
タイトルバーの画像変更 空の画像。
メインバー(タイトル画像下のメインナビ)の高さ→低くした
色の変更は今のところエラー

ウィジェットタイトル変更。271行目から
色画像200×30を作ってcssから呼ぶ→OK グレーからグリーンに変更した 
文字色 808080  

メインナビ色変更 130×56の濃淡ボックスを作って間に2×56を入れて262×56画像。
色はイマイチだけどまぁいいか。  
それよりこの中身はどこで変えるんだっけか  
解決してないけど20111203夜7時のss貼っとく

ss取るのも失敗してるし・・・。写真はまだぜんぶダミー、トップ真ん中写真もダミー。

ヘッダーを画像にしてロゴもそこに入れたので、ブログタイトル(?)を削除したらタイトルバーにURLが表示される。別に構わないと言えば構わないけどちょっと変なので、元に戻し、paddingでロゴから離して背景色の白にして見えないようにした。そこにカーソルが行くとクリックできちゃうけどw  

ウィジェットタイトルの画像が気に入らないので変更。ネットで適当に20×20くらいの画像を拾ってきて、変更した。画像の名前を元のものにしなければ反映されない。○○○.pngてな具合に。gifとかじゃダメだし、別の画像名でもダメだった。  今ココ