スクリーンショット 2026-08-09 22.51.29.png

概要

サイトに表示される言語切り替えボタン(ウィジェット)の見た目を設定する画面です。


使い方

見た目を設定する

項目 内容
ウィジェットタイプ デフォルト(標準)か、独自ウィジェットかを選びます
デザイン 「デフォルト」「アイコン」から選べます
配色 背景色・文字色を指定します
フォント 文字の書体を選びます
フォントサイズ / ウィジェットサイズ フォントサイズは小・中・大から選びます。ウィジェットサイズも小・中・大から選びます。ボタンの余白や高さが変わり、文字の大きさは変わりません
位置 左上・右上・左下・右下から基準を選び、端からの距離を「端詰め」「浮かす」「かなり浮かす」から指定します

色の指定方法

背景色・文字色は、色見本をクリックするとカラーピッカーが開きます。マウスで選ぶほか、#FFFFFF のようなカラーコードを直接入力することもできます。サイトのブランドカラーに合わせる場合は、カラーコードでの指定が確実です。

背景色と文字色のコントラストが低いと文字が読みにくくなります。プレビューで見え方をご確認ください。

右側のプレビューにはスマートフォンとデスクトップの表示が並んで表示されます。ボタンをクリックすると言語一覧が開き、実際のサイトと同じ見た目で確認できます。Autolingualのロゴの表示有無もご契約プランに合わせて表示されます。

位置をスマートフォンとパソコンで個別に設定する

「位置」の項目は、スマートフォンとデスクトップで個別に設定できます。 「位置」の項目にある「スマートフォン」「デスクトップ」のタブで切り替えてから、それぞれの四隅と端からの距離を指定してください(初期表示はスマートフォンです)。

スマートフォンタブにある「切替のしきい値」で、どの画面幅までをスマートフォンとして扱うかを指定できます(初期値は768px)。サイト側のブレークポイントに合わせて調整してください。プレビューの見出しに「〜768px」「769px〜」のように、それぞれの設定が適用される画面幅が表示されます。

パソコンでは右下でも、スマートフォンでは他の要素と重なってしまう場合などに、別々の位置を指定できます。

フォントについて

「ゴシック体」「明朝体」を選択した場合、サイト訪問者のシステムにインストールされているフォントのうち、設定に近いものが利用されます。 訪問者の環境によって多少見え方が変わります。