Jak ukryć element z górnego paska nawigacji?

Bywa, że użytkownik poprosi Cię o zainstalowanie jakiegoś pluginu, który będzie wykorzystywany tylko przez tego konkretnego użytkownika bądź stosunkowo wąska grupę. Czasem taki plugin po zainstalowaniu umiejscawia się gdzieś dyskretnie w którymś z menu lub ekranów. Są jednak przypadki, w których twórcy dodatku postanawiają umieścić go w górnym niebieskim pasku nawigacyjnym. Co zrobić jeśli nie chcesz, żeby menu apki pojawiało się na tym pasku?

Osobiście uważam, że jest to w porządku o ile z pluginu będzie korzystała większość użytkowników Jira. Są takie pluginy jak np. służący do rejestracji czasu pracy Tempo Timesheet. Jest on wtedy łatwo dostępny na widoku. Jeśli jednak plugin będzie wykorzystywany przez relatywnie wąską grupę użytkowników to umieszczanie go w górnym pasku gdzie jest dostępny dla wszystkich jest przesadą. Szczególnie, że miejsce w tym menu jest stosunkowo ograniczone.

Z podobną sytuacją miałem do czynienia niedawno. Jeden z zespołów poprosił mnie o zainstalowanie pluginu z którego tylko on miał zamiar korzystać. Spróbowałem na środowisku testowym i niby wszytko OK, no, ale apka dodała się na pasku menu… Po co setki ludzi mają codziennie patrzeć na coś z czego korzysta tylko 5-6 osób?

Pomimo tego, że stare porzekadło mówi, że kto ma miękkie serce musi mieć twardą d… ja mam z natury miękkie serce dla użytkowników i nie chciałem odmawiać instalacji. Postanowiłem poszukać czy można w jakiś sposób ukryć element z menu.

Okazało się, że tak i jest to stosunkowo proste. Nie jest to opcja dostępna do wyklikania w Jira i wymaga minimalnej znajomości technologii front-end. Co szczególnie mnie ucieszyło nie wymaga ona ingerencji w pliki aplikacji , a tego przyznaję się spodziewałem.

Jak ukryć element wytłumaczę na przykładzie apki Zeplin co do której wiem, że po zainstalowaniu pojawia się w menu na górze. A zatem do dzieła.

Menu przed i menu po instalacji

Żeby nie być gołosłownym menu przed instalacją wygląda tak:

A po instalacji tak:

Jak widać plugin usadowił nam się na końcu menu.

Namierzamy

Tak jak wspomniałem, do ukrycia będzie nam potrzebna minimalna znajomość technologii front-end, w tym przypadku CSS oraz umiejętność posługiwania się Web Developer tools z naszej przeglądarki internetowej. W moim przypadku tą przeglądarką jest Firefox.

Ponieważ górne menu jest widoczne zawsze nie ważne , w którym miejscu w Jira jesteś. Ja akurat jestem na stronie widocznej zaraz po zalogowaniu. W Firefox kliknij Open menu > Web Developer > Inspector (ctrl+shift+c) i jak już otworzą Ci się narzędzia developerskie, kliknij na przycisk Zeplin. Powinieneś mieć widok zbliżony do tego co widać na poniższym obrazku:

Interesuje nas ID przycisku Zeplin. Zawiera go linijka, która jest podświetlona:

<a id="zeplin-settings-web-item" class=" aui-nav-link" href="/plugins/servlet/zeplinsettings">Zeplin</a>

Dla jasności jest to: „zeplin-settings-web-item” 😉

Ukrywamy

Mając ID elementu, możesz już zamknąć narzędzia developerskie przeglądarki. Przejdź w Jira do:

admin (trybik) > System > Announcement banner

W pole Announcement wklej następujący kod:

<!--- Hide Zeplin button from top blue bar --->
<style type="text/css">
#zeplin-settings-web-item {
	display: none;
}
</style>

i kliknij przycisk Set Banner. Przycisk Zeplin został ukryty 🙂

Jeszcze słowo wyjaśnienia. Posiadając ID elementu, użyliśmy polecenia CSS display: none do ukrycia wyświetlania tego elementu. Analogicznie możesz postąpić z dowolnym innym elementem jeśli masz jego ID.

Dobrą praktyką jest dodanie komentarza pomiędzy <!- – – – – -> wyjaśniającego co robi dany kod. Szczególnie w sytuacji , kiedy w polu baner znajduje się o wiele więcej elementów. Także jeśli posiadasz jakiś baner to nic nie stoi na przeszkodzie, żeby skorzystać z tej metody. Po prostu dodaj powyższy kod na samym końcu.



Skomentuj:

Twój adres email nie zostanie opublikowany

Site Footer