Vytvoření odkazu na telefon může být užitečné pro mnoho webových stránek, zejména pro mobilní zařízení. To umožňuje uživatelům kliknout na odkaz a okamžitě zavolat. V této příručce se podíváme na to, jak vytvořit odkaz na telefon v HTML.
Krok 1: Prvním krokem je napsat HTML kód pro vytvoření odkazu na telefon. K tomu můžete použít značku a atribut href s uvedením protokolu " tel: "a telefonního čísla ve formátu"tel: číslo_telefonu". Například:
V tomto příkladu, kliknutím na odkaz "+7 (123) 456-789", bude uživatel moci okamžitě vytočit uvedené číslo na svém telefonu.
Krok 2: Chcete-li zlepšit vzhled odkazu na telefon, můžete použít CSS k přidání stylů, jako je změna barvy odkazu nebo přidání ikony telefonu. Můžete například přidat třídu "phone-link" a definovat její styly v CSS:
Tuto třídu pak můžete použít na svůj odkaz na telefon:
To vám umožní změnit barvu odkazu na modrou a odstranit podtržítko.
První krok: Vytvořte odkaz pomocí značky "a"
Jedním z nejjednodušších způsobů, jak vytvořit odkaz na telefon v HTML, je použití značky "a". Tato značka je navržena pro vytváření odkazů a lze ji použít k vytvoření odkazu na telefonní číslo.
K vytvoření odkazu na telefon v HTML je třeba použít speciální protokol "tel". Protokol " tel " umožňuje připojení k telefonnímu číslu uvedenému v odkazu.
Chcete-li vytvořit odkaz na telefon, musíte použít následující syntaxi:
- Otevřete značku " a "a přidejte atribut"href".
- Ve významu atributu "href" zadejte " tel:", po kterém přidejte telefonní číslo, bez mezer nebo jiných oddělovačů.
- Zavřete značku "a".
Níže je uveden příklad vytvoření odkazu na telefonní číslo:
V uvedeném příkladu se odkaz zobrazí jako "+123456789 " a po kliknutí na něj se zobrazí telefonní číslo.
Je důležité poznamenat, že při použití protokolu "tel" nelze přidat žádné znaky kromě číslic a symbolu "+". Pokud tedy chcete zadat nějaký kód země, nezapomeňte jej zahrnout do telefonního čísla.
Nyní víte, jak vytvořit odkaz na telefon pomocí značky "a" v HTML. V následujících částech se podíváme na pokročilejší způsoby vytváření odkazů na telefon.
Druhý krok: přidejte protokol "tel:" pro zpracování odkazu na telefon
Nyní, když již máte položku s textem a telefonním číslem, musíte ke zpracování odkazu na telefon přidat protokol "tel:". Protokol " tel:"umožňuje prohlížeči nebo mobilnímu zařízení správně interpretovat odkaz na telefon a nabídnout uživateli možnosti akce.
Chcete-li přidat protokol "tel:" do kódu HTML, stačí jej jednoduše vložit Před telefonní číslo v atributu href. Například:
Zde tel:+1234567890 - toto je příklad odkazu na telefon, kde" +1234567890 " je telefonní číslo, na které bude hovor uskutečněn.
Je důležité poznamenat, že předpona "+" se používá k označení mezinárodního kódu země, po kterém následuje telefonní číslo ve formátu použitém v dané zemi.
Po kliknutí na tento odkaz v mobilním prohlížeči nebo zařízení bude uživatel vyzván k provedení jedné z akcí: vytočit telefonní číslo přímo na zařízení, přidat číslo do kontaktů nebo jej uložit pro budoucí použití.
Použití protokolu " tel:"pro zpracování odkazu na telefon umožňuje, aby vaše webová stránka byla uživatelsky přívětivější, zejména pro uživatele z mobilních zařízení. Budou vás moci okamžitě kontaktovat vytočením telefonního čísla jedním klepnutím.
Třetí krok: přidejte telefonní číslo do odkazu
Nyní, když máme základ pro vytvoření odkazu na telefon, je třeba přidat skutečné telefonní číslo.
Chcete-li do odkazu Přidat telefonní číslo, musíte v href atributu nahradit "telefonní číslo" skutečným telefonním číslem, které chcete použít. Formát telefonního čísla se může lišit v závislosti na požadavcích vašeho webu nebo služby.
Pokud je například vaše telefonní číslo +1234567890, pak váš href atribut bude vypadat následovně:
Zde je "tel:" schéma, které říká prohlížeči, aby otevřel aplikaci telefonu pro vytočení zadaného čísla.
Jakmile přidáte skutečné telefonní číslo do href atribut, váš odkaz na telefon bude vypadat následovně:
Nyní, když uživatel klikne na tento odkaz z mobilního zařízení, bude mít možnost vytočit zadané telefonní číslo.
Byl to třetí krok při vytváření odkazu na telefon v HTML. Dále se podíváme na další možnosti přizpůsobení odkazu.
Čtvrtý krok: přidejte text, který se zobrazí jako odkaz
Nyní, když jsme vytvořili odkaz, přidáme nějaký text, který se zobrazí na stránce. Obvykle tento text označí odkaz, který vede k telefonu nebo příslušnému obsahu.
V tomto příkladu se na stránce zobrazí" Zavolejte mi " jako odkaz, na který mohou uživatelé kliknout a zavolat na uvedené telefonní číslo (1234567890).
Všimněte si, že text zobrazený jako odkaz může být naformátován pomocí značek pro změnu stylu nebo přidání přízvuku, jako je, atd.
Nyní, když jste přidali text, který se zobrazí jako odkaz, můžete v případě potřeby začít konfigurovat další atributy odkazu nebo stylizaci textu.
Níže je uveden příklad použití neuspořádaného seznamu k zobrazení odkazu:
A to je vše! Nyní máte odkaz na telefon s textem, který se zobrazí na stránce.