*

WordPressの最強無料セット BizVektorテーマでWelcartを搭載してみる

公開日: : 最終更新日:2015/03/11 WordPress ,

かなり高機能でレスポンシブな無料のWordpressテーマ「BizVektor」。こいつに無料なのに高性能なWelcartショッピングプラグインをインストールしてゴニョゴニョしてみた。

まずはカゴのページのデザイン修正。黄色がベースになっているのはアレなので。

201302071744208b4

修正するファイルはここに説明されている。
http://www.welcart.com/community/archives/233

利用中のテーマのstyle.css と同じ場所にusces_cart.css のファイル名で設置することで上書きされるようなので、この方法が今後も考えるとベスト。

該当部分のソースを確認。

<div class=”usccart_navi”>
<ol class=”ucart”>
<li class=”ucart usccart usccart_cart”>カートの中</li>
<li class=”ucart usccustomer”>お客様情報</li>
<li class=”ucart uscdelivery”>発送・支払方法</li>
<li class=”ucart uscconfirm”>内容確認</li>
</ol>
</div>

一応「usces_cart.css」内の状況も確認してみる。526行目あたりから

div.usccart_navi ol.ucart {
 list-style-image: none;
 list-style-type: none;
 display: block;
 height: 31px;
 width: 100%;
以下省略

参考にするため、このままコピーしてテーマファイルの中に置くファイルに貼り付ける。
themes/biz-vektor/usces_cart.css

実際には子テーマを作ってこちらにおくのが普通かな?
themes/child/usces_cart.css

上の画像を見るとわかるが、リストマーカー(番号)が表示されている。「カートの中 2」とかいう部分。これはcssファイルの div.usccart_navi li.ucart に display: block; を指定すれば消える。また、黄色いグラデーションは画像なので、background-image: none; を指定して該当部分をクリアしないと消えてくれない。

div.usccart_navi li.usccart_customer {
	background-color: #243B79;
	background-image: none;
}

只今、カートに商品はございません。の部分は

#inside-cart .no_cart {
	text-align: center;
	width: auto;
	margin-top: 30px;
	font-size: 1.2em;
	font-weight: bold;
	color: #243B79;
	margin-bottom: 40px;
}

こんな感じで指定した。#inside-cart が無いと聞かないので、やはり元ファイルを確認して持ってきて修正って流れが良いでしょう。#inside-cart 入れなくて反映しなくて泣いたし。

ボタン上の横棒は

#inside-cart .send {
	text-align: center;
	width: auto;
	margin-top: 15px;
	padding-top: 15px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #ccc;
}

20130207203247e9d

少しは統一された感じになってきました。

日本のビジネス向けWordPressテーマ「BizVektor」
http://bizvektor.com/

無料なのに高機能 Welcart
http://www.welcart.com/


Sponsored Link


 
 

関連記事

すごく面白くて、とってもくだらないのに効果のある広告が話題

「いまだにこれを越える折り込みチラシを見たことがない」とTwitterで話題になっている広告がありま

記事を読む

WordPressの最強無料セット BizVektorテーマでWelcartを搭載してみる2

前回で色合いは一応統一できた。しかしよく見ると左右が揃っていない。 そこでCSSを修正。下記のファ

記事を読む

ご質問は掲示板へお願いいたします。

Message

メールアドレスが公開されることはありません。

CAPTCHA


Optionally add an image (JPEG only)

Sponsored Link

気になる情報・新製品発見メモ

日頃ネットをウロウロしていて記事にするほどでもない情報、記事にするほど

【開封】SmallRig Drop-In Baseplate (Manfrotto 501PL QR Plate Compatible) 2006

引き続き SmallRig Universal Shoulder Pa

【開封】SmallRig Universal Shoulder Pad 2057

最初にお断りしておきますが、いわゆる「単なる開封」記事です。予めご了承

【雑談】URSA mini の設定確認とか安物時計を貰った話

寒くなってきましたがスッキリ晴れ渡る日曜日。久しぶりに予定もなくノビノ

URSA mini & Filmconvert アップデート祭り

いつものように雑談更新。今更お断りすることも無いとは思いますが、今回も

SONY α6300 24p 30p 60p 120pで画質比較

世間では黒金とか言うケシカラン状況になっています。 浮かれポンチ

→もっと見る




  •  

PAGE TOP ↑