craft3 iconpickerダウンロードcraft3 iconpickerソースコードのダウンロード

craft3 iconpicker

フォントのダウンロード

ve icon

ダウンロード

クラフトCMS 3.xのIconPickerプラグイン

現在、プロジェクトは中止されています。ただし、お気軽にフォークして、開発を続けてください！

.woffまたは.ttfフォントファイルからアイコンを選択する簡単な方法をユーザーに提供する新しいフィールドタイプを提供するクラフトプラグイン。イオニコンまたはフォントの素晴らしいアイコンを簡単に使用できます

注：このプラグインは、クラフトプラグインストアが利用可能になったときに有料アドオンになる場合があります。

要件

クラフト3.0（ベータ20）+
PHP 7.0+
Phenx Php Font lib
1つ以上の.ttfまたは.woffファイル

例

CMSユーザーのテンプレート内のフィールド使用の例

スクリーンショット

選択ポップアップの例

スクリーンショット

インストール

作曲家と一緒にインストールします
```
 composer require dolphiq/iconpicker
```
設定>プラグインの下にクラフトコントロールパネルにプラグインをインストールする
テンプレートの開始時に次の行を追加して、アプリケーションにプラグインアセットを追加します。
```
 {% do view.registerAssetBundle("plugins\dolphiq\iconpicker\assets\sharedAsset") %}
```
必要なフォントを次のディレクトリに追加します
```
 /vendor/dolphiq/iconpicker/src/resources-shared/fonts
```
新しいフィールドを追加すると、 Iconpicker Fieldタイプが利用可能になります - 設定>フィールド>新しいフィールドの追加

ICONPickerフィールドタイプのフィールドを作成します

Iconpicker Fieldタイプを選択します
Iconpicker Fieldタイプの新しいフィールドを追加するとき、ドロップダウンからそのフィールドに使用するフォントを選択できます

IconPickerフィールドタイプを使用します

フィールドをフィールドレイアウトに追加します（たとえば、セクションに）
セクションを作成または更新するときに、アイコンを選択できるようになりました

小枝テンプレートの使用サンプル

クイックサンプルコード

    {% do view.registerAssetBundle("plugins\dolphiq\iconpicker\assets\sharedAsset") %}
    <html style="padding: 0; margin: 0;">
    <head>
        <title></title>

        {{ head() }}

    </head>

    <body>

    {{ beginBody() }}

    {% if entry.iconPickerField.icon %}
        Hex: {{ entry.iconPickerField.icon }}<br>
        {{ entry.iconPickerField.iconSpan|raw }}
    {% endif %}

    {{ endBody() }}

    </body>
    </html>

カスタムクラスでアイコンを表示します。

 <span class='{{ entry.iconClass }} myCustomClass'>{{ entry.iconChar }}</span>

アイコンフィールドのプロパティ

アイコンUnicode（小数）を取得します
```
 {{ entry.fieldName.icon }}
```
アイコンUnicode（16進数）を取得します
```
 {{ entry.fieldName.iconHex }}
```
アイコンをHTML文字&#00000として表示します
```
 {{ entry.fieldName.iconChar|raw }}
```
アイコンをHTML文字Hex &#xf100として表示します
```
 {{ entry.fieldName.iconCharHex|raw }}
```
キャラクターとフォントクラスのスパンとしてアイコンを表示する
```
 {{ entry.fieldName.iconSpan|raw }}
```
アイコンフォントクラスを取得します
```
 {{ entry.fieldName.iconClass }}
```
アイコンが設定されている場合にのみアイコンを表示する条件付き例
```
 {% if entry.fieldName.icon %}
     {{ entry.fieldName.iconSpan|raw }}
{% endif %}
```