WordPressの多言語プラグイン「qtranslate」で、あなたのサイトも世界にデビュー♪ @Co-Edo

WordPressの多言語プラグイン
「qTranslate」で、

あなたのサイトも
世界にデビュー♪

だいぶ変わったよ！

2013.2.5 @Co-Edo バージョン
うぇぶるじょん

軽く自己紹介など

うぇぶるじょんといいます


ブログ書いてます
(http://webourgeon.com/)



WordPress
HTMLコーディング / Webデザイン
Flashアニメーション
など



WordPress
など

WordBench千葉はじめました



WordPress
など

WordBench千葉はじめました

この顔見たら話しかけてね

Twitter @Webourgeon_com

本日のお話
WordPressの多言語化とは 5．ウィジェットタイトルを出し分けてみよう

多言語化方法いろいろ 6．カスタムフィールドを使ってみよう

1．翻訳ツールなどを利用して自動的に翻訳してもらう 7．パンくずを表示してみよう

2.それぞれの言語用にコンテンツを用意して
8．お問い合わせも多言語化してみよう
切り替えて表示できるようにする
9．タイトルやサイトの説明

qTranslateの使い方
管理画面の国際化
1．プラグインをインストールして有効化します

3．初期設定

4．qTranslateの独自タグ

そもそも....

WordPressの多言語化って
何ですか？

WordPressで作ったサイトを
日本語だけでなく、英語や中国語など、
各国語で表示できるようにする

世界中の人に
ブログを読んでもらえる！

これでうちの会社も
国際的に！

広告収入も増えたりして...

では、そんな

WordPressの多言語化について
いろいろ見ていきましょう

多言語化方法いろいろ


多言語化の方法は大きく分けて2つ



1．翻訳ツールなどを利用して自動的に翻訳してもらう


WordPressなら
どちらもプラグインや標準機能で
実現できるよ

多言語化方法いろいろ 1．翻訳ツールなどを利用して自動的に翻訳してもらう

自動翻訳のプラグインの例

Translate This Blog Translator
http://wordpress.org/extend/plugins/translate-this-blog-translator/

他にも探してみよう



基本の言語を選ぶ



勝手に翻訳してくれる！！


翻訳は機械任せなので.....

まあまあ？

残念な感じになる可能性もあります

多言語化方法いろいろ 2.それぞれの言語用にコンテンツを用意して切り替えて表示

いくつか方法を考えてみた！


①自分で書く

例えばブラウザの言語を取得して、
表示を変えるプログラムを書く


①自分で書く

http://stocker.jp/diary/wordpress_multilingual/


①自分で書く

http://stocker.jp/diary/wordpress_multilingual/

「メジャーな方法ではないので
あまりおすすめはしません」

とのコメントいただきました


①自分で書く

自分で書く

自分で書けば安心ですが、
かなり難易度が高い！


②マルチサイトを使う

WordPressの標準機能、マルチサイトを使い
各国語用の子サイトを作る



メリット

・マルチサイトはWordPress標準の機能であり、
比較的開発が楽。



メリット


・多言語にするためにプラグインを使わないので、
プラグインに依存しない。



メリット


・多言語にするためにプラグインを使わないので、
プラグインに依存しない。

・テンプレート・コンテンツ・URLなど自由に
コントロールできる。



デメリット

・コンテンツをひとサイトごとに入れていかないと

いけないので運用は少し面倒。


③多言語化用のプラグインを使う



無料の代表的なもの

qTranslate http://wordpress.org/extend/plugins/qtranslate/





無料なので導入は楽
ただし、無料なので、いつ開発が止まるかわからないし、やめられちゃっても文句はいえない






有料の代表的なもの

WPML http://wpml.org/ja/






有料の代表的なもの

WPML http://wpml.org/ja/

有料なので、初期費用はかかる
かなり高機能っぽい。
サポートもある。有料とはいえ、開発が止まることは考えられるが、少し安心。



プラグインを使うということは、

サイトの根本がそのプラグインに依存してしまう、
ということ。

運営の利便性や、将来性、色んなことを考えて
方法を選ぶべき！

それを踏まえて、

qTranslate での多言語化に
挑戦してみましょう！


1．プラグインをインストールして有効化します

qTranslateの使い方 1．プラグインをインストールして有効化します

ここからダウンロードするか

http://wordpress.org/extend/plugins/qtranslate/

プラグインのインストールで
qTranslate
を検索


できましたか？


こんなふうに管理画面が英語になってしまうけど、
焦らず初期設定をしていきましょう


3．初期設定
プラグインの初期設定をします。

qTranslateの使い方 3．初期設定

①デフォルトの言語と使用言語を設定

qTranslateの使い方 3．初期設定 ①デフォルトの言語と使用言語を設定

使用する言語を選ぶ
日本語はココ

いらないのは消す


表示順

デフォルト言語


設定した言語用のタイトル

タブで切り替える入力エリア


②URLを設定

qTranslateの使い方 3．初期設定 ②URLを設定


Use Query Mode (?lang=en)
デフォルトのパーマリンクと同じ形式


Use Pre-Path Mode (Default, puts /en/ in front of URL)
/en などというサブフォルダ形式


Use Pre-Domain Mode (uses http://en.yoursite.com)
サブドメイン形式（サブドメインの設定が必要）


Use Pre-Domain Mode (uses http://en.yoursite.com)
サブドメイン形式（サブドメインの設定が必要）

(́；ω；｀)


③言語切替ボタンを設置

qTranslateの使い方 3．初期設定 ③言語切替ボタンを設置

qTranslateの使い方 3．初期設定 ③言語切替ボタンを設置

サイドバー


出来ましたか？
ここまででサイトを見てみましょう

qTranslateの使い方 3．初期設定 ④コンテンツ表示方法

④コンテンツ表示方法


すべての記事を多言語化しない場合も
ありますよね？


言語別コンテンツがないものは表示し
ないようにすることができます


⑤日付が変な場合

qTranslateの使い方 3．初期設定 ⑤日付が変な場合


日付の設定はテーマや初期設定にも依存するので


個別設定もできる


⑤カテゴリーを多言語化


ここまで設定すれば、普通のブログなら、
ほとんどの部分が多言語化できてるはずです！


でも、せっかくだから、
もうちょっと色々出来たらいいなって思うよね？


4．qTranslateの独自タグ

テンプレートの中で使ったり、
カスタムフィールドなどを言語別に
出力させたりするための独自タグ

qTranslateの使い方 4．qTranslateの独自タグ

①カスタムフィールドやウィジェットタイトルなど
管理画面から入力するものを出し分ける

[:ja]日本語向けの内容 [:en]英語向けの内容

qTranslateの使い方 4．qTranslateの独自タグ

②テンプレート内で出し分ける

<?php _e("English Here!!こっちは日本語だよ∼"); ?>

<?php
qtrans_getLanguage();
?> 現在の言語を習得

<?php
if (qtrans_getLanguage() == 'en') { ?>
ここに英語で出力させたいコード
条件分岐でこんなふうに使える
<?php }else{ ?>
そうじゃなかったらこれが表示される
<?php } ?>


5．ウィジェットタイトルを出し分けてみよう


6．カスタムフィールドを使ってみよう

qTranslateの使い方 6．カスタムフィールドを使ってみよう

qTranslateの使い方 6．カスタムフィールドを使ってみよう

これがないと動かない
<?php echo __(get_post_meta( $post->ID , 'item-name' , true )); ?>

<?php echo e_(get_post_meta( $post->ID , 'item-name' , true )); ?>
＊最近まではこちらでしたが動かなくなっていました


7．パンくずを表示してみよう

qTranslateの使い方 7．パンくずを表示してみよう

WP SiteManager
WordPress をCMSとして利用する際に必要な機能を網羅した統合パッケージ

http://wordpress.org/extend/plugins/wp-sitemanager/

公式サポートサイト
http://www.wp-sitemanager.com/


WP SiteManager
特にパラメーターを入れなくても
多言語化に対応

WP SiteManager
<?php if ( class_exists( 'WP_SiteManager_bread_crumb' ) )
{ WP_SiteManager_bread_crumb::bread_crumb
( 'type=string&home_label=HOME トップページ' ); } ?>

出し分けもバッチリ

qTranslateの使い方 8．お問い合わせも多言語化してみよう Contact Form 7

8．お問い合わせも多言語化してみよう

① Contact Form 7
http://wordpress.org/extend/plugins/contact-form-7/

② Trust Form
http://wordpress.org/extend/plugins/trust-form/


① Contact Form 7


日本語用フォーム


英語用フォーム


エラーも自動で多言語化！


ただしこのままでは動かない


ただしこのままでは動かない

動きました！
素晴らしい！＼(^o^)／

WordPress 3.5.1+ｑTranslate 2.5.34
+
Contact Form 7 3.3.3


functions.php
//**********************************************************************************
// Contact Form 7 を動かす
//**********************************************************************************
add_ﬁlter('wpcf7_form_action_url', 'wpcf7_action_url');

function wpcf7_action_url(){

if(function_exists('qtrans_convertURL')){

return qtrans_convertURL($_SERVER["REQUEST_URI"]);

}

return $_SERVER["REQUEST_URI"];

}

qTranslateの使い方 8．お問い合わせも多言語化してみよう Trust form

② Trust Form


こちらも英語用、日本語用2つのフォームを作成


そのまま使うと日本語用でも
英語のエラー表示に


qtranslateと干渉して、Trust Formのエラーメッセージが英語になってしまう
原因を調べてみた
http://www.warna.info/archives/2261/


//**********************************************************************************
qtranslateと干渉して、Trust Formの
// Trust Form エラーメッセージ読み込み
//********************************************************************************** エラーメッセージが英語になってしまう
function trust_form_validator_message_override() { 原因を調べてみた
global $Trust_Form_Validator_Message; http://www.warna.info/archives/2261/

if ( is_admin() ¦¦ ! class_exists( 'Trust_Form' ) ) { return; }
new Trust_Form();
$Trust_Form_Validator_Message = array(
'required' => __("Please ﬁll required ﬁeld", TRUST_FORM_DOMAIN),
'hiragana' => __("Please enter by using Japanese hiragana", TRUST_FORM_DOMAIN),
'minlength' => __("Please enter more than __minlength__ charactors", TRUST_FORM_DOMAIN),
'maxlength' => __("Please enter within __maxlength__ charactors", TRUST_FORM_DOMAIN),
'bothlength' => __("Please enter more than __minlength__ within __maxlength__ charactors", TRUST_FORM_DOMAIN),
'zenkaku' => __("Please enter by using multibyte charactor", TRUST_FORM_DOMAIN),
'eiji' => __("Please enter by using English", TRUST_FORM_DOMAIN),
'number' => __("Please enter by using number", TRUST_FORM_DOMAIN),
'katakana' => __("Please enter by using Japanese katakana", TRUST_FORM_DOMAIN),
'hankaku' => __("Please enter by using English or number", TRUST_FORM_DOMAIN),
'hankaku2' => __("Please enter by using English or number or code", TRUST_FORM_DOMAIN),
'e-mail' => __("The format of the e-mail address is invalid", TRUST_FORM_DOMAIN),
);
}
add_action( 'after_setup_theme', 'trust_form_validator_message_override', 1000 );


エラーもバッチリ日本語化
素晴らしい！！



管理画面は....

テーマとかで対応したほうが綺麗にできそう..


あとは応用で！

管理画面の国際化

おまけ

Functions for Developers and Template Authors

http://www.qianqin.de/qtranslate/forum/
viewtopic.php?f=3&t=9

翻訳がんばって！！

http://multilingual-test.webourgeon.net

WordPressの多言語プラグイン「qtranslate」で、あなたのサイトも世界にデビュー♪ @Co-Edo

Recommended

Recommended

More Related Content

What's hot

What's hot (19)

Similar to WordPressの多言語プラグイン「qtranslate」で、あなたのサイトも世界にデビュー♪ @Co-Edo

Similar to WordPressの多言語プラグイン「qtranslate」で、あなたのサイトも世界にデビュー♪ @Co-Edo (20)

More from Chieko Aihara

More from Chieko Aihara (9)

WordPressの多言語プラグイン「qtranslate」で、あなたのサイトも世界にデビュー♪ @Co-Edo