WordPressテーマSTINGER3をWPML(3.1.5)対応にする

この投稿は次の言語でも読めます: 英語 簡体中国語 ロシア語 スペイン語 ポルトガル語 フランス語 アラビア語 ドイツ語

< WPMLとは >
このサイトでも使用していますが、WordPressを多言語対応にする有料プラグインです。
WPMLオフィシャルサイト

< STINGER3とは >
プラグイン無しでも機能豊富なWordPress用テーマです。Google Adsenseの埋め込みなどが最初から考慮されていて、ソーシャルボタンなども標準装備なスマホ対応テーマです。かねてより使ってみたいと思っていました。
STINGER3公式サイト

< 対応させるコード >
以下がSTINGER3をWPMLに対応させるためのコードです。

<style type="text/css">

.submenu-languages{
  background-color:#f3f3f3;
  border-style:solid;
  border-color:#dedede;
  border-width:0px 1px 1px 1px;
  position:absolute;
  margin-left:-11px;
  margin-top:21px;
  padding-bottom:5px;
  display:none;
}
.submenu-languages > li{
  white-space:nowrap !important;
  float:none !important;
  display:inline-block !important;
}

.iclflag{ vertical-align:middle;position:relative !important;top:-1px !important; }
#lang_sel{ z-index:1000; }
#lang_sel a{ display:block; }
#lang_sel ul,#lang_sel li,#lang_sel a{
  margin:0px;padding:0px;
  width:300px;
  text-align:left;
  white-space:nowrap;
}
#lang_sel ul,#lang_sel li{ margin:0px !important;padding:0px !important; }
#lang_sel a{ margin:0px !important;padding:0px 7px !important; }
#lang_sel li,#lang_sel a,#lang_sel span{
  height:30px !important;
  line-height:30px !important;
  font-size:14px;
}
#lang_sel > ul > li > ul{ top:31px; }

</style>
<script type="text/javascript">
jQuery(function($){
var langMenuObj=$('.submenu-languages').eq(0);
var wpmlMobile=(typeof(window.orientation)!='undefined');
$('.menu-item-language-current').eq(0).on('mouseenter',function(){
if(!wpmlMobile){langMenuObj.stop(true,true).fadeIn('fast');}
}).on('mouseleave',function(){
if(!wpmlMobile){langMenuObj.stop(true,true).fadeOut('slow');}
}).on('click',function(){
langMenuObj.stop(true,true).toggle();
});
$('.icl_lang_sel_current ').parent().click(function(){ return false; });
});
</script>

< コード挿入方法 >
以下、3パターンご紹介します。いずれかの方法で反映してみてください。

< 方法 – 1 >
WordPress管理メニューの [ 外観 – ウィジェット ] で 「テキスト」を任意の(ただし有効な)エリアに追加します。タイトルは入力せず、内容のところにコードを記述すれば有効になります。

< 方法 – 2 >
手前味噌ですが私が作成したプラグイン STINGER3 loves WPML を使用します。このプラグインも実際にやっていることは同じでstyleタグとscriptタグの挿入です。このプラグインについてのバグ報告などはGithubまたはTwitterまたはGoogle+へお願いします。

< 方法 – 3 >
WordPressプラグイン Wp Insert を使用します。こちらはあらゆる場所に任意のHTMLコードを挿入可能なプラグインですので、Google Adsenseなどのために既に導入済みの方や、任意の場所に他のコードも挿入したい方などにはオススメです。

< あとがき >
どの方法にしても特に難しいことは無いかと思います。ただ、STINGER3自体は今のところ言語ファイルに未対応なため、moファイルなどでの多言語化はできず、WPMLのストリング翻訳でやるしかない現状です。このへんのカスタマイズも今後考えていこうかと思います。

< 2014/06/11 アップデート >
Android/iOSのブラウザで初回タップイベントが正常にハンドリングできていないバグを修正。当ページ内のコピペ用ソースおよびGithub上のプログラム修正。