it-swarm.dev

メニュータイトルフィールドにHTMLを追加

これは私のニーズです。メニュータイトルにhtmlタグを追加します。フロントエンドの各メニュータイトルの前にいくつかのアイコンを追加したいと思います。

私はこの結果が欲しい:

<li class="active">
 <a href="index.html">
  <i class="fa fa-dashboard"></i>
  Dashboard
 </a>
</li>

メニュータイトルフィールドに<i class="fa fa-dashboard"></i>を追加しようとすると、Joomlaのフィルターによって削除されます。

それを保存してメニューモジュールに表示する方法はありますか?

ありがとう。

6
lucasm107

@Valentinが指摘したように、メニューのオーバーライドはこれを解決する正しい方法です。ただし、JoomlaのオーバーライドとPHPに精通していない場合は、簡単な代替手段として RokCandy (または他の snippet extension )を使用します。基本的に、これらのプラグインはHTML以外のコードをHTMLコードに置き換えるため、Joomlaフィルターを回避できます。

RokCandyを使用して実行しようとしていることを実現するには、新しいマクロを作成します。

マクロ

[fa]{icon}[/fa]

[〜#〜] html [〜#〜]

<i class="{icon}"></i>

マクロを保存して閉じます。メニュー項目で、タイトルを次のように設定します。

[fa]fa fa-dashboard[/fa] Dashboard

最後に、AliasおよびBrowser Page Titleフィールドを設定する必要があります(Page Display)を「ダッシュボード」(または必要なもの)に変更するか、ブラウザのタイトルを[fa]fa fa-dashboard[/fa] Dashboard

enter image description here

3
johanpw

テンプレートでサポートされている場合は、メニュー項目ごとに数値クラスIDが必要です。それがある場合、またはテンプレート/メニューに追加できる場合は、CSSを使用してそれらのメニュー項目をそのようにスタイルする方がおそらく安全です。

したがって、メニュー項目がクラス155である場合、li行には次のように表示されます。

<li class="active item155">

それで、もう一度、あなたの構造に従って、あなたはあなたのCSSでこのようなことをするでしょう:

li.item155 a i:before {font-family:FontAwesome;content: "\f0ce";}

ここで、\ f0ceは、必要なアイコンのフォントの素晴らしいコードです。

これらのメニューIDがない場合は、li:nth-​​child(x)を使用してそれを変更できます。ここで、xは最初から最後までのメニュー項目です。メニュー項目3のスタイルを設定するには、次のようにします。

li:nth-child(3) a i:before {font-family:FontAwesome;content: "\f0ce";}

それを使用する場合、ブラウザでどれくらい前に動作するかはわかりませんが、オーバーライドする必要がないことを意味します。

6
Brian Peat

いいえ、HTMLをメニュー項目に追加する必要はありません。 Joomlaがあなたのために何かを削除するときは時々(それがはるかに簡単だったとしても)あなたがそのようにそれをするべきではないためです。

必要なのは、mod_menuのテンプレートのオーバーライドです。

ドキュメントのテンプレートオーバーライドの詳細については、次をご覧ください。 Joomla!コアからの出力をオーバーライドする方法

4
Valentin Despa

これを実現する正しい方法は実際には最も簡単で、プラグインやオーバーライドは必要ありません。メニュー項目オプションのリンクにアイコンクラスを追加するだけです。

enter image description here

2
Seth Warburton