Intereting Posts
Как установить минимальный и максимальный размер для ImageView в Android Android: недопустимое использование SingleClientConnManager: соединение по-прежнему выделено WakeLock финализировалась, хотя все еще была ошибка, хотя я ее выпускаю Служба специальных возможностей отключена при каждом запуске отладки Экземпляр эмулятора Gingerbread намного более вялый, чем Froyo и ниже. Зачем? Использование плагинов с CLI Как явно выполнять сборку мусора Создание навигационной панели исчезает в Xamarin.Forms Какова роль «isViewFromObject (View view, Object object)» в FragmentStatePagerAdapter? Диалоговое взаимодействие с панелью действий Android Alarm Manager с широковещательным приемником, зарегистрированным в коде, а не манифестацией SetAdapter "Для вызова требуется уровень API 11 (текущий мин – 8): android.widget.AbsListView # setAdapter"? Рекомендации по обработке событий пользовательского интерфейса NullPointerException addToRequestQueue (com.android.volley.Request, java.lang.String) 'на ссылке нулевого объекта Фильтр нижних частот Android и фильтр высоких частот

Отображение миниатюры для ссылки в WhatsApp || Og: метатег изображения не работает

Пытался следовать этому вопросу: предоставить изображение для обмена ссылками whatsapp

Введите описание изображения здесь

Я создал простую HTML-страницу с основными метатегами Facebook:

<!--FACEBOOK--> <meta property="og:title" content="San Roque 2014 Pollos" /> <meta property="og:description" content="Programa de fiestas /> <meta property="og:image" content="http://pollosweb.wesped.es/programa_pollos/play.png" /> 

Facebook linter проверяет правильность, и в Facebook он показывает отлично, но когда я пытаюсь поделиться WhatsApp, изображение не отображается.

Я пробовал это на WhatsApp на Android

→ Это URL-адрес примерной веб-страницы

Solutions Collecting From Web of "Отображение миниатюры для ссылки в WhatsApp || Og: метатег изображения не работает"

Я верю, что вам нужно добавить itemprop в itemprop og:image , размер изображения установлен на 256x256 а также не повредит добавлению site_name , type и updated_time либо 🙂

 <meta property="og:site_name" content="San Roque 2014 Pollos"> <meta property="og:title" content="San Roque 2014 Pollos" /> <meta property="og:description" content="Programa de fiestas" /> <meta property="og:image" itemprop="image" content="http://pollosweb.wesped.es/programa_pollos/play.png"> <meta property="og:type" content="website" /> <meta property="og:updated_time" content="1440432930" /> 

Вы можете увидеть эти метатеги в действии, например, в Google Maps .
После того, как вы изменили метатеги, вам может потребоваться некоторое время, чтобы обновить возможные кеши.

Вы можете отлаживать / проверять метатеги Open Graph от Facebook Debugger
Если вы можете увидеть все свои теги, то сайты / приложения, в которых ваши теги не отображаются должным образом, могут иметь разные требования для тегов Open Graph.

РЕДАКТИРОВАТЬ:
Если вы укажете изображение по ссылке HTTP-Secure , вам нужно использовать og:image:secure_url вместо og:image .

EDIT2:
Вам также нужно указать og:type поскольку это один из четырех базовых требуемых параметров.
<meta property="og:type" content="website" /> должен помочь вам в правильном направлении.

Я нашел решение здесь Whatsapp Preview link, опубликованное 2 марта 16

И вы должны увидеть работу до и после скриншота

Введите описание изображения здесь

Существует два типа кода. Первая метаограмма: изображение внутри <head>

 <meta property="og:image" content="url_image"> 

Миниатюрная схема из schema.org внутри <body>

 <link itemprop="thumbnailUrl" href="url_image"> <span itemprop="thumbnail" itemscope itemtype="http://schema.org/ImageObject"> <link itemprop="url" href="url_image"> </span> 

Надеюсь, эта помощь. Благодарю.

У меня была такая же проблема, и проблема была в размере картинки. Whatsapp не поддерживает изображение размером более 300 КБ.

Поэтому самым важным свойством для отображения изображения на Whatsapp является:

 <meta property="og:image" content="url_image"> 

И размер изображения для отображения должен быть меньше 300 КБ

Для всех, все еще имея эту проблему, и для меня ни один из опубликованных решений не разработан.

У меня была аналогичная проблема. Изображение отображалось правильно во всех других диалоговых окнах share. Только WhatsApp не смог отобразить изображение, даже если отладчик facebook правильно использует тег og: image.

Решение, которое сработало для меня: я использую firebase. Для загруженного контента в хранилище вы получаете уникальный URL-адрес загрузки с медиа-токеном. Что-то вроде:

https://firebasestorage.googleapis.com/v0/b/XXXX.XXXXXXX.com/ ? Alt = media & token = YYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYY

Я использовал этот URL в метатеге og: image. Он работал на Facebook и т. Д., Но похоже, что WhatsApp не смог загрузить изображение с этого URL-адреса. Вместо этого вам нужно включить изображение в каталог проекта и использовать эту ссылку для тега og: image. Теперь он корректно работает и в WhatsApp.

Прежде чем (не работает в WhatsApp, но facebook и т.д.)

 <meta property="og:image" itemprop="image" content="https://firebasestorage.googleapis.com/v0/b/XXXX.XXXXXXX.com/your_image?alt=media&token=YYYYYYYY-YYYYYYYYYY-YYYYYYYYYYYYY"> 

После (теперь работает во всех проверенных общих диалогах, включая WhatsApp)

 <meta property="og:image" itemprop="image" content="https://domain_name/path_to_image"> 

Надеюсь, это может помочь некоторым из вас 🙂

Вам нужно только ввести сообщение с «http: //» в начале. Например: http://www.google.com показывает миниатюру, но http://www.google.com нет.

В ответ на https://stackoverflow.com/a/35785393/1518500

Попробуйте обновленную версию для schema.org

 <span itemprop="image" itemscope itemtype="http://schema.org/ImageObject"> <link itemprop="url" href="imgurlHere"> <meta itemprop="width" content="1200"> <meta itemprop="height" content="800"> </span> 

Или используя формат json-ld из Google

 <script type="application/ld+json"> { "@context": "http://schema.org/", "@type": "ImageObject", "url": "ImgURLhere", "height": 800, "width": 1200 } </script> 

Я задокументировал идеальное подробное решение здесь – https://amprandom.blogspot.com/2016/12/blogger-whatsapp-rich-link-preview.html. Чтобы получить идеальный предварительный просмотр, нужно сделать семь шагов.

  1. Заголовок: добавьте ключевое слово с богатым заголовком на свою веб-страницу с максимум 65 символами.

  2. Meta Описание: Опишите вашу веб-страницу не более 155 символов.

  3. Og: название: не более 35 символов.

  4. Og: url: Полная ссылка на адрес вашей веб-страницы.

  5. Og: description: Максимум 65 символов.

  6. Og: image: Рекомендуется использовать изображение (JPG или PNG) размером менее 300 КБ и минимальный размер 300 х 200 пикселей.

  7. Favicon: Маленькая иконка размером 32 x 32 пикселя.

На приведенной выше странице указаны требуемые спецификации, лимит символов и теги образцов. Сделайте upvote, как только вы найдете это удовлетворительным.

Я надеюсь, что эта помощь:

 <meta property="og:title" content="Title goes here"> <meta property="og:site_name" content="Site name"> <meta property="og:image" content="imageURLShouldBeFromSameDomainName"> <meta property="og:image:width" content="640"> <meta property="og:image:height" content="300"> 

Обратите внимание на imgURL, который должен быть размещен в одном домене, или он не будет отображаться на whatsapp. Я попытался загрузить URL-адрес с amazon, предварительный просмотр изображений не работает.