[WordPress] qTranslateの言語切替スイッチを少しカスタマイズ

作成日:

qTranslateの言語切り替えスイッチ(qTranslate Language Chooser)ウィジェットをそのまま使うと
qtranslate_img01
な風にただのリスト表示になるので、これを

  • 水平に並べて右端に
  • リストスタイルの「・」は消す
  • 言語の間に「/」を挿入する

ために、[css].qtrans_language_chooser {
margin: 0;
float: right;
list-style: none;
}
.qtrans_language_chooser li {
display: inline-block;
padding: 10px 5px 10px 0;
}
.qtrans_language_chooser li:first-child:after {
content: " / ";
}
.qtrans_language_chooser li.active span{
font-weight: bold;
}[/css]としてやりました。擬似クラスって、複数設定出来るんだな。あと、「content」スタイルは、普段余り使うことは無い(吹き出しを作るときくらいか)けど、使い所はまだありそう。
qtranslate_img02

物草 灸太郎
物草 灸太郎

WordPressでホームページを制作しつつ、休日は畑を耕したりDIYを楽しんでいます。

Loading...

コメントをどうぞ

  • メールアドレスが公開されることはありません。
  • コメント欄にURLは入力できません。
  • このサイトはreCAPTCHAによって保護されており、Googleのプライバシーポリシー利用規約が適用されます。