Category: HTML

Sometimes, we want to add WhatsApp function to website, like sms, tel with HTML.

In this article, we’ll look at how to add WhatsApp function to website, like sms, tel with HTML.

How to add WhatsApp function to website, like sms, tel with HTML?

To add WhatsApp function to website, like sms, tel with HTML, we add a URL for the link.

For instance, we write

<a href="https://wa.me/1234567890/?text=urlencodedtext"></a>

to set the URL for the WhatsApp link.

1234567890 is the app phone number.

And the text query parameter has the text we want to send to the number.

Conclusion

To add WhatsApp function to website, like sms, tel with HTML, we add a URL for the link.

Sometimes, we want to add a HTML select drop-down with an input field.

In this article, we’ll look at how to add a HTML select drop-down with an input field.

How to add a HTML select drop-down with an input field?

To add a HTML select drop-down with an input field, we use the datalist element.

For instance, we write

<input type="text" name="city" list="cityname" />
<datalist id="cityname">
  <option value="Boston"></option>
  <option value="Cambridge"></option>
</datalist>

to add an input with the datalist element.

We set the list attribute of the input to the same value as the id attribute of the datalist element to show the datalist’s values under the input when we type in the input.

Conclusion

To add a HTML select drop-down with an input field, we use the datalist element.

Sometimes, we want to embed an external page without an iframe with HTML.

In this article, we’ll look at how to embed an external page without an iframe with HTML.

How to embed an external page without an iframe with HTML?

To embed an external page without an iframe with HTML, we use the object element.

For instance, we write

<object
  type="text/html"
  data="http://www.example.com"
  style="width: 100%; height: 100%"
>
  <p>backup content</p>
</object>

to add the object element with the data attribute set to the URL of the page to show.

Conclusion

To embed an external page without an iframe with HTML, we use the object element.

Sometimes, we want to open Google map with specific address in a browser with HTML.

In this article, we’ll look at how to open Google map with specific address in a browser with HTML.

How to open Google map with specific address in a browser with HTML?

To open Google map with specific address in a browser with HTML, we use the Google map URL.

For instance, we write

<a
  href="http://maps.google.com/?q=50 Hagiwara Tea Garden Dr, San Francisco, CA 94118, United States"
>
  ...
</a>

to add the Google map URL with the q query parameter set to the address to show on the map.

Conclusion

To open Google map with specific address in a browser with HTML, we use the Google map URL.

Sometimes, we want to display a reload symbol in HTML without loading an image.

In this article, we’ll look at how to display a reload symbol in HTML without loading an image.

How to display a reload symbol in HTML without loading an image?

To display a reload symbol in HTML without loading an image, we use HTML entities.

For instance, we write

<span class="reload">&#x21bb;</span>

to add the ↻ HTML entity to add the reload symbol onto the page.

Conclusion

To display a reload symbol in HTML without loading an image, we use HTML entities.