wordpressのgurtenbergで入れ子にする方法?

クラッシックエディターの時は古くはtableで段組みし、その後はdivの中に別のdivのクラスをfloatで横並びにしたりしていた「入れ子」構造。
gutenbergではブロック要素にブロック要素を移動出来ず…入れ子構造にするにはどうしたらいいのか考えていました。
つまり、昔でいうところの素地になるdivに背景をつけて、その中に文字要素やら写真やらを置きたい…という場合などの作り方です。
ググっても全然ヒットせず、みんなどうしているのだろうと思っていたのですが、ふとひらめきました。

入れ子の中に入れたいものをまとめて「グループ化」して、そのグループに背景つけたらいけるんじゃね??

その通りでした(笑)

ググっても出ないのはきっとみんな当たり前のように知っているから、なんでしょう。
お恥ずかしい…(ˉ ˘ ˉ٥ )

けど、もしかしたらここでつまづいている人がいるかもと思うので一応記しておくことにします。

追記:
↓素地のブロックに背景を付ける方法
①背景画像をライブラリに追加してその場所のURLをコピーしておく
②CSSに以下を追加(box1-haikeiは好きな文字列でOK)
.box1-haikei {
background-image:url(“①でコピーしたURL”);
}
③この背景にしたいブロックの(右メニュー最下部の高度な設定→追加CSSクラスに「box1-haikei」と入力して更新
カテゴリー: Wordpress | タグ: , | コメントする

レッスンやイベント予約に最適なプラグイン-Booking Activities

ココナラでWordpressに予約ページを付けるお仕事を請けていますが、今回色々なパターンのレッスンをカレンダーに表示した形で予約を受けられるようにしたいというご要望にお応えして、プラグインを探したところ「Booking Activities」という素晴らしいプラグインを発見しました。
残念ながら日本語には対応していないのですが(翻訳を登録するところを見つけたので今、裏でせこせこ入力中です。)フロントは99%日本語化出来ます。
需要があれば時間のある時に使い方の説明をしようかなぁと思っています。
ちなみに、見本は「ここ」にあります。
ダミーサイトなので試してみて頂いて構いません。
wordpressに組み込みたい場合は9,000円(税込)でお受けしていますのでお問い合わせからご連絡くださいませ。

▼見本

カテゴリー: Wordpress | コメントする

Welcartから配送先の情報を非表示にする

クライアント様からWelcartを使って一つの商品で金額違い商品を販売するサイトをご依頼頂きました。(在庫は一元)
この件についてはまた記事を書きますが、今回は標題の件を書きます。
クライアント様は対面販売の予約用にこれをお使いになりたいとの事で、配送先があると出前してもらえると勘違いさせてしまうかもしれないので取って欲しいとのこと。
かなーーーーーーーーーり悩みました。
Welcartに質問したらカスタムの相談は有料との事で7万ぐらいするみたいだし…( ̄ω ̄٥)

で、山ほど悩んで実装出来ましたので万一同じような案件がある方に向けて覚書しておきます。

場所は
お使いのテーマにあるfunction.phpに以下を書き足します。


/***********************************************************
* メールから「送付先」を削除する
***********************************************************/
add_filter( 'usces_filter_send_order_mail_shipping', 'my_filter_send_order_mail_shipping', 10, 3 );
function my_filter_send_order_mail_shipping( $msg_shipping, $data, $entry ) {
//処理
$msg_shipping = "" ;
return $msg_shipping;
}

/***********************************************************
* 確認画面から「送付先」を削除する
***********************************************************/

add_filter( ‘usces_filter_shipping_address_info’, ‘my_filter_shipping_address_info’ );
function my_filter_shipping_address_info( $shipping_address_info ) {
//処理
$shipping_address_info = “” ;
return $shipping_address_info;
}

/***********************************************************
* カレンダー発送業務休日を休業日に変更
***********************************************************/
add_filter(‘usces_filter_widget_calendar’, ‘my_filter_widget_calendar’, 10);
function my_filter_widget_calendar($myword){
$myword = ‘(      休業日)’.”\n”;
return $myword;
}

 

今回改めて「フック」なるものを使いましたが、これって使い慣れたら便利そうですね〜。

年超える前に解決出来てよかった。

カテゴリー: Welcart, Wordpress, 制作のツボ | コメントする

Welcartの在庫ステータスに「オーダーメイド」を入れる

私が展開しているWeb Shopはオーダーメイド品が多く、在庫がない場合が殆どなのでステータスに「オーダーメイド」を入れたいと思いました。
ググッた結果出来ましたので備忘録的に書いておきます。

wp-content>plugins>usc-e-shop>includes>initial.php
(私はいっつも、このusc-e-shopがどこにあるのか分からなくなります…(^_^;))

この中の

$zaiko_status = array(
					'0' => __('In Stock', 'usces'),
					'1' => __('A Few Stock', 'usces'),
					'2' => __('Sold Out', 'usces'),
					'3' => __('Out Of Stock', 'usces'),
					'4' => __('Out of print', 'usces')
					);

この部分を

$zaiko_status = array(
					'0' => __('In Stock', 'usces'),
					'1' => __('オーダーメイド', 'usces'),
					'2' => __('Sold Out', 'usces'),
					'3' => __('在庫なし', 'usces'),
					'4' => __('Out of print', 'usces')
					);

こう変えます。

2以降は何に変えても購入は出来ない仕様になってますので、購入出来る状態での変更は0か1で。

ちなみにこれはWelcartがVer.UPしたら上書きされて元に戻りますので注意が必要です。

カテゴリー: ■Web, Welcart, Wordpress | 1件のコメント

コート90kgってどんな紙なの?

チラシなどを制作する時、印刷屋さんに依頼するわけですがその時に「紙」を選んで注文しなければなりません。
この紙の種類と厚さによって金額が違うのに、一般人にはコート90kgってどんな紙なのか全く想像がつかないと思います。
そこでちょこっと解説を。
(以前広告会社にいた時に得た知識なので万一間違っていたらどなたかご指摘下さい(^_^;))

・コート紙とマットコート紙

コート紙というのは両面に薄くコート剤を塗布してある紙で、ツルツルした紙のことです。
「コンサートなどに行くと配られる宣伝用のチラシ」などがこのタイプですね。
マットコート紙というのはいわゆる普通の「紙」のことです。「ハガキのような紙」というと分かり易いでしょうか。

・厚みなのに何故kgなのか

これは印刷用語なんですね。
印刷用紙の単位である一連あたりの重量(連量(同じ規定の寸法に断裁された紙1,000枚=一連))を表します。
簡単に言うと「その紙を1000枚重ねたkg」ということ。
つまり、重くなればなるほど厚みも増す、ということです。
だがしかし。90kgとか言われても1000で割った厚みなんて想像もつかないですよね(^_^;)
以下、ざーーーっくりですが厚みの目安です。
73kg…新聞紙
90kg…コピー用紙
110kg…一万円札
135kg…週刊誌の表紙
180kg…郵便局の年賀状
220kg…市販されている私製はがき

ですから、チラシを作られるのであれば90kgか110kg
ハガキなら180kg
…という感じで選ばれたらよいと思われます。

カテゴリー: ■DTP, 制作TIPS | コメントする

Welcartのお客様情報入力画面の記入例をカスタムする

Welcartではお客様情報を記入する部分に記入例が書いてあるのですが、電話番号が「1000-10-1000」とかになっているので(^_^; サイトに合わせて修正したい場合があると思います。
その場合には手元にある「usc-e-shop」(Welcartのプラグインの入ったフォルダ)>functions>function.php に以下を追加します。(<?PHP 以下に書かないとダメですよー)

※郵便番号フィールドの記入例

add_filter( ‘usces_filter_after_zipcode’, ‘my_filter_after_zipcode’, 10, 2);

function my_filter_after_zipcode( $str, $applyform ){

return ‘郵便番号のサンプル’;

}

※市区群町村フィールドの記入例

add_filter( ‘usces_filter_after_address1’, ‘my_filter_after_address1’, 10, 2);

function my_filter_after_address1( $str, $applyform ){

return ‘市区群町村のサンプル’;

}

※番地フィールドの記入例

add_filter( ‘usces_filter_after_address2’, ‘my_filter_after_address2’, 10, 2);

function my_filter_after_address2( $str, $applyform ){

return ‘番地のサンプル’;

}

※ビル名フィールドの記入例

add_filter( ‘usces_filter_after_address3’, ‘my_filter_after_address3’, 10, 2);

function my_filter_after_address3( $str, $applyform ){

return ‘マビル名のサンプル’;

}

※電話番号フィールドの記入例

add_filter( ‘usces_filter_after_tel’, ‘my_filter_after_tel’, 10, 2);

function my_filter_after_tel( $str, $applyform ){

return ‘電話番号のサンプル’;

}

※FAX番号フィールドの記入例

add_filter( ‘usces_filter_after_fax’, ‘my_filter_after_fax’, 10, 2);

function my_filter_after_fax( $str, $applyform ){

return ‘FAX番号のサンプル’;

}

ちなみに、項目を削除する場合には(ここではフリガナのフィールド)

add_filter( ‘usces_filter_furigana_form’, ‘my_filter_furigana’, 10, 3);

add_filter( ‘usces_filter_furigana_confirm_customer’, ‘my_filter_furigana’, 10, 3);

add_filter( ‘usces_filter_furigana_confirm_delivery’, ‘my_filter_furigana’, 10, 3);

function my_filter_furigana( $furigana, $type, $values ){

return ”;

}

とするそうです。

この変更を加えたfunction.phpをサーバーの
wp-content>plugins>usc-e-shop>functions>function.php
に置き換えてやればOKです。

★必ず複製を取ってから作業しましょう
★保存時にエンコードを間違えないように気をつけて下さい

引用元:
Welcartコミュニティ「
お客様情報の入力見本を変更したい」

カテゴリー: ■Web, Welcart, Wordpress, 制作のツボ | コメントする

【Excel】二つのセルの文字数を足して文字数制限する

自分用のメモです(^_^;
私はライターの仕事もしており、エクセルで文字数をカウントしながら書いています。
今回、ある事案があり、タイトル80文字、それを含めて全体で300文字以内、という内容の物がありそれをどうしたら文字制限出来るのかあれこれ試行錯誤しました。

エクセルでセルの文字数を数えるのにLEN関数を使いますが、以下のような場合の文字制限の仕方のTIPSになります。

タイトル A1:入力文字(80文字で制限)
内容   A2:入力文字(A1とプラスして二つのセルの合計が300文字以内に制限)

この場合、A1のセルは通常通り
データ>入力規則>設定 で「入力値の種類」を「文字列(長さ指定)」にして、データを「次の値以下」にし、最大値を「80」にすればいけるのですが

A2はA1と足した数にしたいのでこの方法では出来ません。
データ>入力規則>設定 までは同じなんですが「入力値の種類」を「ユーザー設定」にします。(そうするとデータ、は反転して設定出来なくなるのでここは無視してかまいません)
その下の「数式」に

=AND(LEN(A1)+LEN(A2)<=300) ※A1をLEN関数で出した文字数+A2をLEN関数で出した文字数が300以下の場合 ↑この場合にのみエラーが出ない、という考え方 これで実装出来ます。(^-^) ここからは余談です。 最初は、それぞれをLEN関数で文字数を割り出し、それを足したセルの計算結果が300を超えた場合にエラー、という考え方をしていたのでどん詰まりましたOrz 計算式の入っているセルに、その計算結果についての入力規則をあてがう事が出来ないからです。 どんな場合でもプログラムを考える時には「発想の転換」が必要なんだなぁと改めて感じました。 ここにたどり着くまでに3時間ぐらいかかっちゃいました(T▽T)

カテゴリー: その他TIPS | コメントする

WordPressをECサイト化する

WordPressをECサイトにするプラグインがあるんですねぇ。しかも無料。
Welcartといいます。
設定の仕方はここにうだうだ書くよりもWelcartの中にある説明を読んで頂ければ一目瞭然なので以下を参考にして下さい。
▼導入フロー
http://www.welcart.com/wc-flow/
設置は本当に簡単に出来ちゃいますし、商品登録などもこれ系のものを一度でも使った事がある方なら直感的に使えると思います。優れものです!!
ただ、私がものすごく悩んでしまった事があるので、それだけ書かせて頂こうと思います。
それは、カテゴリー。
Welcartの設定の中にはカテゴリーを追加する機能がないんです。何度も何度も、全てを探しましたがありません。
だがしかし、WP自体の「投稿」の中にある本来の「カテゴリー」に追加しても全く反映しないのです。
困った・・・・・
あれこれググってやっと分かりました。
Welcartは全てのカテゴリーが「商品」以下にないと反映しないのです。
つまり、新たなカテゴリーを作ったら必ずそれは子カテゴリーにして親を商品以下のものにしないとならない、という事。
これで万事解決です★

そして、問題はデザイン。
Welcart用の基本のデザインはあるので、それを使用するか、画像だけ差し替える・・のなら簡単なんですが、(差し替え用のデザインテンプレもありますが有料です→テンプレート)既存の(Welcart用になっていない)テンプレを使いたいとなると設定はかなり厄介です。( ̄▽ ̄;;;
今までのデザインも使えるとか、WPのバージョンアップに影響しない、のがウリのハズなのになー。

これについても以下に素敵な記事を書いて下さっている方がいるのでリンクしておきます。
既存のテーマを利用したショップの作り方 その1
既存のテーマを利用したショップの作り方 その2
既存のテーマを利用したショップの作り方 その3

カテゴリー: ■Web, Wordpress | コメントする

WPtouchのCSSがAndroid4.1で切れるのを回避

WordPressを使ったサイトをスマホで見る時に使うプラグインとして、もはやデフォルトと言っても過言ではないほどのWPtouchですが、Android4.1に対応しておらず、Android4.1のスマホで見るとCSSが切れて、白い背景に文字だけの素っ気ないサイトになってしまいます。
これを回避するには、以下のサイトから対応させるプラグインをダウンロードして「wp-content/plugins」にFTPし、プラグインの画面で有効化します。
これだけでAndroid4.1のスマホからでも通常のWPtouchの画面になります。

▼WPtouch for JB(Jelly Bean)
http://8wired.jp/wptouch-for-jelly-bean

世の中にはこんな素晴らしい物を開発して無料配布して下さる方がいます。
実に素敵です。

カテゴリー: ■Web, Wordpress | コメントする

WordPress/Contact7 スパム対策

以前にIPの表示の仕方を書きましたが、更にパワーアップ? リモートホストネームと使用ブラウザなどを表示させる方法と、ロボットによるスパム書き込みが出来なくなるようにクイズを設定する方法です。

=============================================
★リモートホストネームと使用ブラウザを表示させる
=============================================

(1)使用しているテーマのfunction.phpに以下を追加。

//Contact Form 7 ホスト名取得 cf. http://ja.forums.wordpress.org/topic/3470
add_filter(‘wpcf7_special_mail_tags’, ‘wpcf7_special_mail_tag_for_remote_host’,10,2);
function wpcf7_special_mail_tag_for_remote_host($output, $name)
{
// Special [wpcf7.remote_host] tag
if(!isset($re_addr)){ $re_addr = $_SERVER[‘REMOTE_ADDR’]; }
if(‘wpcf7.remote_host’ == $name){ $output = gethostbyaddr($re_addr); }
return $output;
}

//Contact Form 7 ブラウザー情報取得 cf. http://ja.forums.wordpress.org/topic/3470
add_filter(‘wpcf7_special_mail_tags’, ‘wpcf7_special_mail_tag_for_remote_ua’,10,2);
function wpcf7_special_mail_tag_for_remote_ua($output, $name)
{
// Special [wpcf7.remote_ua] tag
if(!isset($u_agent)){ $u_agent = $_SERVER[‘HTTP_USER_AGENT’]; }
if(‘wpcf7.remote_ua’ == $name){ $output = $u_agent; }
return $output;
}

★追加する場所は 「?>」より上

(2)Contact7の送信データに以下を追加(必要なら返信用のメール2のデータにも追加)

■投稿者情報
ホスト名:[wpcf7.remote_host] (IP: [_remote_ip])
ブラウザ:[wpcf7.remote_ua]

=============================================
★ロボットスパム防止のためにクイズを設定する
=============================================

[quiz capital-quiz “質問?|答え”]
をフォームに書き足すだけです。
この答えを書かないと送信出来なくなります。

以下のような形でフォームに追加

<p><b>【いたずら防止】(必須)</b><br />
※ロボットスパム書き込みを防止するため、お手数ですが以下のクイズに答えて下さい。<br />
[quiz capital-quiz “犬を平仮名で書くと?|いぬ”]

クイズは何でもOKですが万人が答えられないような物や人によって違う書き方をする物は避けましょうw
日本語の答え(特に平仮名)にすれば海外のスパムはまず間違いなくカット出来ると思います。

カテゴリー: ■Web, Wordpress, 制作のツボ | コメントする