How to send an Embedded Image along with text in a Message via Telegram Bot API

Question

Using Telegram Bot API,

I'm aware that it is possible to send an image via https://core.telegram.org/bots/api#sendphoto

However, how can I embed a remote image into a formatted message?

The message I am looking to send, can be compared to a news article with a title in bold, an image, and a longer text with links. I figured out how to create bold text and links with markdown, but I'm failing at inserting images. How can we do that?

Tepic

As I know , for your SPECIFIC text and image you can only send an image with some text as caption right now( about 200 character) – Reeves

That is what I am fearing. What would be the best way to do a feature request? – Tepic

read this – Reeves

What's most interesting for me is that IMDB's bot actually loads an image and some icons in what appears to be a text message. I will further investigate this and update this question if I'm successful. – Adverse

@Adverse have you discovered how IMDB bot includes icons in text messages or are they simply emojis? The answer below returns me an error telegram.ext.dispatcher - WARNING - A TelegramError was raised while processing the Update. (using v.6.0.3) – Carycaryatid

@fcalderan I have not done it myself, but I'm pretty sure they're just emojis. What you're sending is a standard telegram message. So, if your message text includes for instance: :joy: it should render as an emoji. As for the answer bellow, that is correct. It's only an anchor with no text. The reason for this is because telegram parses the message and if there happens to be a media reference it renders it under. So, using an anchor with no actual text works. Personally, I used ​ as the anchor content. – Adverse

Answer 1

you must set ParseMode in HTML and set your Image Url in A tag like this:

<a href="' + image + '">&#8205;</a>

‍ -> never show in message

Nutrient

also you must set disable_web_page_preview=false – Freehold

can image be a local photo or it must be an URL? – Janinejanis

Answer 2

You can use zero-width space trick. Works for both Markdown and HTML parse mode.

Markdown:

$data = [
    'chat_id'    => $chat_id,
    'parse_mode' => 'markdown',
    'text' => "[​​​​​​​​​​​](https://upload.wikimedia.org/wikipedia/commons/thumb/0/02/Stack_Overflow_logo.svg/200px-Stack_Overflow_logo.svg.png) Some text here.",
];

Result:

Note: The zero-width space is in-between the brackets "[​​​​​​​​​​​]".

Selden

This, as all the other methods I tried, works as long as disable_web_page_preview=false. Brackets with zero width in java is "[\u200B]" – Canyon

Answer 3

Using sendPhoto rather than sendMessage is a cleaner way of achieving this, depending on your use case, for example:

import io
import json
import requests

telegram_bot_token = 'INSERT_TOKEN_HERE'
chat_id = '@INSERT_CHAT_ID_HERE'

bot_url = 'https://api.telegram.org/bot' + telegram_bot_token + '/sendPhoto'
img_url = 'https://upload.wikimedia.org/wikipedia/commons/thumb/0/02/Stack_Overflow_logo.svg/200px-Stack_Overflow_logo.svg.png'

msg_txt = '<b>Stack Overflow Logo</b>'
msg_txt += '\n\nStack Overflow solves all our problems'

payload = {
  'chat_id': chat_id,
  'caption': msg_txt,
  'parse_mode': 'html'
}

remote_image = requests.get(img_url)
photo = io.BytesIO(remote_image.content)
photo.name = 'img.png'
files = {'photo': photo}

req = requests.post(url=bot_url, data=payload, files=files)
response = req.json()
print(response)

Flambeau

Answer 4

Method using <a href=http://.......jpg>..</a> will show preview of the image below the text. Like this:

a href sample

It will look better if you send an image with a caption.

caption sample

Butanol

In your 'caption sample' example , Are there multiple images in a single message ? Could you tell me how you did it ? – Kallick

Oh, 3 portraits look confusing :-) Sorry! Both samples use ONE image. But both are a combination of AN image and text. – Butanol

Answer 5

import requests    
text="testing"    
img="http://imageurl.png"       
r = requests.get('https://api.telegram.org/botyour_token_here/sendMessage?chat_id=@your_channel_here&parse_mode=markdown&text='+"[​​​​​​​​​​​]("+img+")"+text)

Estranged

Answer 6

You should just add captions

bot.send_video(user_id, video, caption='some interesting text')

In our case captions are text. look this image

Nollie

Answer 7

Might be useful for someone. I've managed to send a photo+text+parse_mode (text formatting) this way:

files = {
    'chat_id': id,
    'text': text,
    'photo': open('/root/****/****/*****/photo.jpg', 'rb')
}
url = f'https://api.telegram.org/bot{telegramToken}/sendPhoto?chat_id={id}&caption={text}&parse_mode=HTML'
requests.post(url, files=files)

Selma

Answer 8

I simply made a link to the point in the Java code and sent it as a message with a preview.

"<a href=\"https://avandy-news.ru/*.jpg\">.</a>"

messageService.sendMessageWithPreview(chatId, text, Keyboards.getInfoKeyboard());

public void sendMessageWithPreview(long chatId, String textToSend, ReplyKeyboard keyboard) {
        SendMessage message = new SendMessage();
        message.setChatId(chatId);
        if (textToSend != null && !textToSend.isEmpty()) message.setText(textToSend);
        else return;
        message.enableHtml(true);
        message.setParseMode(ParseMode.HTML);
        if (keyboard != null) message.setReplyMarkup(keyboard);
        executeMessage(message);
}

private void executeMessage(SendMessage message) {
        try {
            execute(message);                
        } catch (TelegramApiException e) {
          ..                
        }
        return null;
    }

Acidify