Jak zrobić menu na stronę www w Adobe Muse?

Witam, jeśli znalazłeś ten artykuł to znaczy, że szukasz odpowiedzi na temat tworzenia stron www w programi Adobe Muse, a konkretnie jak zrobić menu do swojej strony internetowej.







A więc zacznij od otwarcia programu i zaczynamy pracę. W poprzednim artykule zajmowaliśmy się tworzeniem nagłówka i stopki naszej strony. Ja otworzę sobie mój projekt, który robiłem poprzednio, no i jak widzisz nie mamy nic więcej oprócz strony HOME oraz A-MASTER. Żeby dodać podstrony musimy wybrać małe przyciski plusa, które znajdziesz przy podstronie HOME


Ja dodam trzy podstrony do HOME. Przy każdej nowej podstronie należy wykonać tą samą czynność co w podstronie HOME. Oczywiście jeśli będziemy zmieniać nazwy podstron to zacznie nam się również tworzyć menu główne naszej strony www.


Jak widzisz ja dodałem trzy kolejne podstrony, którym nadałem nazwy home, about, products oraz contact.
Teraz musimy się przenieś do A-MASTER, kliknij w tą podstronę dwa razy i zaczniemy ustawiać całe menu.
Jeśli już wszedłeś w tą zakładkę możemy przystąpić do dalszej pracy. A więc przejdźmy na prawą stronę naszego ekranu i tam znajdują się ciekawe dodatki takie jak Widgets Library a następnie MENUS. Mamy trzy opcje do wyboru, ja wybieram HORIZONTAL. 


Żeby dodać taki dodatek do naszej strony wystarczy na niego kliknąć lewym przyciskiem myszki i przeciągnąć go w dowolne miejsce na naszej stronie.


Jak widzisz nasze przyciski otrzymały taką samą nazwę jak podstrony, które wcześniej dodaliśmy i odpowiednio nazwaliśmy.
Wszystko wygląda fajnie ale nasze menu jest takie prymitywne, więc proponuje przystąpić do edycji naszego menu. Na początek musimy zaznaczyć nasz dodatek i wystarczy przejść do zakładki TEXT gdzie możemy zmienić krój pisma. Ja ustawiam nasz font na Arial oraz wielkość na 18 punktów, a także wybieram opcję bold. 
Jeśli już dopasowałeś sobie wszystko wg Twojego uznania, przystępujemy do następnego kroku.
Jak widzisz przy naszym dodatku widać taką małą niebieską kropkę, w której znajduje się strzałeczka. Klikamy na to i wchodzimy w dodatkowe ustawienia tego dodatku. Możesz wszystko ustawić jak będzie Ci pasowało, ale możesz to zrobić tak jak na obrazku poniżej.


Po wszystkich zabiegach pojawił się mały problem z odstępami między przyciskami, ale zaraz sobie z tym poradzimy. 
Teraz podłożymy sobie grafikę pod nasze przycisk. W tym celu zaznacz jeden z przycisków, może to być HOME.


Kolejny krok to dodanie grafiki. W tym celu przejdź do zakładki Fill, którą znajdziesz po prawej stronie ekranu i kliknij tam mały folder, który podpisany jest Image. Wybierz grafikę jaką chcesz podłożyć pod menu i kliknij OK. 


Wszystko wygląda całkiem fajnie, grafika została podłożona do każdego z przycisków, ale nie o to mi chodziło. Musimy dopasować wielkość grafiki do każdego z przycisków, ale zanim do tego przejdziemy to zajmijmy się dodawaniem kolejnej grafiki, która będzie informowała użytkownika, że znajduje się na danej stronie. Chodzi mi o opcje Rollover, Mouse Down itp. A więc przejdź do zakładki STATES i tam zaznacz opcję Rollover. Jeśli to zaznaczysz to znowu przechodzimy do zakładki Fill i wybieramy mały folder, z którego wybieramy kolejną grafikę.


To samo możesz zrobić ze stanem ACTIVE. 
Teraz zajmiemy się dopasowaniem dopasowaniem menu do grafiki. W tym celu znowu zaznacz jeden przycisk i za pomocą kontrolek, które się pojawią wokół przycisku rozciągnij go w dół, górę czy na boki.


Jak widzisz na obrazku wszystko wygląda bardzo ładnie :) Naszą pracę z przyciskami można uznać za zakończoną. Możesz wejść w widok Preview i zobaczyć jak nasza strona działa 


Dziękuję za uwagę. Zapraszam Cię również do obejrzenia filmu.






Brak komentarzy:

Prześlij komentarz