Slik oppretter du hyperkoblinger for Adobe Muse-webområder

I denne artikkelen lærer du hvordan du jobber med hyperkoblinger i Adobe Muse. Ved hjelp av hyperkoblinger kan du lage koblinger til eksterne webområder, nedlastbare filer, e-postadresser med mer. De nedlastbare filene kan være PDF, DOC, PPT, TXT, rikt medieinnhold eller andre typer filer du vil dele med brukerne av webområdet ditt, men som det ikke er støtte for å legge inn i Muse-grensesnittet. Du kan lage koblinger til filer som blir lastet opp til *Adobe Muse-vertskontoen, samt filer som ligger på tredjeparts webområder.

I denne delen lærer du hvordan du kobler menyelementer til to ankerfeltelementer for å legge til ankerkoblingene til den manuelle menyen. Følg disse trinnene:

1. Klikk hvor som helst på siden for å velge siden (slik at markeringsindikatoren viser ordet Side). Deretter klikker du kontrollprogrammet for meny (beholder for kontrollprogram) to ganger. Den første gangen merkes hele det manuelle kontrollprogrammet for meny, og den andre gangen merkes menyelementet. Markeringsindikatoren viser ordet Menyelement.
2. Klikk Hyperkoblinger-menyen for å vise hele listen med sider og ankerkoder for området. Finn den riktige siden i Skrivebord-delen, og legg merke til at de fire ankerkodene du opprettet, er oppført rett under siden. Merk den passende ankerkoden for å koble den til menyelementet.

3. Gjenta trinn 2 for å legge til flere ankerkoblinger.
4. Velg Fil > Egenskaper for område. I Layout-fanen må du kontrollere at Aktiver Aktiv-tilstand for ankerkoblinger er valgt. Dette alternativet er aktivert som standard på alle nye områder, men hvis du redigerer et eldre område, kan det være du må merke av i avmerkingsboksen.
5. Velg Fil > Forhåndsvis side i webleser.

Legg merke til at den aktive tilstanden i navigeringsmenyen vises når du klikker på koblingene for å se forskjellige felt på siden. Denne funksjonen hjelper besøkende å orientere seg seg slik at de forstår hvilket område som vises. Avslutt webleseren og returner til Adobe Muse.

Forsøk også å bla opp og og ned på siden for å se hvordan koden i siden finner plasseringen til hver ankerkode og oppdaterer den aktive tilstanden til den manuelle menyen etter hvert som siden beveger seg gjennom hvert felt. Denne metoden fungerer for sider som kan blas både vertikalt og horisontalt.

Merk: En side må være høy eller vid nok til å tillate rom for at ankerkoder skal kunne hoppe til hvert felt. Hvis feltene på siden ligger for tett inntil hverandre, slik at alt innholdet får plass i et webleservindu uten å bla, vil ikke ankerkodene hoppe til neste felt.

6. Avslutt webleseren og returner til Adobe Muse.

I den neste delen skal du lære hvordan du legger til nedlastingskoblinger, slik at besøkende kan laste ned filformater som PDF, DOC, MP3, MOV, PSD og JPEG-filer med høy oppløsning.

Tips: Hvis du jobber med andre designere på et områdeprosjekt, kan du også koble til .muse-kildefiler. Dermed kan det teammedlemmet laste dem ned direkte fra webområdet ditt.

Det å lage Ankerfelt på en webside er en enkel måte å lage visuelle skiller mellom ulike deler av en side. Det er enkel tilgang til hver av disse delene via ankerkoblinger, som er designet for å gjøre det enkelt å navigere på en side.

I en endelig design skal websiden helst ha ankerkoblinger som gjør at besøkende kan hoppe vertikalt til feltet som viser tilsvarende menyer. Tenk deg at når du legger til ankerkoder, fungerer det på samme måte som om du fester en markør et sted på siden. Når besøkende klikker en kobling til det ankeret, blar koblingen lange sider og hopper til den bestemte delen der markøren befinner seg.

1. Klikk ankerknappen i det øverste navigeringsområdet for å laste ankerverktøyet.

2. Klikk én gang helt øverst på siden over den overordnede navigeringen i topptekstområdet. Du kan flytte topptekstrektanglet midlertidig unna hvis du vil. Hvis du flytter topptekstinnholdet, må du flytte det tilbake etterpå.
3. I dialogboksen Gi nytt navn til et anker som vises, skriver du inn navnet på ankeret.

4. Gjenta trinn 1 til 3 for å angi ankerfelt og legge til flere ankerkoblinger.

Etter at du har lagt til et kontrollprogram for menyen i neste steg, skal du koble knappene til ankerkodene for å opprette navigering som gjør at besøkende kan hoppe ned på siden for å lese hver meny.

1. Mens du redigerer matsiden i Design-visningen, bruker du Typeverktøy til å opprette en ny tekstramme nær toppen øverst i hjørnet til høyre for tekstrammen for Frokost-menyen. Skriv inn ordet Nedlastingsmeny.
2. Mens tekstrammen fortsatt er valgt, bruker du Tekst-panelet til å bruke følgende innstillinger:
   • Webskrift: Kaushan-skrift (eller en annen skrift du foretrekker)
   • Skriftstørrelse: 14
   • Farge: #EEE5C4 (i del 3 gav du denne fargeprøven navnet Krem-meny)
   • Linjeavstand: 57%
   • Justering: Midtstilt
3. Bruk Fyll-menyen til å sette fyllfargen til Ingen. Klikk mappeikonet ved siden av Bilde-delen, og bla for å velge filen download-bg.png i eksempelfilmappen for å angi bakgrunnsbildet. Kontroller at Tilpassing-menyen er satt til Opprinnelig størrelse og at posisjonen er midtstilt.

4. Klikk utenfor Fyll-menyen for å lukke den. Hvis det kreves, bruker du markeringsverktøyet til å endre størrelse på tekstrammen og omplassere den slik at den er plassert i hjørnet øverst til høyre på menytekstrammen Frokost.

5. Mens tekstrammen fortsatt er valgt, bruker du Koblinger-menyen i Kontrollpanel for å velge alternativet Koble til fil. I dialogboksen Importer som vises, blar du for å velge filen, og klikker Åpne for velge den.

Merk: Når du blar for å velge en fil ved hjelp av funksjonen Koble til fil, blir filen ett av innholdselementene på området som lastes opp når området publiseres, eller som er inkludert i områdefilene når området eksporteres. Det anbefales å kopiere filer du vil koble til fra området til områdets lokalmappe, sammen med andre bildefiler som brukes på området.

Koblingen til PDF-filen har nå blitt lagt til. Hvis du tar en titt på Innholdselementer-panelet, vil du se at filen nå er oppført som et innholdselement på webområdet.

6. Merk tekstrammen med markeringsverktøyet. Kopier tekstrammen Last ned meny og lim den inn eller plasser den over hjørnet øverst til høyre på lunsjmenyen. Gjenta dette trinnet to ganger til for å opprette kopier som er plassert over hjørnet øverst til høyre for Middag- og Dessert-menyene.

I et reelt prosjekt kan du koble til fire atskilte menyfiler, slik at besøkende får fire ulike nedlastbare PDF-filer de kan bruke til å vise og skrive ut menyene. I denne opplæringen er Last ned-knappen imidlertid koblet til den samme PDF-filen i hvert felt på siden.

7. Velg Fil > Forhåndsvis side i webleser. Klikk ett av menyelementene på menyen for horisontal for å hoppe til den menyen på siden. Legg merke til at når du blar nedover for å vise Middag- og Dessert-menyen, vises toppteksten over det andre sideinnholdet. Denne virkemåten forekommer fordi matsiden bruker Forgrunn-malsiden, og topptekstinnholdet for den siden har blitt flyttet til forgrunnen.
8. Klikk Last ned meny-koblingen og se hvordan PDF-filen lastes ned til maskinen.

Avhengig av webleseren du bruker og webleserinnstillingene, vil du erfare ulike virkemåter. Noen weblesere viser PDF-filen i webleservinduet, mens andre laster ned PDF-filen til skrivebordet. Der kan du åpne filen ved hjelp av Acrobat Pro eller Acrobat Reader.

Hvis du har brukt Adobe Muse en stund, har du kanskje lagt merke til at Koblinger-menyen nylig har blitt omorganisert i deler slik at det blir enklere å finne sidenavnene og -elementene du kan koble. I denne delen skal du se nærmere på hvordan Koblinger-menyen er strukturert, og hvordan du filtrerer elementene i menylisten. Du skal også lære hvordan du legger til koblinger til e-postadresser.

1. Klikk nedoverpilen på Koblinger-menyen for å vise hele listen.

2. Koblinger-menyen er ordnet i deler. Alternativet Nylig brukte koblinger viser koblinger til eksterne webområder som har blitt lagt til på området. Du kan angi en URL-adresse i Koblinger-feltet for å koble til eksterne websider.
3. Skrivebord-delen inneholder sidene på det gjeldende området. Legg merke til at ankerkodene du la til på matsiden, er oppført alfabetisk under matsiden. Dette betyr at du kan opprette ankere med samme navn på flere sider på et område, og du kan fortsatt identifisere dem på en enkel måte mens du konfigurerer koblinger. På dette eksempelområdet finnes det bare en Skrivebord-layout, men hvis området inneholder alternative layouter for Telefon eller Nettbrett, vises disse delene med tilsvarende sett med sider.
4. Filer-delen på slutten inkluderer funksjonen Koble til fil samt nedlastbare filer som er lagt til på det gjeldende området. Du la nylig til en kobling i filen KatiesCafeMenu.pdf, og navnet på filen er oppført i denne delen, og derfor blir det enkelt å koble til et vanlig innholdselement på nytt fra flere sider på området.
5. Hvis du vil legge til en e-postkobling (som fører til at e-postklienten til den besøkende åpnes når du klikker koblingen, og et nytt vindu åpnes med e-postadressen i Til-feltet), skriver du inn e-postadressen med prefikset mailto: i feltet Koblinger-meny på denne måten:
   
   mailto:email@address.com
   
   
6. Noen ganger kan listen over elementer på Koblinger-menyen bli ganske lang og vanskelig å navigere i på store webområder. Hvis du leter en bestemt side, anker, fil eller ekstern URL-adresse du kan koble til, skriver du inn de første bokstavene i koblingen i feltet Koblinger-meny, og dermed vises samsvarende elementer. Dermed kan du raskt filtrere listen og finne elementene du vil å koble.

Nå når ikonknappene for de sosiale mediene er plassert, skal du legge til de eksterne koblingene for hvert av de sosiale nettverksområdene.

1. Merk Facebook-ikonet og skriver deretter inn (eller kopier og lim inn) koblingen til Facebook-siden for Katie's Cafe i feltet Koblinger-meny på denne måten: http://www.facebook.com/KatiesCafeSF
2. Merk Google+-ikonet og skriv deretter inn (eller kopier og lim inn) følgende kobling på Katie's Cafe-siden på Google+: https://plus.google.com/u/1/117800212967830061444/posts
3. Merk Twitter-ikonet og skriv deretter inn (eller kopier og lim inn) følgende kobling på Katie's Cafe-siden på Twitter: http://twitter.com/katiescafesf
4. Klikk Facebook-ikonet på nytt for å merke det. Klikk ordet Koblinger, som er understreket med blå farge, til venstre for Koblinger-menyen. I dialogboksen som vises, merker du av for Åpne koblingen i et nytt vindu eller en ny fane.
5. Gjenta trinn 4 for å angi koblingene for Google+ og Twitter slik at de også åpnes i et nytt webleservindu.

Dette er en vanlig webdesignpraksis – koblinger som henviser til andre sider på det samme området, åpnes i det samme webleservinduet (som skjer som standard i Adobe Muse), og koblinger til sider på andre, eksterne webområder åpnes i et nytt vindu eller en ny fane.

Når du skal lage koblingen før du legger til en side på Adobe Muse-området ditt, må du bruke en webleser til å besøke den aktiverte, opplastede filen. Følg disse trinnene.

1. Åpne en webleser.
2. Gå til området ditt eller et tredjeparts område som inneholder den opplastede avhengige filen. Du kan bruke en søkemotor, som Google, eller du kan skrive inn domenenavnet til området direkte i adresselinjen til webleseren.

3. Etter at du har åpnet Hjem-siden til det ønskede området, klikker du deg frem til den aktuelle avhengige filen. Du kan også skrive inn hele URL-adressen til filen i adresselinjen til webleseren. Når du har gjort dette, vil webleseren vise, spille av eller laste ned filen.
4. Når du er sikker på at du har den riktige URL-adressen til den opplastede filen, merker du alt som står på adresselinjen til webleseren og velger Rediger > Kopier. Eventuelt kan du bruke hurtigtastene Kommando + C (Mac) eller Ctrl + C (Windows).

Nå er URL-adressen til den avhengige filen kopiert til utklippstavlen. Pass på så du ikke kopierer noen andre elementer før du har limt URL-adressen til den avhengige filen inn i Hyperkobling-feltet, som beskrevet i neste avsnitt.

Når du har lastet opp en avhengig fil, åpnet den via en webleser og kopiert URL-adressen til filen, er siste trinn å lage koblingen til den på den aktuelle siden på Adobe Muse-området ditt. Følg disse trinnene:

1. Start Adobe Muse. Dobbeltklikk miniatyren av siden for å åpne den i Design-visning.
2. Velg litt tekst, et plassert bilde eller et rektangel som du vil skal være "knappen" som besøkende skal klikke for å laste ned eller åpne den avhengige filen.
3. Når teksten eller sideelementet er valgt, klikker du i Hyperkobling-feltet og limer inn URL-adressen (den absolutte banen) til den avhengige filen som du kopierte tidligere.

Hvis du vil at koblingen skal åpnes i et nytt webleservindu, klikker du Hyperkobling-etiketten rett til venstre for Hyperkobling-vinduet. I dialogboksen som åpnes, merker du av i avmerkingsboksen for å åpne koblingen i et nytt vindu eller en ny fane, som vist under.

Lagre siden, og publiser endringene på området.

Gå til siden i en webleser. Klikk koblingsteksten eller knappen for å bekrefte at den fungerer som den skal.

Hvis du vil ha flere tips til hvordan du jobber med Adobe Muse, kan du gå til side for hjelp og opplæringer for Adobe Muse eller siden for Adobe Muse-arrangementer for direkteoverførte og innspilte webinarer.