Nadal pamiętam frustrację, gdy udostępniałem jeden z moich pierwszych wpisów na blogu na Facebooku, tylko po to, by zobaczyć, że wyświetla zupełnie losowy, pikselowany obraz. Po spędzeniu godzin nad treścią, zniechęcające było widzieć, że jest ona źle reprezentowana, zanim ktokolwiek zdążył kliknąć.
Dzieje się tak, gdy strona internetowa nie przekazuje platformom mediów społecznościowych jasnych instrukcji, co należy wyświetlać. Bez tych wskazówek Facebook musi zgadywać, a często zgaduje źle.
Tutaj, na WPBeginner, opanowaliśmy sposób kontrolowania wyglądu naszych udostępnień w mediach społecznościowych za pomocą metadanych Open Graph. W tym przewodniku przeprowadzimy Cię przez sprawdzone metody, których używamy, aby upewnić się, że Twoje treści zawsze wyglądają najlepiej podczas udostępniania.
Możesz użyć poniższych szybkich linków, aby przejść bezpośrednio do metody, która Cię najbardziej interesuje:
- Dodawanie metadanych Open Graph Facebooka za pomocą AIOSEO
- Ustaw metadane Facebook Open Graph za pomocą Yoast SEO
- Dodawanie metadanych Open Graph na Facebooku za pomocą kodu
- Często zadawane pytania dotyczące Facebook Open Graph
- Dodatkowe zasoby dotyczące Facebooka i WordPressa
Ważne: Proszę wybrać tylko jedną z poniższych metod. Używanie wielu wtyczek SEO lub ręczne dodawanie kodu, gdy wtyczka jest aktywna, może spowodować konflikty tagów Open Graph, co może prowadzić do nieoczekiwanych wyników udostępniania. Zalecamy Metodę 1 z użyciem AIOSEO dla najłatwiejszej i najbardziej kompleksowej konfiguracji.
Metoda 1: Dodawanie metadanych Facebook Open Graph za pomocą AIOSEO
All in One SEO to popularny wtyczka WordPress SEO używany przez ponad 3 miliony stron internetowych. Pozwala łatwo zoptymalizować stronę pod kątem wyszukiwarek, a także platform społecznościowych, takich jak Facebook i Twitter.
Najpierw musisz zainstalować i aktywować darmową wtyczkę All in One SEO. Aby uzyskać więcej szczegółów, zapoznaj się z naszym przewodnikiem krok po kroku jak zainstalować wtyczkę WordPress.
Po aktywacji musisz odwiedzić stronę All in One SEO » Social Networks. Tutaj możesz wprowadzić adres URL swojej strony na Facebooku i wszystkich innych sieciach społecznościowych.
Następnie kliknij zakładkę Facebook u góry strony, a zobaczysz, że znacznik Open Graph jest domyślnie włączony.
Możesz kliknąć przycisk „Prześlij lub wybierz obraz”, aby wybrać domyślny obraz Facebook OG, jeśli artykuł nie ma obrazu Open Graph.
Jeśli przewiniesz w dół, możesz dostosować nazwę swojej witryny, opis i inne ustawienia. Nie zapomnij kliknąć niebieskiego przycisku „Zapisz zmiany”, gdy skończysz.
Teraz, gdy ustawiłeś metatagi Open Graph dla całej witryny, następnym krokiem jest dodanie metadanych Open Graph dla poszczególnych postów i stron.
Domyślnie AIOSEO używa tytułu SEO i opisu meta Twojego wpisu jako tytułu i opisu Open Graph. Możesz również ręcznie ustawić miniaturę na Facebooku dla każdej strony i wpisu.
Po prostu edytuj post lub stronę i przewiń w dół do sekcji „Ustawienia AIOSEO” poniżej edytora. Stamtąd przejdź do karty Społecznościowe, a zobaczysz podgląd swojego miniatury.
Tutaj możesz ustawić obraz mediów społecznościowych, a także tytuł i opis.
Wystarczy przewinąć w dół do pola „Źródło obrazu”. Możesz wybrać użycie obrazu wyróżniającego, przesłanie niestandardowego obrazu lub inne opcje.
Metoda 2: Ustaw metadane Facebook Open Graph za pomocą Yoast SEO
Yoast SEO to kolejna wtyczka WordPress SEO, której możesz użyć do dodania metadanych Facebook Open Graph do dowolnej witryny WordPress.
Pierwszą rzeczą, którą musisz zrobić, jest zainstalowanie i aktywowanie wtyczki Yoast SEO. Więcej szczegółów znajdziesz w naszym przewodniku krok po kroku jak zainstalować wtyczkę WordPress.
Po aktywacji dane Facebook Open Graph są domyślnie włączone.
Możesz to sprawdzić, przechodząc do Yoast SEO » Ustawienia i przewijając w dół do sekcji Udostępnianie w mediach społecznościowych. Teraz możesz upewnić się, że funkcja danych Open Graph jest włączona.
Możesz zapisać swoje ustawienia lub kontynuować i skonfigurować inne opcje społecznościowe Facebooka.
Możesz podać identyfikator aplikacji Facebook, jeśli używasz go dla swojej strony na Facebooku i statystyk. Możesz również zmienić tytuł, opis i obraz meta Open Graph swojej strony głównej.
Na koniec możesz ustawić domyślny obraz, który będzie używany, gdy dla posta lub strony nie zostanie ustawiony żaden obraz.
Wersja Premium Yoast SEO pozwala również na ustawienie metadanych Open Graph dla poszczególnych postów i stron. Po prostu edytuj post lub stronę i przewiń w dół do sekcji „Yoast SEO” poniżej edytora.
Z tego miejsca możesz ustawić miniaturę na Facebooku dla tego konkretnego posta lub strony. Jeśli nie ustawisz tytułu lub opisu posta, wtyczka użyje Twojego tytułu i opisu meta SEO.
Teraz możesz zapisać swój post lub stronę, a wtyczka zapisze metadane Facebook Open Graph.
Metoda 3: Dodawanie metadanych Facebook Open Graph za pomocą kodu
Ta metoda zazwyczaj wymaga skopiowania i wklejenia kodu do pliku functions.php Twojego motywu. Zalecamy jednak dodanie kodu za pomocą wtyczki WPCode, która ułatwia i bezpieczniej dodaje niestandardowy kod w WordPress.
WPCode zawiera również bibliotekę gotowych fragmentów kodu, w tym jeden do dodawania podstawowych tagów Open Graph, więc zajmuje to tylko kilka kliknięć.
Najpierw zainstaluj i aktywuj bezpłatny plugin WPCode. Więcej szczegółów znajdziesz w naszym przewodniku jak zainstalować plugin WordPress.
Po aktywacji możesz przejść do Fragmenty kodu » + Dodaj fragment z panelu administracyjnego WordPress.
Wyszukaj fragment „Add basic Open Graph Tags” w bibliotece. Gdy go znajdziesz, najedź na niego kursorem i kliknij przycisk „Użyj fragmentu”.
Następnie WPCode automatycznie doda kod za Ciebie, a także ustawi nagłówek całej witryny jako lokalizację metody wstawiania.
Po tym wszystkim, co musisz zrobić, to przełączyć fragment na „Aktywny” i kliknąć przycisk „Zaktualizuj”. Twój motyw zacznie teraz wyświetlać metadane Facebook Open Graph w nagłówku WordPress.
Jeśli jesteś zaawansowanym użytkownikiem, nadal możesz skopiować i wkleić poniższy kod do pliku functions.php swojego motywu.
Ponieważ wymaga to bezpośredniej edycji plików motywu, upewnij się, że wykonasz kopię zapasową plików motywu przed wprowadzeniem jakichkolwiek zmian.
//Adding the Open Graph in the Language Attributes
function add_opengraph_doctype( $output ) {
return $output . ' xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml"';
}
add_filter('language_attributes', 'add_opengraph_doctype');
//Lets add Open Graph Meta Info
function insert_fb_in_head() {
global $post;
if ( !is_singular()) //if it is not a post or a page
return;
echo '<meta property="fb:app_id" content="Your Facebook App ID" />';
echo '<meta property="og:title" content="' . get_the_title() . '"/>';
echo '<meta property="og:type" content="article"/>';
echo '<meta property="og:url" content="' . get_permalink() . '"/>';
echo '<meta property="og:site_name" content="Your Site Name Goes Here"/>';
if(!has_post_thumbnail( $post->ID )) { //the post does not have featured image, use a default image
$default_image="http://example.com/image.jpg"; //replace this with a default image on your server or an image in your media library
echo '<meta property="og:image" content="' . $default_image . '"/>';
}
else{
$thumbnail_src = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'medium' );
echo '<meta property="og:image" content="' . esc_attr( $thumbnail_src[0] ) . '"/>';
}
echo "
";
}
add_action( 'wp_head', 'insert_fb_in_head', 5 );
Pamiętaj, aby dodać nazwę swojej witryny w wierszu 17, gdzie jest napisane „Your Site Name Goes Here”. Następnie powinieneś zmienić domyślny adres URL obrazu w wierszu 19 na jeden z własnych adresów URL obrazów.
Zalecamy umieszczenie tam obrazu z Twoim logo, więc jeśli Twój post nie ma miniatury, pobierane jest logo Twojej witryny.
Musisz również dodać własny identyfikator aplikacji Facebook w Linii 13. Jeśli nie masz aplikacji Facebook, możesz usunąć Linię 13 z kodu.
Często zadawane pytania dotyczące Facebook Open Graph
Pomogliśmy tysiącom użytkowników skonfigurować ustawienia udostępniania w mediach społecznościowych, a kilka pytań pojawia się dość często. Oto odpowiedzi na najczęstsze pytania dotyczące dodawania metadanych Facebook Open Graph.
1. Jak sprawdzić, czy moje tagi Open Graph działają poprawnie?
Najlepszym sposobem na sprawdzenie tagów jest oficjalne narzędzie Facebooka Debugger udostępniania. Wystarczy wprowadzić adres URL swojego posta lub strony, a narzędzie pokaże podgląd tego, jak będzie wyglądać po udostępnieniu, oraz wymieni wszelkie znalezione błędy lub ostrzeżenia.
2. Jaki jest najlepszy rozmiar obrazu dla obrazu Open Graph na Facebooku?
Aby uzyskać najlepsze rezultaty na wyświetlaczach o wysokiej rozdzielczości, Facebook zaleca używanie obrazów o wymiarach co najmniej 1200 x 630 pikseli. Ważne jest, aby zachować proporcje obrazu 1,91:1, aby zapobiec niezręcznemu przycinaniu obrazu.
3. Dlaczego Facebook pokazuje niewłaściwy obraz, nawet po jego ustawieniu?
Jest to zazwyczaj problem z pamięcią podręczną. Facebook zapisuje dane Open Graph, które po raz pierwszy zobaczy dla danego adresu URL. Jeśli zaktualizujesz obraz, musisz poinformować Facebooka, aby sprawdził ponownie, uruchamiając adres URL przez narzędzie Debugger udostępniania i klikając przycisk „Przeskrob ponownie”.
4. Czy tagi Open Graph wpływają na SEO mojej strony internetowej?
Chociaż tagi Open Graph nie mają bezpośredniego wpływu na rankingi w wyszukiwarkach, mają silny pośredni wpływ. Atrakcyjne i profesjonalnie wyglądające udostępnienia w mediach społecznościowych prowadzą do wyższych współczynników klikalności i większego ruchu, co jest pozytywnym sygnałem dla wyszukiwarek.
Dodatkowe zasoby dotyczące Facebooka i WordPressa
Mamy nadzieję, że ten artykuł pomógł Ci dodać metadane Facebook Open Graph w WordPress. Możesz również zapoznać się z innymi poradnikami dotyczącymi tego, jak możesz używać Facebooka w WordPress:
- Najlepsze wskazówki i samouczki dotyczące Facebooka dla użytkowników WordPressa
- Jak automatycznie publikować na Facebooku z WordPressa
- Jak zainstalować i skonfigurować komentarze na Facebooku w WordPress
- Jak stworzyć niestandardowy kanał Facebooka w WordPress
- Jak wyświetlać recenzje z Twojej strony na Facebooku w WordPressie
- Jak naprawić problem z nieprawidłową miniaturką na Facebooku w WordPressie
- Jak wyświetlić Twitter i Facebook autora na stronie profilu
- Jak stworzyć stronę docelową reklam na Facebooku w WordPress
- Jak naprawić problem z oEmbed na Facebooku i Instagramie w WordPressie
Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube po samouczki wideo WordPress. Możesz nas również znaleźć na Twitterze i Facebooku.
wpbeginner
@SteveJoseph@joshuatj Josh, nie wiem, kiedy ostatnio sprawdzałeś plugin, ale nasz plugin ma pełne wsparcie dla og:description. Jest tam od wersji 0.1.2. Oto dziennik zmian:http://wordpress.org/extend/plugins/facebook-open-graph-meta-in-wordpress/changelog/In w wersji 0.1.3 ulepszyliśmy kod opisu, aby faktycznie szukał kodu opisu pluginu Yoast, a jeśli go nie ma, pobiera fragment posta, jeśli istnieje.
SteveJoseph
@joshuatj Dobry punkt i jeszcze raz dzięki za linki i pomoc. Jestem bardzo wdzięczny. Między Linterem a wtyczką Yoast powinienem sobie poradzić. Wszystkiego dobrego.
joshuatj
@SteveJoseph Albo możesz poczekać, aż Facebook uruchomi swój Lint run.
SteveJoseph
@joshuatj Próbowałem wcześniej linter, ale to naprawiło tylko pierwszy post. Pozostałe nadal wyświetlają starą kopię. Zdałem sobie jednak sprawę, że jeśli sprawdzę każdą unikalną stronę, to pokazuje poprawne informacje, które podałeś powyżej. Denerwujące, ale myślę, że tego będę musiał użyć na razie lub sprawdzić link, który podałeś i zobaczyć, czy ta wtyczka działa dla mnie. Wielkie dzięki, stary! Pozdrawiam.
joshuatj
@SteveJoseph Ups, masz rację, zrobiłem tam literówkę. Miałem na myśli „Yoast”. http://yoast.com/wordpress/seo/But w rzeczywistości Yoast robi więcej niż tylko rozwiązuje problem opisu og, więc może to nie być to, czego chcesz. Użyłem tylko URL Linter (http://developers.facebook.com/tools/lint/) dla Twojej strony. Wydaje się, że wyświetla ten opis „Future Tomorrow to zbiorowy pseudonim online, strona portfolio i blog Steve'a Josepha. Z ponad 14-letnim doświadczeniem twórczym w wielu dyscyplinach i wiedzą, która znacznie wykracza poza „bycie tylko twórcą”, jest wiele do podzielenia się, ale wciąż więcej do nauczenia się.”. Czy tego chcesz w polu opisu? Spróbuj ponownie „udostępnić na Facebooku”?
SteveJoseph
@joshuatj Dziękuję za odpowiedź joshuatj. Niestety wyszukiwanie „Yeost Facebook Plugin” lub „Yeost Plugin” nie przyniosło żadnych pomocnych wyników, które pomogłyby mi znaleźć to możliwe rozwiązanie. Czy masz bezpośredni link?
Próbowałem również wyszukać „Yoast”, myśląc, że mogła być literówka w Twojej odpowiedzi, i to nadal nie doprowadziło mnie do rozwiązania. Będę wdzięczny za wszelką dalszą pomoc. Dziękuję za Twój czas.
joshuatj
@SteveJoseph Nie sądzę, żeby ta wtyczka zajmowała się opisem. Spróbuj Yeost’s?
SteveJoseph
Przepraszam za brak linku – http://futuretomorrow.net/blog/ – kliknij na „share this on Facebook” w dowolnym poście, aby zobaczyć, co się dzieje w szczegółach wizualnych. Jeszcze raz dziękuję.
SteveJoseph
Cześć,
Próbowałem zarówno Twojego wtyczki, jak i metody z kodem i żadna z nich nie zadziałała. Po kliknięciu „udostępnij na Facebooku” z mojego bloga, mój tytuł jest poprawny, adres URL jest poprawny, obraz jest poprawny, ale opis jest stary i nieprawidłowy. Czy jest aktualizacja kodu lub wtyczki, w której opis jest prawidłowo wyświetlany? Z góry dziękuję.
Pozdrawiam,
Steve
joshuatj
Wtyczka jest niesamowita! Dzięki wpbeginner! Jednak byłoby wspaniale, gdybyśmy mogli również dodać zawartość „description” do meta tagu <meta property=”og:description” content=””>
ExpandSM
przepraszam, strona to http://societyofsocialpreneurs.com/blog
ExpandSM
Dzięki za tę wtyczkę! Mam bloga, który jest również stroną Buddypress i nie mogę sprawić, by pobierał fragment posta. Jakieś sugestie?
jaffa
@wpbeginner Dziękuję za odpowiedź.
Zdaję sobie sprawę, że staję się największym utrapieniem na tym wątku i to będzie moje ostatnie pytanie:
Używam funkcji catch that image i tim thumb na mojej stronie i zastanawiałem się, jak lub czy mógłbym zaimplementować to w tej funkcji, aby zastąpić kod, który szuka wyróżnionego obrazu?
Czasami nie używam obrazu wyróżnionego, więc byłoby pomocne, gdyby skrypt mógł po prostu wyszukać pierwszy obraz w poście, a jeśli go nie ma, użyć domyślnego.
Thanks in advance
dbrabyn
@wpbeginner @dbrabyn Rozumiem. Spróbowałem i dla posta bez obrazka wyróżniającego, ale z obrazkiem posta, FB Lint mówi mi: „Adres URL obrazu nie jest zgodny z RFC2396 i nie będzie wyświetlany poprawnie”. Brak domyślnego obrazka również stanowi problem. Dziękuję w każdym razie.
wpbeginner
@jaffa Jeśli nie masz tych meta tagów, a użytkownik POLUBI post za pomocą przycisku „Lubię to” na Twoim blogu (FB wybierze dla niego losowy obrazek)... Teraz, jeśli umieszczą link na swoim profilu na Facebooku (wtedy będą mieli opcję)... W większości przypadków ludzie klikają przycisk „Lubię to”, a następnie faktycznie kopiują link i wklejają go w polu statusu na Facebooku. Ten plugin faktycznie rozwiązuje ten problem.
wpbeginner
@dbrabyn Wtyczka, którą mamy w repozytorium, faktycznie to robi. Szuka wyróżnionego obrazu, a jeśli go nie znajdzie, używa pierwszego obrazu z posta... Fragment w tym poście tego nie robi. Po prostu użyj wtyczki.
jaffa
W końcu udało mi się to uruchomić z pomocą wpbeginner!
Mam jednak pytanie, kiedy udostępniam stronę, która nie ma żadnych obrazów w treści, używany jest domyślny obraz. Czy można określić więcej niż jeden domyślny obraz?
Zauważyłem również, że jeśli udostępniam stronę główną witryny, mam wybór wszystkich obrazów na stronie, z których mogę wybierać, ale podczas udostępniania zwykłej strony jestem zmuszony używać tylko domyślnego. Czy jest sposób, aby zobaczyć wszystkie obrazy na stronie?
Dzięki
dbrabyn
Czy jest jakiś sposób, aby ta funkcja pobierała pierwszy obraz z posta, potem wyróżniony obraz, a potem domyślny obraz? Tak jak robi to get_the_image.
jaffa
@wpbeginner zrobię to!
Thank you so much
wpbeginner
@jaffa Jeśli wyślesz nam e-mail za pomocą formularza kontaktowego, na pewno sprawdzimy to i pomożemy Ci to uruchomić.
jaffa
@wpbeginner Nie chodzi o to, że nie jestem zadowolony z artykułu, po prostu nie mogę go uruchomić. Zawsze odwiedzam tę stronę, ponieważ bardzo mi pomogła i pozwoliła mi wiele nauczyć się o wp.
Nie mogłem sprawić, by opengraph zadziałał, a potem zacząłem szukać gdzie indziej w internecie, co doprowadziło mnie do innych artykułów, które tylko mnie naprawdę zdezorientowały. Wróciłem tutaj, żeby spróbować ponownie. Być może zrobiłem coś nie tak, albo coś jest nie tak w moim motywie, co uniemożliwia jego działanie. Tak właśnie miałem na myśli mówiąc „rozwiążę to”.
Doceniam wasze odpowiedzi i pomoc.
Dziękuję.
wpbeginner
@jaffa Nie potrzebujesz aplikacji, jeśli jej nie chcesz. Nadal możesz pobierać analizy dla swoich przycisków „Lubię to” za pośrednictwem swojego osobistego konta. Nie ma nic do rozgryzienia, ponieważ artykuł wyjaśnia wszystko, ale jeśli nadal nie jesteś zadowolony, to oczywiście przeprowadź dalsze badania.
jaffa
@wpbeginner ok, dzięki!
Inne artykuły sugerowały, że potrzebna jest aplikacja, dlatego byłem zdezorientowany. Nieważne, jakoś sobie poradzę.
wpbeginner
@jaffa NIE MUSISZ tworzyć aplikacji na Facebooku do tego tutorialu. Zadziała niezależnie. Mamy aplikację na naszej stronie z innych powodów, które nie mają związku z tutorialem wspomnianym w tym artykule…
jaffa
@wpbeginner dziękuję za odpowiedź. Byłem bardzo zdezorientowany :s
Czy muszę utworzyć aplikację na Facebooku, aby ten open graph działał poprawnie? Sprawdziłem kod źródłowy tej strony i macie pole ‘fb:app_id’, którego nie ma w powyższym kodzie?
Przepraszam za wszystkie pytania, jeśli ktoś może skierować mnie do jakiejś dokumentacji dotyczącej open graph, chętnie spróbuję znaleźć jakieś odpowiedzi i wrócę, aby podzielić się wszelkimi informacjami, które znajdę.
Dzięki
wpbeginner
@jbjb3077 Look at our article about showing custom fields anywhere on the site. Custom Fields 101 article covers that on our site
wpbeginner
@jaffa To nie to samo co identyfikator aplikacji… Twój osobisty identyfikator użytkownika jest inny.
jaffa
to może wydawać się bardzo głupim pytaniem, ale aby to zadziałało, czy musisz najpierw utworzyć aplikację na Facebooku? Mam tylko zwykłą stronę na Facebooku i nic więcej i próbowałem tego kodu wiele razy, ale nadal nie mogę go uruchomić. Kiedy uruchamiam go przez narzędzie linter, otrzymuję błąd: nieprawidłowe identyfikator aplikacji.
Czy podany powyżej przykład ID użytkownika jest taki sam jak ID aplikacji, czy nie?
jbjb3077
@jbjb3077 proszę sprawdź to….
mark.bravura
Jeszcze raz dziękuję za szybką odpowiedź. I to jest sedno mojego pytania… wtyczka Facebook Open Graph Meta For WordPress pobiera wszystkie metadane poprawnie, z wyjątkiem braku danych dotyczących fragmentu/opisu. Dlatego zastanawiam się, jak to ręcznie dostosować. Jakieś sugestie?
wpbeginner
@mark.bravura Tytuł Twojego posta jest pobierany jako tytuł. Fragment Twojego posta jest pobierany jako opis. Twój wyróżniony obraz (miniatura) jest pobierany jako miniatura. Zmodyfikuj którykolwiek z nich, a będziesz mógł zmodyfikować dane og.
mark.bravura
Dziękuję za szybką odpowiedź. Czy istnieje rozsądnie prosty sposób na ręczne dostrojenie (dostęp/modyfikację) danych OG?
wpbeginner
@mark.bravura Informacja jest faktycznie już przechowywana w Twojej bazie danych. Ta wtyczka jedynie ją wyświetla.
mark.bravura
Cześć,
Podczas używania wtyczki OG meta data, w którym pliku PHP są przechowywane tagi? Dzięki!
Liverpoolfcblog
Witaj wpbeginner @wpbeginner , kod działa poprawnie. Dzięki za to.
Mam tylko jedno pytanie. Przetestowałem poszczególne artykuły za pomocą narzędzia do sprawdzania Facebooka i wszystkie wyglądały dobrze. Jednak po przetestowaniu mojej strony głównej pojawia się komunikat:
Brak wymaganego pola og:title
Brak wymaganego pola: og:type jest wymagane
Brak wymaganego pola: og:url jest wymagane
Brak wymaganego pola og:image jest wymagane
Zauważyłem to w kodzie: if ( !is_singular()) //jeśli nie jest to wpis ani strona return;
Czy dodanie powyższych czterech elementów wpływa na to, jak Facebook widzi moją stronę? Na przykład, czy skategoryzuje ją jako stronę internetową i wyświetli tytuł?
Pozdrawiam.
Personel redakcyjny
Możesz usunąć element is_singular i pokazać to na stronie głównej… Większość, jeśli nie wszystkie blogi WordPress są udostępniane tylko ze strony pojedynczego wpisu. To jest również strona, na której przycisk Like jest widoczny.
Admin
jbjb3077
witajcie, moje obrazy postów są w niestandardowym polu (miniaturka) miałem hacka z poprzednią wersją, ale teraz nie mogę rozgryźć, jak to dodać. proszę o pomoc. oto kod, który zastąpiłem
if ( get_post_meta($post->ID, ‘thumb’, true) ) { //post ma obrazek wyróżniony $thumbnail_src = get_post_meta($post->ID, “thumb”, true); echo ‘<meta property=”og:image” content=”‘ . esc_attr( $thumbnail_src[0] ) . ‘”/>’; } else{ echo ‘<meta property=”og:image” content=”mysite image in a path.jpg”/>’; } echo “n”;
Danny Foo
Nadal mam problem z miniaturkami, nawet po zastosowaniu metody funkcji.
Przy okazji, czy musisz zaktualizować xmlns:og? Dokumentacja Facebooka dotycząca opengraph podaje ją jako: http://ogp.me/ns#
Nurul Imam
Dziękuję… Udało mi się dodać tę funkcję do mojego motywu
jaffa
@Elliot – Motyw obsługuje miniatury postów, używam motywu potomnego Twenty Ten
Dodałem tutaj kopię kodu z pliku functions.php, aby dodać obsługę miniatur;
http://pastebin.com/7Cw480Xy
Może zrobiłem coś źle?
jaffa
Dzięki Daniel, dodanie tego pomogło usunąć błędy, które otrzymywałem wcześniej, ale teraz informuje mnie, że brakuje tytułu, adresu URL, obrazu i typu, mimo że są obecne.
Pokazuje również zły obraz, wydaje się, że nie pobiera obrazu z artykułu, a raczej losowy obraz ze strony.
Nie mam pojęcia, dlaczego to nie działa, chciałem uniknąć używania wtyczki, ale może to jest droga, którą muszę pójść.
Dzięki chłopaki za pomoc.
Daniel Chenery
Oh! I have that issue too. I popped the info in my header.php, lint the homepage = Works
Link a post page = Broken
I just gave up and ignored it!
jaffa
Dziękuję Danielu za próbę pomocy.
Myślę, że też będę musiał się poddać, nie mogę marnować całego czasu na to.
Byłoby fajnie, gdyby to u mnie zadziałało.
Elliott the web design guy
Zakładam, że ponownie przeskanowałeś go narzędziem do sprawdzania kodu przed ponownym testowaniem, czy umieściłeś kod w swoim pliku functions.php lub header.php?
jaffa
Tak, zastosowałem się do Twojej rady i użyłem narzędzia linter, ale nadal bez powodzenia.
I umieściłem kod w pliku functions.php.
Elliott the web design guy
Czy Twój motyw obsługuje miniatury postów?
jaffa
Dodałem kod do mojego pliku functions, a następnie postępowałem zgodnie z Twoim artykułem o tym, jak dodać przycisk Like i Send, i wszystko wydawało się w porządku, ale dzisiaj, gdy mój klient opublikował link na ścianie FB do najnowszego artykułu, nie było opcji wyboru obrazu, który towarzyszyłby artykułowi.
Nie rozumiem, co poszło nie tak ani jak to naprawić. Zakładam, że to kod FB, który dodałem, spowodował ten problem, ponieważ nie wprowadziłem żadnych innych zmian.
Czy masz jakieś pomysły, co może być problemem?
Personel redakcyjny
Tak, usuwa opcję wyboru obrazów... Kod sam wybiera OBRAZ. Wybiera miniaturę posta i wysyła ją jako obraz dla tego artykułu.
Admin
jaffa
Dziękuję za odpowiedź.
Nie zdawałem sobie sprawy, że ta opcja została usunięta. Ale nadal nie rozumiem, dlaczego miniatura nie została wyświetlona, mimo że ją dodałem. Po prostu nie było tam żadnego obrazu.
Kiedy przeglądam źródło, widzę link do obrazu w polu og:image.
Chciałbym, żeby to zadziałało, może będę musiał spróbować z wtyczką.
Jeszcze jedna rzecz, zdefiniowałem w moim motywie kilka różnych rozmiarów miniatur, których używam w różnych miejscach, więc zamiast wywoływać obrazek w rozmiarze „medium”, czy muszę ustawić go tak, aby wywoływał jedną z moich zdefiniowanych miniatur??
Przepraszam za długi i zagmatwany komentarz, jestem nowy!
Elliott the web design guy
Facebook will scrape your site every 24hrs or so… so if you’ve made any changes on your site facebook will need to catch up – 24hrs or so later. But, you can force facebook to re-scrape your site by using the linter tool. Before testing the Send button again run anyone of your url’s through http://developers.facebook.com/tools/lint/ to force Facebook to refresh the details, hopefully this should resolve the image issue
jaffa
Dziękuję Elliott, narzędzie Linter, do którego podałeś link, było bardzo pomocne.
Po przepuszczeniu przez to adresu URL, otrzymałem komunikat o błędzie:
pole fb:admins zawierało nieprawidłowe identyfikatory, zauważyłem, że mój identyfikator strony ma 15 znaków, podczas gdy ten użyty w powyższym przykładzie ma tylko 10.
Druga wiadomość, którą otrzymałem, brzmiała:
Umieściłeś App ID w polu fb:admins. Powinno być w fb:app_id
Czy w powyższym kodzie powinno być dodatkowe pole dla app_id?
Jestem teraz lekko zdezorientowany...
Daniel Chenery
@Jaffa Musisz dodać
Powinno pomóc.
Daniel Chenery
Przepraszam, myślałem, że tag
codezachowa tagi, ale okazuje się, że nie. Pozwól, że spróbuję opublikować to ponownie<meta property=”fb:app_id” content=”Your_App_ID”/>
<meta property=”fb:admins” content=”Your_Profile_ID”/>
Gretchen
Nie widzę pola dla domyślnego obrazka – tylko dla ID i nazwy witryny. Czy czegoś mi brakuje?
Personel redakcyjny
Zaktualizowaliśmy wtyczkę, aby naprawić błąd z domyślnym obrazem. Teraz sprawdza, czy Twój post ma miniaturę… Jeśli nie, wybiera pierwszy obraz z Twojego posta. Planujemy wkrótce przywrócić funkcję domyślnego obrazu.
Admin
Gretchen
Dobrze! Zdecydowanie podoba mi się funkcja domyślnego obrazu, ponieważ nie wszystkie moje posty mają obrazy.
Dzięki za świetny plugin!
Ayanna Mitchell
Zainstalowałem wtyczkę… ale nie ma miejsca na dodanie domyślnego obrazka. Proszę o pomoc.
Personel redakcyjny
Spójrz na naszą odpowiedź dla Gretchen.
Admin
Ovidiu
I am curios about this part of the code: add_opengraph_doctype the problem is that that function doesn’t seem to do anything on my install
the rest is working fine but this add_opengraph_doctype doesn’t.
czy jest to konieczne i dlaczego uważasz, że moje motywy tego nie wyzwalają?
Personel redakcyjny
Nic się nie stanie, jeśli Twój motyw nie zawiera standardowego kodu (atrybutów językowych), który powinien zawierać każdy motyw WordPress.
Admin
Ovidiu
Brakuje mi uwzględnienia tego kodu: `’ xmlns:og=”http://opengraphprotocol.org/schema/” xmlns:fb=”http://www.facebook.com/2008/fbml”‘`
mój header.php ma na górze:
`
`
co jest z tym nie tak? czego mi brakuje?
Ovidiu
ok, wygląda na to, że jest filtrowane… oto link do pastebin: http://pastebin.com/vrsVzFhU
Sheryl
Zainstalowałem wtyczkę open graph do WordPressa. Skonfigurowałem ustawienia, zamieniając nazwę mojej firmy na nazwę z adresu URL, który podałeś.
No i co?? Co mam zrobić, żeby przycisk wysyłania znalazł się pod moim przyciskiem lubię to?
Personel redakcyjny
Spójrz na nasz artykuł o przycisku wysyłania. Możesz również użyć naszego wtyczki SmartSharing.
Admin
Thnok
Gdzie mam dodać kod w functions.php? Na górze czy gdzie?
Wtyczka nie działa.
Preston
To świetnie. Czy są jakieś wskazówki, jak to zmodyfikować, aby Facebook pobierał fragment z napisanego tekstu? Wtyczka nie pobiera treści, ale pobiera imię autora, kategorie i datę. Myśli?
Elliott the web design guy
tak, po prostu dodaj to po pierwszym poleceniu if:
echo ‘<meta property="og:description" content="” />’;
Preston
Próbowałem dodać ten kod i otrzymałem krytyczny błąd, który wyłączył wtyczkę. Nie mogę rozgryźć dlaczego.
Elliott the web design guy
wygląda na to, że komentowanie nie pozwala na pewne znaczniki, obserwuj mnie na Twitterze, a prześlę Ci kod.
Treść powinna zawierać funkcję wp the_excerpt()
Gretchen
Zakładam, że jeśli mamy stronę na Facebooku dla witryny, wprowadzimy identyfikator użytkownika strony, a nie naszego osobistego profilu na Facebooku?
Chris Bracco
Ten kod dodaje tagi OG tylko do pojedynczych postów i stron. Chciałbym, aby tagi pojawiały się na wszystkich moich stronach i nie mogę znaleźć prostego sposobu, aby to osiągnąć. Jakieś pomysły?
Personel redakcyjny
Masz indywidualne przyciski polubienia / wysłania na stronach archiwum, kategorii, tagów??? Przyciski polubienia są dobre tylko na pojedynczych postach / stronach, dlatego kod je dodaje. Jedynym innym przyciskiem polubienia dodanym na stronie jest (Like Box) dla strony Facebookowej witryny. Który nie wymaga tych informacji.
Ale jeśli musisz, usuń warunek !is_singular.
Admin
Daniel Chenery
Z pewnością wydaje się łatwiejsze po prostu wkleić informacje do header.php? Jestem pewien, że kiedyś czytałem poradnik na ten temat.
Personel redakcyjny
Możesz zakodować to na stałe w header.php, ale jest to proces wieloetapowy, ponieważ musisz edytować doctype, a następnie dodać inne meta tagi… To jest proces jednoetapowy. Wklej i gotowe. Lub zainstaluj wtyczkę i gotowe. Jeśli używasz wtyczki, to masz jeszcze lepiej, ponieważ tagi pozostają nawet po zmianie motywów.
Admin