Po utworzeniu i opublikowaniu postu społecznościowego w HubSpot, odpowiednia sieć społecznościowa podejmie próbę wygenerowania podglądu obrazu dla Twojego postu. Na podstawie wprowadzonego linku do posta sieć społecznościowa przeskanuje metatagi w kodzie źródłowym strony i przeszuka plik robots.txt witryny.
Jeśli hostujesz swoją witrynę u zewnętrznego dostawcy, takiego jak WordPress, a podgląd posta nie pojawia się zgodnie z oczekiwaniami, postępuj zgodnie z poniższymi instrukcjami.
Plik robots.txt informuje wyszukiwarki o sposobie indeksowania witryny. Jeśli nie dodałeś lub nie skonfigurowałeś poprawnie pliku robots.txt, sieci społecznościowe nie będą w stanie przeanalizować zawartości Twoich stron. Facebook i X udostępniają ciągi agenta użytkownika, które należy dodać do pliku robots.txt:
User-agent: facebookexternalhit
Disallow:
User-agent: Twitterbot
Disallow:
LinkedIn nie udostępnia dokumentacji dotyczącej ciągów agenta użytkownika, ale możesz użyć inspektora postów LinkedIn, aby potwierdzić, czy LinkedIn może indeksować zawartość Twojej witryny.
Wyszukiwarki i sieci społecznościowe analizują sekcję nagłówka kodu HTML w poszukiwaniu metadanych potrzebnych do wygenerowania podglądu strony. Metadane dla Facebooka i X należy umieścić po głównych metatagach:
<!-- Primary Meta Tags -->
<title>Meta Tags — Preview, Edit and Generate</title>
<meta name="title" content="Meta Tags — Preview, Edit and Generate">
<meta name="description" content="With Meta Tags you can edit and experiment with your content then preview how your webpage will look on Google, Facebook, Twitter and more!">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://example.com">
<meta property="og:title" content="Title of your Website Page">
<meta property="og:description" content="Description of your Website Page">
<meta property="og:image" content="https://example.com/image.png">
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://example.com/">
<meta property="twitter:title" content="Title of your Website Page">
<meta property="twitter:description" content="Description of your Website Page">
<meta property="twitter:image" content="https://example.com/image.png">Wypełnij atrybuty treści dla każdego z powyższych metatagów odpowiednimi wartościami dla swojej strony. Metatagi można zweryfikować za pomocą narzędzia debuggera Facebooka, walidatora kart X i inspektora postów LinkedIn.
Jeśli wyróżniony obraz dla wstawionego linku nie wyświetla się poprawnie w podglądzie społecznościowym (np. obraz jest obcięty lub proporcje są nieprawidłowe), może być konieczne edytowanie obrazu, aby miał odpowiednie wymiary dla sieci społecznościowej, w której publikujesz, a następnie ponowne opublikowanie strony. Jeśli publikujesz na Facebooku, możesz dowiedzieć się więcej o ich wymaganiach dotyczących wyróżnionego obrazu w ich dokumentacji.
Poniższe wymiary są zalecane do optymalizacji wyróżnionego obrazu w każdej sieci:
Upewnij się, że wszelkie multimedia zawarte w postach społecznościowych są zgodne z wytycznymi dotyczącymi rozmiaru plików dla każdej sieci. Jeśli HubSpot stwierdzi, że plik jest zbyt duży, aby opublikować go w określonej sieci, zostanie wyświetlone ostrzeżenie. Maksymalne rozmiary plików dla każdej sieci społecznościowej są wymienione poniżej:
Osadzone profile kolorów mogą wpływać na sposób wyświetlania wyróżnionego obrazu w poście społecznościowym. Różne systemy przetwarzają nietypowe profile kolorów na różne sposoby, dlatego kolory mogą wyglądać inaczej podczas podglądu obrazu w menedżerze plików. Możesz uruchomić adres URL obrazu za pomocą zewnętrznego narzędzia , aby sprawdzić, czy używa on nietypowego profilu kolorów. W razie potrzeby można usunąć zakłócający profil kolorów w narzędziu do edycji zdjęć, takim jak Photoshop, a następnie ponownie opublikować stronę przed opublikowaniem postów społecznościowych.
Menedżer plików HubSpot wykorzystuje kompresję obrazu w plikach JPEG i PNG, aby pomóc zoptymalizować szybkość ładowania treści hostowanych przez HubSpot. Sieci społecznościowe również używają kompresji obrazu w postach, które mogą różnić się jakością od tego, co widzisz w HubSpot. Z tego powodu zaleca się używanie obrazów o stosunkowo wysokiej rozdzielczości (w zalecanych proporcjach) dla każdej sieci. Jeśli obraz nie spełnia wymagań sieci społecznościowej, w narzędziu do publikacji społecznościowej HubSpot pojawi się ostrzeżenie, które pomoże odpowiednio dostosować obraz.
Jeśli nadal napotykasz problemy z nieprawidłowym wyświetlaniem podglądu linków, zapoznaj się z naszym przewodnikiem rozwiązywania problemów.