Autor:
Bobbie Johnson
Data Utworzenia:
6 Kwiecień 2021
Data Aktualizacji:
1 Lipiec 2024
![How to Create Download Button HTML and CSS](https://i.ytimg.com/vi/MfifME4JezM/hqdefault.jpg)
Zawartość
Przycisk pobierania sprawi, że Twoja witryna będzie wyglądać o wiele bardziej profesjonalnie niż zwykłe łącze do pobrania. Przycisk zapewnia bardziej przejrzysty interfejs, a jeśli sam coś zaprojektujesz, Twoje przyciski mogą stać się integralną częścią projektu strony. Postępuj zgodnie z tym samouczkiem, aby utworzyć przycisk HTML lub własny przycisk niestandardowy.
Kroki
Metoda 1 z 2: Utwórz przycisk HTML
1 Utwórz przycisk w edytorze źródłowym. Prosty edytor tekstu, taki jak Notatnik lub TextEdit, jest w porządku. W edytorze tekstu wprowadź następujący kod:
2 Prześlij plik na swój serwer. Jeśli chcesz zaoferować plik do pobrania, musisz albo zapisać go na swoim serwerze, albo powiązać przycisk z jakimś plikiem w innym miejscu w sieci. Użyj klienta FTP, aby przesłać plik, który chcesz udostępnić na serwerze witryny.
3 Upewnij się, że masz uprawnienia webmastera, jeśli chcesz umieścić link do pliku, który nie jest przez Ciebie przechowywany.
4Zastąp „Lokalizacja pobierania” swoim prawdziwym adresem URL pobierania. Pamiętaj, aby umieścić adres w pojedynczych cudzysłowach i „window.location =' Download Location ”w podwójnych cudzysłowach. Dodaj prefiksy, takie jak HTTP: // lub FTP: // i dodaj rozszerzenia plików, takie jak .webp lub .EXE ...
5 Napisz na przycisku. Zastąp „Tekst przycisku” słowami, które chcesz umieścić na przycisku. Pamiętaj, aby umieścić tekst w podwójnych cudzysłowach. Staraj się, aby Twoje zdanie było krótkie, aby przycisk na ekranie nie wydawał się nieporęczny.
6 Umieść kod źródłowy na swojej stronie. Możesz wkleić kod źródłowy przycisku w dowolnym miejscu na stronie, a przycisk pojawi się dokładnie w tym miejscu. Prześlij nowy kod strony i przetestuj nowy przycisk.
Metoda 2 z 2: Utwórz przycisk jako obraz
1 Narysuj przycisk pobierania. Użyj dowolnego edytora obrazów i narysuj przycisk pasujący do stylu Twojej witryny. Możesz ustawić przycisk tak duży (lub mały), jak chcesz.
2 Prześlij plik i obraz z przyciskiem na swój serwer. Jeśli chcesz zaoferować plik do pobrania, musisz albo zapisać go na swoim serwerze, albo powiązać przycisk z jakimś plikiem w innym miejscu w sieci. Użyj klienta FTP, aby przesłać plik, który chcesz udostępnić na serwerze witryny.
- Prześlij obraz przycisku do tej samej lokalizacji na serwerze, w której znajduje się strona, na której dodajesz ten przycisk.
3 Napisz kod źródłowy do pobrania. Przycisk pobierania, renderowany jako obraz, działa tak samo, jak wszystkie inne łącza w HTML.Skopiuj następujący kod do swojego edytora:
4 Wprowadź informacje o pliku i obrazie. Zastąp „Lokalizacja pobierania” prawdziwym adresem URL pobierania, w tym prefiksami HTTP: // lub FTP: //. Zastąp „Plik obrazu” nazwą pliku obrazu przycisku. Jeśli plik znajduje się na serwerze w tym samym miejscu co strona, nie musisz podawać pełnej ścieżki.
- Zastąp „Tekst najechania” tekstem, który powinien się pojawić, gdy użytkownik najedzie kursorem na obraz przycisku.
- Zastąp „X” i „Y” odpowiednio szerokością i wysokością obrazu w pikselach.
- Pamiętaj, aby dodać wszystkie te wpisy w podwójnych cudzysłowach.
5 Wpisz kod źródłowy na swojej stronie. Umieść kod w miejscu, w którym powinien pojawić się przycisk. Prześlij nowy kod, a następnie otwórz swoją stronę internetową, aby sprawdzić, czy przycisk działa. Sprawdź, czy tekst podpowiedzi pojawia się po najechaniu kursorem, a sam obrazek ma prawidłowy rozmiar.
Ostrzeżenia
- Nigdy nie przesyłaj plików naruszających prawa autorskie, ponieważ może to skutkować wysoką grzywną lub nawet karą więzienia.
- O wiele lepiej jest wgrywać pliki na własny serwer i udostępniać je później, niż polegać na innych witrynach, na których są przechowywane. Jeśli skopiujesz łącze do lokalizacji pliku z innej witryny, utworzony przycisk pobierania będzie działał tylko tak długo, jak długo łącze pozostanie ważne. Będziesz musiał okresowo sprawdzać funkcjonalność przycisku lub linku w witrynie, z której go pobrałeś, aby upewnić się, że użytkownicy będą mogli pobrać plik po kliknięciu przycisku i nie klikną uszkodzonego linku z powodu fakt, że plik już nie istnieje.