目次
リンクグループとは
グループブロックをリンク化する機能を追加します。
Emanon Premium ではパネルブロックで対応できたりするのですが、SWELLでは実装されていない「グループブロックのリンクカード化」。
使用方法ページのように、下層ページ冒頭にメニューアイコンを並べたいときなどにご使用ください。
実装方法
コードスニペットを導入する
こちらのボタンをクリックしてスニペットをダウンロードします。
会員限定コンテンツ
ここは会員限定コンテンツです。
＼お申込みはこちら／
コードスニペットをオンにします。
アドオン機能導入方法
STEP
プラグイン「Code Snippets」を検索します。
管理画面「プラグイン」から、「プラグインを追加」を選択。
「プラグインの検索」欄に、Code Snippetsと入力。
STEP
プラグイン「Code Snippets」をインストール・有効化します。
このプラグインを「今すぐインストール」・「有効化」します。
STEP
コードスニペットをダウンロードします。
該当ページから、コードスニペットをダウンロードします。
コピペではなく、ダウンロード形式で使用するものは上画像のような黄色いボタンで統一しています。
Code Snippets （コードスニペット）とは？
インポート/エクスポートが容易な、コード管理プラットフォームです。
「ひとつの機能としてパッケージングされたコード群」を、利用者はコードを触ることなくスイッチ（トグル）のオンオフで導入できる神ツールです。
STEP
コードスニペットをインポートします。
管理画面「スニペット」「インポート」から、先ほどダウンロードしたコードスニペットをインストールします。
重複インストールを防ぐために下段にチェックを入れ、
Choose Filesエリアに先ほどダウンロードしたファイルをドラッグ&ドロップします。
インストールするファイルにチェックを入れ、「Import Selected」を押します。
STEP
コードスニペットをオンにします。
管理画面「スニペット」「すべてのスニペット」から、先ほどインポートしたスニペットの左端にあるスイッチ（トグル）をオンにします。
目当ての機能が有効化されているか確認します。
ブロックスタイルの使い方
- 編集画面を開き、通常通りグループブロックを設置し、リンク化したい内容を制作します。
- グループブロック内に、テキストリンクを一つ 設置します。
- リンクカード化したいグループブロックを選択し、右側設定パネルから「スタイル」 > 「全体リンク化：Revify」を選択する。
- これで完了です。CSSもJavaScriptも要りません。
リンクパネルとして使用するもよし、ブロックエディタで作れるバナーとして活用するもよしです！
注意点
- ブロックスタイルのCSSは、編集画面にも適用されます。
- グループ前面に疑似要素を表示するので、全体リンク化設定後にグループの内容を編集したい場合は、一時的に「デフォルト」に戻してください。
- グループブロック内にあるリンクのクリックエリアをグループいっぱいに広げます。
- 「リンクテキスト」が無い場合は、ただホバーするだけです。
- リンクの仕様（”別タブで開く”等）は、テキストリンクの設定に従います。
