KadenceブロックでカスタムSVGアイコンを使う方法：詳細ガイド

ケイデンス・ブロック・プロユーザーがウェブサイトをカスタマイズするためのさまざまな方法を提供する。エスブイジーアイコンから美学そしてパフォーマンスそれなのに技術の拡張性SVG アイコンは重要な役割を果たします。この記事では、Kadence Blocks を使ってカスタム SVG アイコンを追加する方法について、いくつかの一般的な方法を取り上げながら説明します。

SVGとセキュリティ／サポート

エスブイジー(Scalable Vector Graphics）は、広く使用されているアイコンフォーマットで、次のようなことが可能です。歪みのないリサイズ.デザイン面では素晴らしいものがあるがワードプレスに基づくSVGフォーマットでSVGを使用する場合は、セキュリティに気を配る必要があります。 XML そのため、悪意のあるコードが隠されている可能性があります。SVGアイコンを使用する際は、以下の点にご注意ください：

安全リスクSVG形式は悪意のあるスクリプトを埋め込む可能性があるため、使用には注意が必要です。
すじサードパーティのアイコンを使用する場合は、信頼できるソースを選ぶようにしてください。
アイコンサイズKadence Blocksの標準サイズである24x24pxのSVGを推奨します。
スキャニング: SVGアイコンをアップロードする前に、潜在的なセキュリティ問題がないことを確認するためにスキャンすることをお勧めします。

アイコンの色をコントロールしたい場合は、ストロークアイコンでは色を直接調整できないため、フィルアイコンを使用することをお勧めします。

内蔵アイコンマネージャーを使用してカスタムアイコンを追加

ケイデンス・ブロックユーザーがカスタマイズしたアイコンを直接アップロードして使用できる、簡単なアイコンマネージャーを提供します。エスブイジーアイコン以下に正確な手順を示します：

アイコン選択ドロップダウンメニューを開く
アイコンの設定で、アイコンの選択ドロップダウンメニューをクリックして、アイコンの管理インターフェイスに入ります。

カスタムSVGをアップロードする
My Icons」タブでプラスアイコンをクリックし、「Upload Custom SVG File」を選択します。

セキュリティのヒント
アップロードの際、システムは以下をチェックするようリマインドします。エスブイジーファイルはクリーンアップされ、サイズ要件（24x24px）に適合しているか。

SVGコードを貼り付ける
手元にSVGコードがある場合は、" をクリックしてください。SVGコードを貼り付ける"のテキストボックスに、コードを直接貼り付けてください。

アップロード完了
アップロードが完了すると、アイコンが "私のアイコン"タブでアイコンを選択して使用することができます。

削除アイコン
アイコンが不要になった場合は、そのアイコンにカーソルを合わせ、赤い X 削除する。

SVGストロークを塗りつぶしに変換する

ケイデンス・ブロックアイコンを色で塗りつぶすことで、アイコンの色をコントロールできます。もしエスブイジー塗りつぶしではなくストロークを使用しているアイコンは、カラー設定が有効になりません。したがって、ストロークアイコンを塗りつぶしアイコンに変換することをお勧めします。

変換方法
SVGストロークアイコンは、オンラインツールを使って塗りつぶしアイコンに変換することができます。変換後、アイコンの外観は変わりませんが、プロパティが変更され、Kadenceで色を制御できるようになります。

ストロークアイコンこれらのアイコンは通常アウトラインで定義され、Kadenceのカラー設定で変更する前に塗りつぶしアイコンに変換する必要があります。

塗りつぶしアイコン変換せずに直接カラーコントロールできるソリッドグラフィックです。

Kadenceアイコン検索機能を使う

ケイデンスアイコンの検索機能は、ユーザーが他の利用可能なカスタムアイコンを検索し、インポートするために提供されています。この機能を使用する手順は以下の通りです：

アイコン選択ドロップダウンメニューを開く
再度、アイコン設定のアイコン選択ドロップダウンメニューをクリックし、アイコン管理画面にアクセスします。

検索アイコン
ポップアップ・ウィンドウで、"探す"タブでアイコン名を入力すると、該当するアイコンが表示されます。

アイコンの選択と追加
希望のアイコンを見つけたら、右下の「追加」ボタンをクリックしてカスタムアイコンのリストに追加します。

アイコンをもっと読み込む
正しいアイコンが見つからない場合は、"もっと読む"ボタンをクリックすると、アイコンのオプションが表示されます。

アイコムーンフォントでカスタムアイコンを追加する

アイコスムーン を配置することができる無料のツールである。エスブイジーアイコンはフォントファイルに変換されます。以下は、フォントファイルに変換できるフォントのリストです。 アイコスムーン フォントメソッドにカスタムアイコンを追加する手順：

アイコンを選択
ある アイコスムーン ウェブサイトで、使用したいSVGアイコンをアップロードするか選択する。
フォントの生成
アイコンを選択したら、"Generate Font "ボタンをクリックします。

フォントファイルのダウンロード
生成されたフォントファイルをダウンロードする。

フォントファイルのアップロード
ダウンロードしたファイルを解凍して .json ファイルを開きケイデンスコントロールパネルからKadence Blocks > Custom Iconsに移動し、アップロードします。 .json ドキュメンテーション

アイコンの選択と使用
アップロードが完了すると、アイコンがインポートされます。ケイデンス他のKadenceのアイコンと同じように使うことができる。

概要

ケイデンス・ブロックユーザーがウェブサイトを簡単にカスタマイズできるように、さまざまな方法が用意されている。エスブイジーアイコン。内蔵のアイコンマネージャー、アイコン検索機能、または アイコスムーン SVGアイコンをフォントに変換、あなたのニーズに応じて適切な方法を選択することができます。これらの方法を使用すると、簡単にあなたのウェブサイトにパーソナライズされたアイコンを追加して、ページデザインの美しさと機能性を高めることができます。

お問い合わせ
チュートリアルが読めない？無料でお答えします！個人サイト、中小企業サイトのための無料ヘルプ！	カスタマーサービス WeChat
① 電話：020-2206-9892
② QQ咨询：1025174874
三 Eメール：info@361sale.com
④ 勤務時間: 月～金、9:30～18:30、祝日休み