Tag Archives: Facebook

海外向けの販売に便利なショッピングカート「Ecwid」

個人的に、仙台在住のデザイナーさんが手がける、手作り手帳の海外向け販売をお手伝いしている。 非常に素晴らしい出来栄えの革の手帳である。 デザイン・ワイ 私は、海外でのマーティングを得意としているわけではないので、残念ながら沢山売れているわけではないのだが、「こんな少ないアクセスでよくも」と思えるほど、コンスタントに売れている。 そもそも、沢山受注しても、手作りなので、注文を処理出来ないのだが・・・。 驚いたことに、非常に高い確率でメール、お手紙、場合によっては、なんと、お礼の品という形でフィードバックが届く。 海外でも非常に高い評価を受けているようだ。 本来のブログのテーマからすれば、この手帳の事を書くべきだが、手帳の話は別の機会に書くことにする。 現在、海外向けの手帳の注文は、メールフォームで受け、折り返し、メールで支払先の「PayPal ID」を連絡する形で対応しているが、使い方が分かり難いという意見があったり、間違った金額を支払われたりすることもある。 また、コンスタントに注文も来るので、出来れば管理上の手作業を減らしたい。 そこで、ショッピングカートを導入しようと、昨年末から、様々なカートをテストしてきた。 その結果、1つのカートに絞ったのだが、それがロシア生まれのショッピングカート「Ecwid」である。 「開発元である「Creative Development LLC」は、「XCART」などのショッピングカートも手がけており、この分野に強い会社のようだ。 「Ecwid」は、サーバーにインストールするタイプではない。また、ホスティング型のサービスでもない。 「JavaScript」で記述されたコードを、自分のサイトに貼りつければ、そのページがショッピングカートになる。 サーバーではなく、ブラウザでの演算に依存する手法なので、理屈的には、「JavaScript」の使用に制限のないホームページ、サーバーなら、場所を選ばず、「Ecwid」を利用出来るのだ。 有料版と無料版が用意されており、無料版でも十分な機能を持っている。 管理機能や受注データの保存は、「Ecwid」サイトのコントロールパネル内で行っているので、ホームページさえあれば、特に追加投資無く、ショッピングサイトを構築する事が可能である。 「Ecwid」の利点としては、 自サイトへの導入が簡単でサーバーに依存しない。 サーバーやサイトの移転の際の作業が簡単。 多言語表示に対応。 たっぷりと画像や動画を使って商品ページの作成が可能。 ダウンロード製品の販売にも対応。 柔軟な配送設定が可能。 柔軟な決済が可能。 決済方法としてPayPal、GoogleCheckoutをサポート。 携帯電話用ページも作成出来る。 Facebookページに、カートを表示させる事が可能。 プラグインを利用してWordPessに表示させる事も可能。 などが上げられる。 しかし、「JavaScript」を利用しているため、スクリプトの読込みにやや時間がかかる印象がある。 また、ページ全体をSSLで暗号化出来ないため、フォームデータの送信に関しても不安があるが、最低限のセキュリティは施されている。 加えて、カートやメールはUTF-8でエンコードされているため、日本の携帯電話では、機種によっては、2バイト文字が文字化けする可能性があるが、海外の携帯電話では問題ない。 「Ecwid」が提供するショッピングカートは、シンプルなデザインで、様々なサイトにマッチする。 デザインが気に入らなければ、CSSでカスタマイズする事も可能だ。 買い物の仕方も、一般的なカートを踏襲したものであり、顧客が使い方に悩むことはないだろう。 技術的にはAjaxが使われており、ページを移動してもページの再読込みが発生しないので、買い物をする側としても楽だ。 携帯電話用のページも用意されているが、フルブラウザでの参照を前提としており、HTMLで記述されている。 画面が小さい携帯電話でも、無理なく表示できるように、横幅が狭く、画像も極力廃したデザインになっている。 ショッピングカートの表示言語は、コントロールパネルから設定出来る。同時に複数の言語が設定でき、顧客のPC環境に合わせて、自動的に表示言語が選択される。 英語の他、ブラジルポルトガル語、ブルガリア語、中国語、クロアチア語、チェコ語、デンマーク語、オランダ語、エストニア語、フランス語、ドイツ語、ギリシャ語、ヘブライ語、ハンガリー語、インドネシア語、ラトビア語、ポーランド語、ルーマニア語、ロシア語、セルビア語、スロベニア語、スペイン語、スウェーデン語、タイ語、ウェールズ語に対応してる。 現時点では日本語には対応していないが、後で述べる通り、将来、対応する可能性もある。 追記:Ecwid 7.0から、ショッピングカートについては日本語での表示に対応。ただし、管理画面のメニューは、日本語表示されない。 多言言語表示と言っても、あくまでショッピングカートの表示言語であり、コントロールパネルの表示言語は英語を基本としている。 しかしながら、テスト段階であるためかスマートなやり方とは言い難いものの、コントロールパネルの表示言語を切り替える事も可能だ。 現状、英語、ロシア語、フランス語、ドイツ語、イタリア語に対応している。 なお、コントロールパネルの言語の切り替え方法については、ナリッジベースの「Backend translations」に記述がある。 「Ecwid」では、ショッピングカート上のラベル(表示)をJavaScriptによって書き換える機能も提供している。また、エンコードがUTF-8であるため、日本語などの2バイト文字での置き換えも可能だ。 このラベルの置き換え機能を利用した、言語インターフェースが、JavaScriptの形でダウンロード出来るようになっている。 How to install other storefront translations? 現状、用意されているJavaScriptは、ノルウェー語、トルコ語、フィンランド語、リトアニア語、イタリア語のもので、画像として表示されるボタンの置き換え方法は、「How can I translate or change buttons?」でまとめられている。 ただし、この手法で言語の変更を行った場合は、コントロールパネルで設定した言語の自動切り替えが無効になる。 つまり、使用したJavaScriptに応じた1言語のみでの表示となり、様々な国に向けの販売には向かない。出来れば、言語の設定はコントロールパネル内で完結させるべきだろう。 また、これらのJavaScriptは、現行バージョン用に作成されたものではなく、置き換えも不完全で、翻訳されないラベルも発生する。 「Ecwid」では、ラベルを置き換えるJavaScriptを簡単に作成できる「Ecwid Translate Tool」を提供しているので、これを利用して翻訳や気に入らない表現の置き換えが可能だが、このJavaScriptの使用は、1言語で運営する場合に限り、有効と言える手段だ。加えて、現行バージョンでは、置き換えが不完全である。 前にも書いた通り、最も良い、言語の設定は、コントロールパネル上で設定することだが、必要とする言語に未対応の場合でも、その気になれば、「Ecwid」から提供されるのを待つ必要はない。 「Ecwid」は、翻訳に関してはボランティアを募集している。 翻訳のやり方は、「How to translate my Ecwid store to a new language?」にある。 また、コントロールパネルの翻訳に関してもボランティアを募集しているが、ラベルなどの情報は公開されていないようなので、興味があれば「Ecwid」にコンタクトしてみるのも良いだろう。 実は、私も、ショッピングカート部分だけではあるが、日本語訳を作成し、「Ecwid」に提出した。次期バージョンで採用される可能性もある。 ファイルは、「Japanese language files」で公開されており、その中の「ecwid-ja.js」を使えば、採用を待たなくとも、日本語化が可能だ。 ただし、間違いがあるかもしれないので、使用に関して何の保証もしない。 「buttons_ja.zip」には、日本語版のボタン、「notifications_ja.zip」には、コントロールパネルの「Mail」で設定するためのメール用メッセージが含まれている。 日本語化した場合でも、住所の入力方法までもが日本風に変わるわけではないので、日本国内向けの販売には不向きだ。 これは、仮にコントロールパネル上で日本語の選択が可能となった場合でも同じこと。あくまで、「Ecwid」における日本語版とは、海外から日本に対して販売を行う場合に便利な機能である。 日本人にとっては、コントロールパネルの日本語訳こそ、一番有益かもしれない。 日本語で管理出来れば、海外向けのショッピングサイトの運営が楽になる。

Posted in WordPress, ネット・PC | Tagged , , , , , , | 1 Comment

多機能ツールバー「Wibiya」をWordPressに導入

「Wibiya」とはブログやHP向けの多機能ツールバーを提供するサービズである。 ブラウザの表示領域の一番下に表示されため、邪魔にならず、最小化することも出来る。 「Wibiya」ツールバーには、様々な機能を追加することができ、サイトに合わせた機能が提供できる。 登録の際に、サイトの言語として日本語を選択できるので、日本語のサイトへの設置にも対応していると思われるが、全ての文字コードで問題ないかは不明。UTF-8でしか試していない。 従来は、ウィジェットの形態や、コードの形態で、個別に追加する必要があった検索機能、メールフォーム、共有ボタン、チャットと言ったアプリケーションを簡単に、一括で追加出来る。 多言語への翻訳アプリケーションも用意されている。 「AddThis」、「ツイート」ボタン、Facebookの「いいね」ボタンなどソーシャルメディアに関連したアプリケーションも豊富だ。 これら豊富なアプリケーションに中から、自分のサイトに適したものを自由に選択できる。 デザインの変更やアプリケーションの追加、設定は管理画面から行う、残念ながら管理画面は日本語化されていない。 管理画面では、統計情報も用意されている。 ただし、統計情報では日本語は文字化けしてしまう。 アプリケーションのラベルや代替テキストは、本来英語だが、殆どのアプリケーションでは管理画面で日本語に変更することも可能だ。 WordPressへの導入は、プラグインを利用して行えるため簡単だ。 「Wibiya」の管理画面からもダウンロードできるが、「Wibiya Toolbar」で検索すると直ぐに見つかる。 ツールバーの追加が完了したら「外観 -> Wibiya Configuration」で「Wibiya Toolbar Path」を入力する。 「Wibiya Toolbar Path」は、「Wibiya」の管理画面の「Edit Toolbar -> Install Again」で、導入先のサービスを選択すると表示される。 「Wibiya」は、豊富な機能を、ブログやHPのデザインを損ねずにスマートに追加できるので、これだけで完結できると言った印象のツールである。 また、これら豊富な機能を一元管理できるというメリットも大きい。

Posted in WordPress, ネット・PC | Tagged , , , , , , | Leave a comment

WordPressに「zenback」を導入する

「zenback」は、自動的に記事を解析し、関連性の高い記事やソーシャルメディアの反応をブログに表示してくれるブログパーツだ。 「Movable Type」などで知られる「Six apart」が提供している。 今回は、ブログのカスタマイズの一環として、この「zenback」を導入した。 現在、数多くのソーシャルメディア関連のツールが存在するが、その殆どが海外のものであり、必ずしも日本の状況に即したものであるとは言えない。 ソーシャルメディアのシェアにしても、国によって大きな違いがあり、日本も特殊な事情を抱えている。 「mixi」の存在もその1つであるし、日本では「Facebook」のシェアが低いこともそうだ。 対応するソーシャルメディアの数を謳ったツールも少なくないが、これらは、必ずしも使い易いとは言い難い。選択肢が多い分、使い方を誤ると逆効果になる。 その点、「zenback」は、けして高機能とは言えないが、魅力的な機能を提供してくれるツールと言える。 機能的には「LinkWithin」に類似しているが、対応するサービスも日本の事情を意識したものになっているので使い勝手が良い。 まず、「zenback」は、ブログに「ツィート」、「はてなブックマーク」「mixiチェック」、「Evernoteサイトメモリー」、Facebook「いいね!」といったソーシャルボタンを提供してくれる。 ソーシャルボタンについては、正直、強力とは言えないが、あまり数を求めるより、これくらいの方が使い易いかもしれない。 しかし、「zenback」の真骨頂は、ソーシャルボタンではない。 「zenback」は、記事を解析し、 関連キーワード 関連記事 関連リンク Twitter(での言及) はてなブックマーク(への登録) を自動的に抽出し、一覧表示してくれる。 「関連キーワード」の項目では、記事から主要なキーワードを抽出し、表示する。また、キーワードをクリックすると、そのキーワードを含む「zenback」ユーザーの記事の一覧が表示される。 これは外部へのアクセスを促す機能とも言えるが、逆に言えば、同じキーワードを持つ外部の記事からの訪問を促す機能でもある。 「関連記事」では、自分のブログ内の関連性の高い記事を抽出、一覧表示してくれる。これには、自ブログ内での動きを活性化する効果があるだろう。 「関連リンク」では、関連性のある「zenback」ユーザーの記事を一覧表示してくれる。これは外部へのリンクであるが、自分の記事へのリンクも同様に、どこかの「zenback」ユーザーの記事に表示される可能性がある。 「Twitter」では、記事に対して言及したツィートを一覧表示してくれる。「はてなブックマーク」では、「はてなブックマーク」への登録状況を知ることができる。これらは、記事への反響を知る需要な指標になる。 すべての機能を使うと、ブログパーツとしては、かなり場所を取る類のものになるので、短い記事をたくさん投稿するスタイルでは、アンバランスになるかも知れない。 導入も簡単と言いたいところだが、実は、一癖ある。 「zenback」では、1つのアカウントで、複数のブログ用のコードを発行できるようになっている。 設定画面も至ってシンプルだ。 「WordPress」への導入は、単純に、発行されたコードをテンプレートに貼り付けて行う。 ※2011/4/17 当ブログで公開中のプラグイン「EZ zenback」を利用すれば、「zenback」の導入が簡単になる。 コードを貼り付ける場所は、使用しているテンプレートやWordPressバージョンによっても異なってくる。 このブログの場合、テンプレートは「2010 Weaver 1.5.4」。コードは「単一記事の投稿(single.php)」というテンプレートに貼り付けた。 <!– #content –> の直前に貼り付け、先に導入した「DISQUS」コメントシステムの直後に「zenback」が表示されるようにしている。 もし、コメントより、先に「zenback」配置するなら、 <!– #nav-below –> の直後に貼りつけても良い。 以上で、コードは導入できたが、「zenback」を活かすためには、これだけでは不十分で、関連記事の精度を上げる「zenbackタグ」をテンプレートに追加する必要がある。 まず、「単一記事の投稿(single.php)」というテンプレートの <?php the_title(); ?> という部分を <!– zenback_title_begin –><?php the_title(); ?><!– zenback_title_end –> に変更する。 続いて <?php ttw_the_content_featured_single(); ?> という部分を <!– zenback_body_begin –> <?php ttw_the_content_featured_single(); ?> <!– zenback_body_end –> <!– zenback_date –> に変更する。 これで作業は完了だが、やや厄介だ。 プラグインの形で導入出来れば有難いところだ。 記事の投稿後、解析が完了し、実際に表示が開始されるまでに若干の時間を要するが、それも許容の範囲だ。 —————————————————————- ・補足1 テーマ「Weaver 1.7」でも、「単一記事の投稿(single.php)」の同様の場所にコードを貼り付ける。 「zenbackタグ」の追加は、 <!– zenback_title_begin –><?php weaver_post_title(true); ?><!– zenback_title_end –> と <!– zenback_body_begin –> <?php weaver_the_content_featured_single(); ?> <!– zenback_body_end –> <!– zenback_date –> と言った具合になる。 ・補足2 テーマ「Weaver 2.0」を例に説明するが、「<!– … 続きを読む →

Posted in WordPress, ネット・PC | Tagged , , , , , , | 7 Comments

高度なコメントサービス、「DISQUS」をWordPressに導入する

このブログでは、万年筆や革製品などの私にとって愛おしいモノたち、こだわりの製品、優れたツールなどについて語って行こうと思う。 新規にブログを立ち上げるにあたって、今回は「WordPress」を選択した。 以前は、「Movable Type」なども使ったことがあったが、今更「Movable Type」でもないし、使った事がないものを使ってみたかったという気持ちも、「WordPress」の選択を促した。 「WordPress」は、SQLサーバーが必須となり、多少の面倒もあるが、殆どのレンタルサーバーが、SQLサーバーを標準機能として備えているので問題ない。 「WordPress」と言えども、素の状態での利用は厳しい。色々とカスタマイズが必要になるが、ソーシャルメディアを意識したカスタマイズを行いたいと考えていた。 また、以前から、どうしても導入したかったサービスがあった。 それが「DISQUS」である。 「DISQUS」は、ブログのコメント機能にあたる部分のみを提供しており、「WordPress」にも導入できる。 自身が管理する複数のブログやHP上に投稿されたコメントを独立して一元管理できると言うサイト運営上のメリットもあるが、「DISQUS」の場合、コメントする側にとっても同様のメリットがある。 他のブログに投稿したコメントも、そのブログへアクセスすること無く、「DISQUS」上で一元管理できるのである。 「DISCUS」によって提供されるコメント欄では、「DISCUS」アカウントでログインしてコメントする以外に、Twitter、Facebook、OpenID、Yahoo!のアカウントでもログインが許されている。 勿論、ゲストとしてコメントを投稿を許すことも出来るが、登録ユーザーとして投稿した方が色々と面白い。 登録ユーザーのプロフィールでは、「フォロー」機能が提供されている他、自身のTwitterやFacebookのIDなども表示され、従来のブログのコメント欄とは比較にならない程、投稿者の顔が見えてくる。(当然、これを嫌う方も少なくないだろうが・・・。) TwitterやFacebookのアカウントを持っているなら、コメントを共有することも可能だ。その他のサービスとの連携も出来る。 「DISQUS」では、登録ユーザー同士で、ちょっとしたソーシャルネットワークが構築できる仕組みになっている。 ユーザー同士のコミュニケーションを意識してか、返信が分かりやすいスレッド型のコメント欄を採用しており、Ajaxを用いることで、コメント投稿時にページの再読込が発生せず、スムーズは投稿が可能となっている。 特徴やメリットをまとめてみた。 (投稿されたもの、投稿したものを含めて)複数のサイトのコメントが一元管理できる。 様々なサービスのアカウントでログイン出来る。 外部サービスとの連携。 投稿者同士でソーシャルネットワークの構築ができる。 ブログやサイトではなく、むしろコメントの投稿者に光を当てるシステムになっている。 ゲスト投稿を許可することで、従来の様な匿名性の高い投稿も可能。 これだけ面白そうな「DISQUS」を使わない手はない。 ただし、問題もある。「DISQUS」が提供するコメント欄自体は、日本語に対応しているが、その管理画面が日本語に対応していない。 英語の画面を見ながら、登録、設定、管理を行うことになる。 「DISQUS」のアカウントを作成したら、プロフィールの設定で、「DISQUS」と連携する外部サービスを設定しておくと便利だ。TwitterとFacebookでは、コメントを共有できる。 アバターも登録しておいた方が良いだろう。 プロフィールの設定は、主として投稿者としての設定になるが、自身のブログやサイトのコメント欄の設定も必要になる。 サイトの設定で重要な部分は、「General」というタブに集中している。 出だしに下記のような設定項目がある。 Twitter@Replies・・・コメントをツィートした場合のリプライ先となるTwitter ID。 Disable Like Buttons・・・Likeボタンを表示しない。 Media Attachments・・・画像、動画の添付を許可する。 Trackbacks・・・トラックバック機能を追加する。 Akismet・・・スパムフィルタ「Akimet」を有効にする。要API Key。 Reactions・・・記事への言及を外部サービスから探し、表示する。検索対象のサービスを指定する。 Display login buttons with comment box・・・外部サービスのIDでのログインを許可する。ログインを許可するサービスにチェックする。 Who Can Comment?・・・コメントを許可する条件。「Anyone」の場合、ゲスト投稿が許可される。   下の方を見てゆくと言語とタイムゾーンの設定がある。 更に下には、FacebookのAPI Keyの設定項目がある。 Facebookにログインした状態で、「Click here to get one」をクリックすると、Facebook上で、アプリが自動的に作成され、API Keyが入力される。 作成されたアプリは、下記で参照、修正、削除できる。 http://www.facebook.com/developers/ 以前は、Facebookでのログインを許可する場合の必須入力項目だったが、現在は、自分で作成したアプリを経由させない限りは必要ないのかもしれないが、テストしていないの詳細は分からない。 他にも設定項目はあるが、ここまで設定しておけば、通常は問題ない。 続いて「WordPress」への組み込みを行う必要があるが、「プラグイン」の形で提供されているので、難しくはない。 プラグインは、サイトの管理画面の「Install」からダウンロードできるが、「WordPress」の管理画面から「Disqus Comment System」で検索したほうが早いかもしれない。 プラグインを有効にしたら、後は指示に従って設定すれば良い。 ちなみに、一覧にないサービスや一般のサイトに「DISQUS」を組み込む場合は、「Universal Code」を使うが、コード中の「var disqus_shortname = ‘example’」の「example」をサイト登録時に設定した「short name」で置き換えてから使うこと。 実物が、この記事の直ぐ下に表示されているので、そちらを見て欲しい。

Posted in WordPress, ネット・PC | Tagged , , , , , | 64 Comments