Lightning Charm非推奨（廃止予定）機能

以下の機能については、現在は非推奨（廃止予定）機能となっているため、Lightning Charm使用時にはご注意ください。また、CharmIIでは既に廃止になっておりますので使用できません。

■ 使い方目次

Lightning Charm デザイン設定

Lightning Charm デザイン設定

「管理画面 > 外観 > カスタマイズ > Lightning Charm デザイン設定」から、以下の設定が可能です。

1. ディスクリプション表示

チェックを入れるとヘッダーのロゴ上部に、管理画面「設定 > 一般設定 > キャッチフレーズ」に登録されているディスクリプションテキストが表示されます。（PC表示のみ）

2. コンテンツ背景色

コンテンツ部分の背景色をカラーピッカーで選択&変更できます。

3. コンテンツ背景テクスチャ

コンテンツ部分の背景にあらかじめ用意しているテクスチャ画像からお好みのものを設定できます。

ご用意しているテクスチャは、木目 / ストライプ縦 / ストライプ横 / ダマスク / ダマスク（反転） / ドット / ドット（反転）です。木目以外のテクスチャはコンテンツ背景色と組み合わせてご使用いただけます。

: 木目

: ストライプ縦

: ストライプ横

: ダマスク

: ダマスク（反転）

: ドット

: ドット（反転）

4. コンテンツオリジナル背景画像

コンテンツ背景にオリジナルの背景画像をご使用いただくことが可能です。ご用意しているテクスチャでイメージに会わない場合はこちらからお好みの画像をアップロードしてご利用下さい。

画像を繰り返しリピートして表示したい場合は「オリジナル背景画像リピート」にチェックを入れて下さい。

5. オリジナル背景画像サイズ

オリジナル背景画像を「画面の横幅いっぱいに表示」または「画面縦のサイズに合わせて表示」に変更することができます。シームレスなパターン素材などを使わず大きい画像をオリジナル背景画像に設定された場合などに便利です。

商用サイトにかかせない Google Map / サムネイル付ギャラリーを簡単に表示

ショートコード機能をつかって、投稿記事・固定ページ内へ Google Map、サムネイル付きのギャラリーを簡単に表示できます。

Lightning と同時のご利用をオススメしている「VK All in One Expansion Unit」の「サムネイル付きの最新記事一覧 – VK Recent Posts」ウィジェットをトップページコンテンツエリアでご使用いただくと、サムネイルを大きく表示できギャラリーのようにみせることができます。

Google Map ショートコードはトップページのウィジェットエリアでも使用でき、トップページでお店の場所をわかりやすく伝えることが可能です。

Lightning Charm ショートコード設定

ギャラリーショートコード設定

「管理画面 > 外観 > カスタマイズ > Lightning Charm ショートコード設定」からギャラリーショートコードの設定をします。

「ギャラリーショートコードを有効化」にチェックを入れ機能を有効化します。
メイン画像の高さを px の単位で設定します。
デフォルトの値はPCレイアウト時に 370 px程度の高さです。デフォルト値より変更したい場合はそのサイズをpx値で入力して下さい。
サムネイルの位置をメイン画像の上下どちらに配置するか選択できます。デフォルトではメイン画像下に表示されます。
表示するサムネイルの枚数を3〜6枚の間で設定できます。スマートフォン時の表示枚数は3枚です。

以上でギャラリーショートコード設定は終了です。

ギャラリーショートコードを入力してギャラリーを作る

投稿または固定ページへ、「メディアを追加」から画像を挿入します。挿入する際に「配置 / リンク先」は「なし」にして下さい。（入力があっても無効になります）

ギャラリーとして表示したい画像を [charm-gallery][/charm-gallery] というショートコードではさみます。

これでショートコードではさみ込んだ画像がサムネイル付きのギャラリーとして表示されます。ギャラリーは1ページに複数設置可能です。

■ ギャラリーを表示しているサンプルページを見る

ギャラリーの設定を個別に行う

ギャラリーは複数設置可能です。各ギャラリーショートコードにオプション値を記入することで、ギャラリーごとにサムネイルの位置 / メイン画像の高さ / サムネイルの表示枚数を設定することができます。（管理画面での設定よりもショートコードに記入した設定が優先されます）

サムネイルの位置を個別に設定する

サムネイルの位置をメイン画像上か下のどちらかを設定するには、以下のようにショートコードを記入します。

サムネイルを上に表示する

thumb_pos=”before” というオプション値をショートコードへ記入し、画像をはさみ込みます。

[charm-gallery thumb_pos="before"][/charm-gallery]

サムネイルを下に表示する

thumb_pos=”after” というオプション値をショートコードへ記入し、画像をはさみ込みます。

[charm-gallery thumb_pos="after"][/charm-gallery]

メイン画像の高さを個別に設定する

メイン画像の高さを各ギャラリーごとに設定したい場合は、main_height=”設定したい高さ” というオプション値をショードコードに記入します。

画像の高さが 425 px でその高さを設定する場合以下のように記入し、画像をはさみ込みます。

[charm-gallery main_height="425"][/charm-gallery]

サムネイルの表示枚数を個別に設定する

表示するサムネイルの枚数を個別に変更する場合は、max_slide=”表示枚数” というオプション値をショートコードに記入します。3〜6までの数値が設定できます。

[charm-gallery max_slide="3"][/charm-gallery]

ギャラリーショートコード設定サンプルを見る

Google Mapショードコード設定

「管理画面 > 外観 > カスタマイズ > Lightning Charm ショートコード設定」からGoogle Mapショードコードの設定をします。

「Google Map ショードコードを有効化」にチェックを入れ機能を有効化します。
Google Map ショードコードをトップページのウィジェットエリアで使用したい場合はチェックを入れます。
Google Map APIキーを入力して下さい。Google Map APIキーの入力がないと Map の表示ができません。Google Map APIキーの取得方法はこちら「Google Map APIキーの取得方法」の項目をご覧ください。
「Map 緯度」「Map 経度」で表示したい地図の緯度・経度を入力して下さい。地図の経度緯度を調べるにはこちらのサイト「Geocoding – 住所から緯度経度を検索」が便利です。
「拡大比率」を10〜20の間で設定できます。一般的に 15 付近の比率で表示しているサイトが多いです。
サイトのデザインに合ったオリジナル画像のピンを「目的地ピン画像」から設定できます。設定がない場合は Google Map 標準のピンを表示します。
「目的地ピンのタイトル」に目的地名を入力していただくと、ピンをマウスオーバー時にそのテキストを表示します。
Google Map を表示する高さを PC 時 / スマートフォン時それぞれ入力して下さい。

以上で Google Map ショートコード設定は終了です。

Google Map を表示する

投稿または固定ページのマップを表示したい箇所へ、 [charm-gmap] とショートコードを入力して下さい。これで管理画面で設定した Google Map が表示されます。

■Google Map を表示しているサンプルページを見る

Google Map ショートコードをトップページウィジェットエリアで使用する

Charm の Google Map ショートコードは WordPress のデフォルトで登録されている「テキスト」ウィジェット内で使用できるようになっています。

「管理画面 > 外観 > カスタマイズ > Lightning Charm ショートコード設定」で「Google Map ショードコードをトップページウィジェットで有効化」にチェックを入れた後、

「外観 > ウィジェット」でトップページコンテンツエリア上部などへ「テキスト」ウィジェットをドラッグ＆ドロップし、[charm-gmap] とショートコードを入力して下さい。

これで Google Map がご希望の位置へ表示されます。

Google Map の設定を個別に行う

Google Map は複数設置可能です。各 Google Map ショートコードにオプション値を記入することで、Map ごとに Map 位置（経度緯度の設定） / 拡大比率 / 目的地ピン画像 / ピンのタイトルを設定することができます。（管理画面での設定よりもショートコードに記入した設定が優先されます）