「スマホ・パソコン・Web関連」カテゴリーアーカイブ

Twenty Fifteen シンプルな記事型ブログに最適なテーマ

シンプルですっきりとしたテーマ/テンプレートなのだが、あとTwentyfifteenに限らず、Twentythirteenもだが、基本的に英語環境で開発されているので、日本語にした時にはフィーリングが合わずしっくりこない。

具体的には左のメニューが大きすぎる、コンテンツ部分が少し狭い。灰色のborderが邪魔。などが代表的で一見すると簡単に変更できそうだ。

Twentyfifteenは意外とカスタマイズしにくかった

理由は以下の通り
・レスポンシブデザインで作られていて、CSSのメディアアンカーを探しにくい
・width などの配置を決めるpadding: 0.7917em 1.5833emなどの桁数が多くピンとこない
・前述の灰色のborderは実はboxshadowでやっているので分かりにくい

twentyfifteenで、CSSで簡単にコンテンツ部分を広げる方法

CSSで以下のような記述の部分を探そう。

.site-content {
display: block;
float: left;
margin-left: 20.4118%;
width: 79.5882%;
}

.sidebar {
float: left;
margin-right: -100%;
max-width: 313px;
position: relative;
width: 25.4118%;
}

ここで、 width: や margin-left: の値を好きに変更して、デザインを確かめてみよう。

なお、先述の通り、PC用のデザインを変えたいならメディアアンカーに注意が必要！

@media screen and (min-width: 38.75em) {
/*この間の部分を変更すること*/
}

↑こういう感じのやつ。

twentyfifteenで、灰色のborderを非表示に

このborderをカスタマイズするのがやっかいだった。
理由は、borderと言いつつ、ここはbox-shadowで描画されているから見つけられなかったのだ。border-left: 1px;などといくら検索しても何も見つからない。

.post-navigation {
border-top: 0;
box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);
margin: 7.6923% 7.6923% 0;
}

こういった感じで、色々なところにbox-shadowで灰色の線が引かれている。

これを以下のように、

box-shadow: 0 0 0 rgba(0, 0, 0, 0.15);

すればとりあえず線は消える。

これも、メディアアンカーに注意だ！

Zen Cart, スマホ・パソコン・Web関連

ZenCartで通貨表示を￥から円やJPYに切り替える方法

2015/03/17 あすたまコメントする

Zen Cartの通貨表示に問題あり！

Zen Cart はデフォルトでは、￥になってるが、コレを半角でかくと「バックスラッシュ」になってしまう場合がある。
ローカライズ – 通貨設定 – のところで、右側シンボルを「円（税込）」とすることで、この￥の問題は解決できる。
「円（税込）」と日本語で入れるのだが、実はそうすると英語表示をした時にも円（税別）とでてしまい、わけが分からなくなる。

しかしじゃあ英語の時には通過はドルにしようとすると、、為替レートの管理、送料の管理がかなり大変になってしまう。

例えば、送料を500円としていると、ドルに変換されると500ドルというとんでもない数値になる。なんともマヌケ。

最近ではクレジットカードやPaypalを使えば、円決済でも勝手にレート換算されるので、もう世界中を日本円で取引してしまうほうが、断然いいわけだ。

英語表示用の新しい通貨を追加する

管理画面の、ローカライズ – 通貨設定 – のところで、新しい通貨を追加。
JPYは既にあるはずなので、YENなどで作っておく（海外用の円）。設定値は1.0000000のままで。

右側シンボルを「JPY (inc.VIT)」など、外国向けの表記にしておく。

英語表示の円をJPYにしよう

includes/languages/english.phpの42行目。

// if USE_DEFAULT_LANGUAGE_CURRENCY is true, use the following currency, instead of the applications default currency (used when changing language)
define(‘LANGUAGE_CURRENCY’, ‘YEN’);
↑ CURRENCYをUSDからYENに。

これで通貨は円のまま、表記だけ英語にすることができる！

Zen Cart, スマホ・パソコン・Web関連

Improved Attributes Controllerで、Zen cart オプション値を使いやすくカスタマイズ

2015/03/09 あすたまコメントする

「Improved Attributes Controller」というものがある。

ここからダウンロード。
Improved Attributes Controller.zip

これでZenカートのオプション名とオプション値が連動してない状態は改善される。
方法は簡単。adminフォルダに attributes_controller.php を上書きするだけ。
Zen Cartにとって、オプション値、オプション名、オプション編集は、ダウンロード商品や、サイズ、色などを指定する、とても重要な機能にも関わらず、使い勝手が非常に悪い。

※Zen Cart v 1.3.9以降は初めから組み込まれているので、上記のファイルをダウンロードする必要はないが、後述のカスタマイズは同様の方法で可能。

Improved Attributes Controller で、

この状態から、

この状態になる。

まあこまでは簡単。他のページでも紹介されているが、これだけでは不十分で、微妙に使い勝手が悪い。元に比べるとはるかに改善されてはいるが。

ここ。1670行目あたりから始まる、

<!– start modification for improved attributes controller –>

<td class=”attributeBoxContent”> <?php echo TABLE_HEADING_OPT_NAME . ‘<br />’; ?><select name=”options_id” id=”Option Name” onchange=”TCN_reload(this)” size=”<?php echo ($action != ‘delete_attribute’ ? “5” : “1”); ?>” >
<option selected>Option Name</option>
</select> </td>
<td class=”attributeBoxContent”> <?php echo TABLE_HEADING_OPT_VALUE . ‘<br />’; ?><select name=”values_id[]” id=”Option Value” onchange=”TCN_reload(this)” multiple size=”<?php echo ($action != ‘delete_attribute’ ? “5” : “1”); ?>” >
<option selected>Option Value</option>
</select> </td>
</tr></table></td></tr>
</table>

この赤文字で書いた「5」の部分を 10 でも 20 でも、好きな数字に変える事で、

これが、

こうなる。仮に 10 にしてみた。

これで作業効率は10倍以上と言っても過言ではないぐらい上がる。

あすたまいず