Page History

This use case provides an example how to add custom hover menu into top bar. List of reports will be displayed after hovering on the newly displayed menu button.

Image Modified

This extension can be downloaded from here.

Editing menu items

This example contains 3 menu buttons, each button contains 3 list items. Labels (buttons and list items) and links can be managed via Parameters - click on the Name of the parameter and edit Value in newly displayed dialogue window. This value is displayed in the menu.

Image Modified

Adding/removing menu buttons and Items in the list

Content of the menu can be changed via HTML in the field Content of HTML body.

Image Modified

Adding new button

Copy div dropdown and paste it into into html. Don't forget to add new parameters and change parameters of this newly added div - use codes of newly added parameters.

Adding new list items

Copy tag a (<a href="#PARAM=button1link3#">#PARAM=button1label3#</a>) and paste it into the div dropdown-content where you would like to add new list item. Add parameters (link and label) of this new list item and these parameters into the html code.

このユースケースではトップバーにカスタムホバーメニューを追加する手段の例を示します。新しく表示されたメニューボタンにコンソールを合わせた後、レポートリストが表示されます。

Image Added

拡張機能はここでダウンロードすることができます。

メニュー項目の編集

この例は3つのメニューボタンがあります。各ボタン毎には3つのリスト項目を含む。ラベル（ボタン、リスト項目など）及びリンクはパラメータで管理することができます。

パラメータ名をクリックすることで、ダイアローグウィンドウに新しく表示された値を編集します。これらの値はメニューに表示されます。

Image Added

リストでのメニューボタン及び項目の追加・解除

メニュー内容は「HTMLの本文」項目でのHTMLで変更することができます。

Image Added

新規ボタンの追加

divドロップダウンからコピーして、htmlに貼り付けます。新規追加パラメータのコードを使用している新規追加されたdivのパラメータを新規追加すること及びパラメータを変更することを忘れないでください。

リスト項目の新規追加

a (<a href="#PARAM=button1link3#">#PARAM=button1label3#</a>)のタグをコピーし、項目追加対象divドロップダウンリストに貼り付けます。htmlコードにこの新規リスト項目のパラメータ（リンク、ラベルなど）を追加します。