Sådan Indsættes Et Link I Et Banner

Indholdsfortegnelse:

Sådan Indsættes Et Link I Et Banner
Sådan Indsættes Et Link I Et Banner

Video: Sådan Indsættes Et Link I Et Banner

Video: Sådan Indsættes Et Link I Et Banner
Video: Hvordan man laver et link til en youtube-video 2024, April
Anonim

Hvis du har et banner, men der ikke er nogen færdiggjort html-kode til at indsætte det på siden, er det ikke så svært at tilføje det link, du har brug for. Selvom banneren er lavet ved hjælp af flashteknologi. Mulige muligheder for at organisere links til bannere i grafisk format og flashformat i kildekoden er beskrevet nedenfor.

Sådan indsættes et link i et banner
Sådan indsættes et link i et banner

Instruktioner

Trin 1

Hvis banneret er i et af de grafiske formater (gif, jpg, png, bmp), er det nok at placere billedkoden inde i linktagget. Dann først billedkoden. På markupsproget på websider (HTML - HyperText Markup Language - "hypertext markup language") ser den enkleste version sådan ud: Her er den "relative adresse" på billedet specificeret i src-attributten. I denne version antager browseren, at billedet er i den samme mappe på din server, hvor selve siden er, hvor banneret indsættes. Men det er bedre at angive en "absolut adresse":

Trin 2

Der er et par flere attributter at tilføje til dette tag. To attributter angiver bannerdimensionerne (højde og bredde). Disse er valgfri attributter - billedet vises uden dem, hvis alt går godt, når siden indlæses fra serveren til browseren. Men hvis billedet af en eller anden grund ikke er indlæst, kan manglen på dimensioner føre til, at alle andre designelementer vil være malplacerede. Størrelseskortet ser sådan ud:

Trin 3

Som standard tegner browseren en blå kant omkring linkbilleder. For at undgå dette skal du tilføje en kantattribut med en nulværdi til bannertagget:

Trin 4

Tilføj endnu en attribut (titel), som indeholder teksten til værktøjstip, når du holder musemarkøren over banneret:

Trin 5

Du har forberedt billedkoden med de vigtigste attributter, nu skal du placere den inde i linkkoden. Hvert hyperlink er dannet af to tags - åbning og lukning: Åbningskoden indeholder href-attributten, som indeholder adressen til afsendelse af anmodningen. Mellem disse to link tags og indsæt bannertagget: HTML-koden på banneret med linket er klar, glem ikke at erstatte: - i href-attributten: "https://kakprosto.ru" med adressen på dit link til banneret - i src-attributten: "https://kakprosto.ru/banner.gif" til adressen på billedet til banneret; - i breddeattributten: "468" til bredden på dit banner; - i højdeattributten: "60" for højden på dit banner; - i titelattributten: "Det er et banner!" pop op-tekst til dit banner;

Trin 6

Alle ovennævnte henviste til billedbannere, men der er også bannere lavet ved hjælp af flashteknologi. For at indsætte et link i en flashfilm på en standard måde, skal du ikke kun have selve banneret, men også dets kildekode. Derudover kan du redigere kildekoden og derefter kun kompilere Flash-filmen i en specialeditor - en almindelig teksteditor er ikke egnet til dette. Der er dog en måde at komme rundt på alle disse vanskeligheder ved at begrænse dig selv til kun at redigere HTML og CSS (Cascading Style Sheets - "cascading style sheets"). CSS-sproget bruges til en mere detaljeret (sammenlignet med HTML) beskrivelse af udseendet af sideelementer. Med dens hjælp kan der bygges ret komplekse flerlagsstrukturer på siderne. Vi bruger dette ved at placere Flash-banneret i det nederste lag og placere laget med linket over det. HTML-koden på banneret vil se sådan ud:

Glem ikke at erstatte bredde- og højdeattributterne i den (to steder), bannernavnet banner.swf (to steder) og linkadressen https://kakprosto.ru (ét sted). Og SCC-koden svarende til denne HTML-kode skal være sådan:

div.linkedFlashContainer {position: relative; z-indeks: 1; kant: 0px; bredde: 468px; højde: 60px}

a.flashLink {position: absolut; z-indeks: 2; bredde: 468px; højde: 60px; baggrund: url (spacer.gif) ingen gentagelse;}

Her bruges et gennemsigtigt billede (af enhver størrelse) kaldet spacer.gif. Og også her skal du ikke glemme at ændre størrelsen på bredden og højden (to steder).

Anbefalede: