Wdrożenie Open Graph w systemie Joomla#
Data: 2015-10-01 18:24:38
Informacja
Ten artykuł jest archiwalny i dotyczy technologii już dawno wycofanych. Jest prezentowany w celach edukacyjno-informacyjnych.
Z artykułu dowiesz się o podstawowej rzeczy dla współczesnej optymalizacji stron, czyli jak szybko i poprawnie wdrożyć Open Graph. Są to dane strukturalne Facebook’a zaprojektowane tak, aby można było włączyć zewnętrzne treści w kontekst Social Graph, czyli sieci danych semantycznych udostępnianych i łączonych w Internecie. Dane strukturalne Open Graph pozwalają oznaczyć jednostkę treści tak, aby była możliwa do prezentacji w sieciach społecznościowych - innymi słowy indeksacji.
Od wersji Joomla 3 dane strukturalne są wbudowane w kod źródłowy. W komponencie K2 mamy do czynienia z danymi strukturalnymi od dłuższego czasu. Bywa jednak, że przy wykorzystaniu własnych szablonów nieumiejętnie wycinamy możliwość prezentacji danych semantycznych i odpowiedniej segmentacji treści dla sieci społecznościowych. Ma to niebagatelne znaczenie dla SEO gdzie od 2013 roku (mówić w dużym uproszczeniu) to akcent został postawiony właśnie na sieci społecznościowe i wszystkie dane musiały zostać uzgodnione z nowymi wymogami.
Aby wdrożyć dane strukturalne musisz wkleić poniższy kod w katalogu szablonu /html/com_content/article/default.php ewentualnie w pliku który definiuje dany widok.
// OPEN GRAPH CODE
// URL
$cur_url = (!empty($_SERVER[«HTTPS»])) ? „https://”.$_SERVER[«SERVER_NAME»].$_SERVER[«REQUEST_URI»] : „http://”.$_SERVER[«SERVER_NAME»].$_SERVER[«REQUEST_URI»];
$cur_url = preg_replace(«@%[0-9A-Fa-f]@mi»”>2}@mi»;, «», htmlspecialchars($cur_url, ENT_QUOTES, «UTF-8»));
// OpenGraph
$template_config = new JConfig();
$uri = JURI::getInstance();
$article_attribs = json_decode($this->item->attribs, true);
$pin_image = «»;
$og_title = $this->escape($this->item->title);
$og_type = «article»;
$og_url = $cur_url;
if (version_compare( JVERSION, «1.8», «ge» ) && isset($images->image_fulltext) and !empty($images->image_fulltext)) else {
$og_image = «»;
preg_match(«/src=”([^”]*)”/», $this->item->text, $matches);
if(isset($matches[0]))
}
$og_site_name = $template_config->sitename;
$og_desc = «»;
if(isset($article_attribs[«og:title»]))
$doc = JFactory::getDocument();
$doc->setMetaData( «og:title», $og_title );
$doc->setMetaData( «og:type», $og_type );
$doc->setMetaData( «og:url», $og_url );
$doc->setMetaData( «og:image», $og_image );
$doc->setMetaData( «og:site_name», $og_site_name );
$doc->setMetaData( «og:description», $og_desc );
$useDefList = (($params->get(«show_author»)) or ($params->get(«show_category»)) or ($params->get(«show_parent_category»))
or ($params->get(«show_create_date»)) or ($params->get(«show_modify_date»)) or ($params->get(«show_publish_date»))
or ($params->get(«show_hits»)));
Aby dane strukturalne pojawiały się poprawnie należy odpowiednio przygotować artykuł Joomla.
Jak należy przygotować artykuł, aby poprawnie wyświetlał Open Graph?
- artykuł powinien mieć wpisany DESCRIPTION - meta, który będzie parametrem OG:DESCRIPTION
- artykuł powinien mieć dodany obrazek ILUSTRACJA WPROWADZENIA i ILUSTRACJA PEŁNEGO TEKSTU - to będzie obrazek OG:IMAGE - warto wspomnieć, że ten obrazek wcale nie musi się pojawiać na stronie i można go wyciąć przez CSS - czyli co innego możemy pokazywać w danych semantycznych dla społecznościówek, a co innego na stronie WWW
- artykuł powinien mieć TEKST WPROWADZENIA /id="system-readmore"
- warto zaznaczyć, że OPEN GRAPH to co innego niż SCHEME Google, gdzie dane strukturalne przypisane są do znaczników HTML, natomiast w przypadku OPEN GRAPH dane mamy w nagłówku HTML