それは誰にでも起こります。

あなたが好きなテーマを見つけ、あなたはそれをインストールし、あなたのサイトの外観を楽しんで数ヶ月を過ごします。 しかし、その後、数ヶ月後、テーマは古く感じ始めます。 ちょっと退屈だ唯一の問題は、何か新しいものを探して数時間を費やしたくないことです。

あなたのテーマに少しスパイスを追加する方法があった場合にのみ、それを際立たせるために少しフレア。

あなたが絶望に手を投げる前に、私はあなたにあまりにも多くの努力なしで、あなたのサイトを遅くする可能性が不要な画像を追加せずに、あなP>

ダッシュコンを入力します。 DashiconsはWordPress3.8で導入されたフォントアイコンです。 彼らはあなたのダッシュボードにログインしたときに表示されるもの素晴らしいとクールなアイコンです。 あなたにもあなたのテーマにそれらを追加することができれば、それはクールではないだろうか?さて、あなたはできると私はあなたにどのようにお見せするつもりです。

ナビゲーションメニューでDashiconsを使用するにはどうすればよいですか?

簡単な例から始めましょう。 Dashiconsはすでにバージョン3.8以降のWordPressに含まれていますが、サイトのフロントエンドに適切に表示させるためには、それらを含める必要があります。

ステップ1:あなたのテーマDashiconsを準備する

あなたのテーマdashiconsを準備するには、まずあなたの関数を開きます。phpファイル(外観にあります>エディタ–デフォルトでは、現在のテーマのCSSファイルを開きます。 先に行くと、機能を探します。phpファイルをクリックしてエディタにロードします。)

ステップ2:スクリプトをキューに入れる

下までスクロールし、最後に次のコード行を貼り付けます。

すべての権利! 今、あなたのテーマはDashiconsを使用する準備ができています。ステップ3:メニュー項目にDashiconを追加する

ホームリンクにDashiconを追加しましょう。 Dashiconsのウェブサイトに頭の上に、あなたが好きなアイコンを選択します。

更新:Dashiconsはもともと利用可能でしたGitHub.ioしかし、彼らは以来、上で利用可能にされていますWordPress.org.

ステップ4:

目的のアイコン(この場合はホームアイコンを選択しました)をクリックし、HTMLのコピーをクリックします。 必要なコードを含むポップアップウィンドウが表示されます。

ステップ5:

WordPressのダッシュボードに戻り、外観をクリッナビゲーションラベル。div>

それでも単語を表示したい場合は、閉じdivブラケットの後に入力します。p>

保存をクリックしてホームページをロードします。 あなたの家のリンクは今素晴らしく、ぱりっとしたDashiconを表示するべきである。

これは、すべてのナビゲーションメニュー項目に対して、またはホーム用に行うことができます。 ちょうど一致するアイコンで上記の手順を繰り返します。 それは簡単だったでしょうか?投稿メタでDashiconsを使用するにはどうすればよいですか?さらに一歩進んで投稿メタにDashiconsを追加したり、著者の名前、日付、カテゴリ、タグの前にDashiconsを追加したりすることができます。あなたはすでにあなたのテーマにDashiconsをenqueuedので、あなたが今しなければならないのはあなたのスタイルを開くことだけです。

cssファイル(またはあなたのテーマの更新後に変更を失うことはありませんので、常により良いオプションであるカスタムCSSエディタを使用!)、一致するセレクタを見つけて、CSSコードを追加します。あなたの名前または著者の名前の前にアイコンを追加したいとしましょう。

あなたの名前の前にアイコンを追加したいとしましょう。

あなたステップ1

ステップ2

ステップ3:

まず、アイコンを選択します。ステップ2:

それをクリックし、今回はCssのコピーを選択します。 繰り返しますが、貼り付ける必要があるコードを含むポップアップウィンドウが表示されます。

ステップ3:

今、あなたのスタイルを開きます。cssと、この場合には、対応するセレクタを見つける–。エントリー-著者。 DashiconsのウェブサイトからコピーしたCSSコードを貼り付ける前に:を追加すると、著者の名前の前に素敵なアイコンが表示されます。 また、Dashiconsフォントを使用していることを指定する必要があります。 変更されたコードは次のようになります。

.entry-author:before {font-family: "dashicons";content: "\f110";}

スタイリングのビットを追加してみましょう。

最終結果

これは最終的にどのようこのような何か:

Dashiconsを使用することができますので、多くの方法があります–あなたの創造性を保持し、あ

それをすべて一緒に置く

上記の例とは別に、バックエンドでDashiconsを使用して、異なる投稿タイプに異なるアイコンを指定したり、投稿タイこれの良い例は、古いWP Superstarsのホームページです。

ここでは、ウェブサイトのさまざまな領域で使用されているDashiconsを見ることができます:

ダッシュコンは、追加できるアイコンフォントの唯一のタイプではありません。 詳細については、私たちのFontAwesomeアイコンチュートリアルをdiv>

div>

電子メールの更新が含まれています。 いつでも退会できます。

コメントを残す

メールアドレスが公開されることはありません。