Como Exibir Gráficos do Google no WordPress

Você quer exibir gráficos do Google no WordPress? Nosso snippet criará um novo shortcode que aproveita a API de gráficos do Google. Este shortcode permitirá que você exiba uma variedade de gráficos, como linhas, xyline, sparkline, medidor, dispersão, venn, pie e pie2d.

Instruções:

Tudo o que você precisa fazer é adicionar este código ao arquivo functions.php do seu tema ou em um plugin específico do site:

function google_chart_shortcode( $atts ) {
	extract(shortcode_atts(array(
	    'data' => '',
	    'size' => '400x180',
	    'colors' => '',
	    'title' => '',
	    'labels' => '',
	    'type' => 'pie',
	    'advanced' => ''
	), $atts));
 
	switch ($type) {
		case 'line' :
			$charttype = 'lc'; break;
		case 'xyline' :
			$charttype = 'lxy'; break;
		case 'sparkline' :
			$charttype = 'ls'; break;
		case 'meter' :
			$charttype = 'gom'; break;
		case 'scatter' :
			$charttype = 's'; break;
		case 'venn' :
			$charttype = 'v'; break;
		case 'pie' :
			$charttype = 'p3'; break;
		case 'pie2d' :
			$charttype = 'p'; break;
		default :
			$charttype = $type;
		break;
	}
 
	if ($title) $string .= '&chtt='.$title.'';
	if ($labels) $string .= '&chl='.$labels.'';
	if ($colors) $string .= '&chco='.$colors.'';
	$string .= '&chs='.$size.'';
	$string .= '&chd=t:'.$data.'';
 
	return '<img title="'.$title.'" src="http://chart.apis.google.com/chart?cht='.$charttype.''.$string.$advanced.'" alt="'.$title.'" />';
}
add_shortcode('chart', 'google_chart_shortcode');

Veja o exemplo de shortcode abaixo de um gráfico de pizza 3D. Altere o atributo type em seu shortcode para especificar o tipo de gráfico que você deseja exibir.

[chart data="41,37.89,10.67,2.03" labels="Reffering+sites|Search+Engines|Direct+traffic|Other"  colors="ff0000,005599,fff000,000000" size="488x200" title="Traffic  Sources" type="pie"]

Observação: Se esta é a primeira vez que você adiciona trechos de código no WordPress, consulte nosso guia sobre como copiar/colar trechos de código corretamente no WordPress, para não quebrar acidentalmente seu site.

Se você gostou deste snippet de código, considere conferir nossos outros artigos no site, como: Melhores Construtores de Páginas para WordPress (Comparados).