it-swarm.dev

コンポーネントの管理ページのヘッダーに画像/アイコンを追加するにはどうすればよいですか?

私は自分のコンポーネントを構築しています。コアコンポーネントと同様に、コンポーネント(バックエンド)の管理ページのタイトルの左側にアイコン/画像を追加したいと思います。

enter image description here

これを行う方法?

5
FFrewin

view.html.php。内にビューのツールバーを作成しながら、ビューのヘッダータイトルのクラスを定義できます。

"addToolbar()"関数内でJToolbarHelper :: title()メソッドを呼び出し、2番目のパラメーター(文字列)を指定してCSSクラスを接頭辞が「icon-」のツールバータイトル。

例:

JToolbarHelper::title(JText::_('COM_MYCOMPONETE_LIST_ITEMS'), 'myclass');

これは次のhtmlになります:

<h1 class="page-title">
    <span class="icon-myclass"></span>
    My Componete: List Items
</h1>

実際にはスペースで区切って複数の単語を入力でき、これらは追加のクラスとして追加されます。

次に、コンポーネントのcssファイルにクラスのルールを含め、背景画像を指定できます。あなたのCSSと画像ファイルの場所はメディアフォルダにあるはずです。

例えば:

media/mycomponent/images/

media/commycomponent/css/admin.styles.css

ただし、Joomla 3では、CSSの疑似要素:: beforeをCSSの "content"属性で使用するのではなく、画像を使用しないのが一般的であり、すでに読み込まれているFontawesomeのicomoonフォントを利用します。管理用テンプレート(ここで見つけることができます: "media/jui/fonts /")。

以下のCSSの例では、ビューのタイトルの左側に "Home"アイコンを追加します。

.icon-myclass::before {
    content: "\0021"; 
}
  • 「\ 0021」は感嘆符(!)のUnicodeです* /
6
FFrewin