Adding a sharing icon on your website

You can integrate a little share button on your website.

Ready to use example buttons

If you want, you can right click and save them or even better… create your own buttons.

The target link would look like this:

In case you want to share, you would use this link:

For a live example, see the IP checker.

CSS-based Share Button

There is also an unofficial CSS-based button available. It can be used in situations when you want the button to load faster or scale for larger screens.

<a class="telegram-share" href="''+encodeURIComponent(window.location.href), '_blank')">
CSS Code
  position: relative;
  display: inline-block;
  height: 20px;
  padding: 1px 8px 1px 6px;
  font-weight: 500;
  color: #fff;
  cursor: pointer;
  background-color: #0088cc;
  border-radius: 3px;
  box-sizing: border-box;
  text-decoration: none;
  font-size: 11px;

.telegram-share span{
  display: inline-block;
  margin-top: 3px;

.telegram-share i{
  display: inline-block;
  height: 20px;
  vertical-align: top;
  width: 12px;
  background-repeat: no-repeat;
  background-position-y: 4px;
  background-size: 10px;
  /* This image is included below :) */
  background-image: url(/assets/telegram-plane.png);

  background-color: #007dbb;

  background-color: #026698;

And here's the telegram-plane.png image needed.

End Result

If you implemented the button correctly, it should look something like this…

If you need help implementing this button, don't hesitate to ask @bcrypt on Telegram!

Browser bookmarklet


Drag and drop the code to your browser bookmarks. When you find a website you want to send to Telegram, press the button and you can share the URL with your friends on Telegram.