Mungkin beberapa diantara kalian pernah melihat di beberapa situs ada title atau judul sebuah artikel mempunyai 2 warna yang berbeda, bagaimanakah membuat 2 warna yang berbeda pada title tersebut di wordpress, berikut saya akan memberikan tutorial trik membuat 2 warna pada title yang saya letakkan di single artikel seperti blog saya ini.

Tambahkan kode dibawah ini pada fungtion.php

/*-------*/
/* Dua Warna Title
/*-------*/
function add_span_to_title($input_content)
{
  if(str_word_count($input_content) > 3)
	{
	$str_length=0;
	$count=0;
	$word_array=str_word_count($input_content,1);
	foreach($word_array as $word)
	{
	if($count++ > 1) break;
	$str_length += strlen($word);
	}
	$mod_con_title = "<span class='warna'>".substr_replace($input_content,"</span> ", strpos($input_content," ",$str_length),1);
	}
	else if(str_word_count($input_content) > 1)
	  $mod_con_title = "<span>".substr_replace($input_content,"</span> ", strpos($input_content," ",0),1);
	else $mod_con_title = $input_content;
	echo $mod_con_title;
}

Css ini saya gunakan untuk mewarnai title 2 kata pada awal title, dan class dari CSS ini saya masukkan pada script Fungtion.php diatas.

.warna{
	color:#00BFAE;
	}

Langkah terakhir cari kode pada single.php dan ganti the_title dengan script dibawah ini, namun jika anda menggunakan template yang lain mungkin akan berbeda letak nya. seperti template default dari wordpress yaitu twentyfourteen maka letak script title di single content adalah di content.php . dan script trik merubah 2 warna pada title ini bisa juga anda letakkan sesuai dengan keinginan anda, mungkin di home atau index.php dari template anda.

<!-- Start Title -->
<h1 class="title single-title"><?php echo add_span_to_title(get_the_title()); ?></h1>
<!-- End Title -->

Aslinya title: Trik Dua Warna Berbeda Pada Title WordPress
Dimodifikasi menjadi title: Trik Dua Warna Berbeda Pada Title WordPress

Berikut adalah trik merubah 2 warna pada title wordpress, jika anda yang kurang paham silahkan tinggalkan komentar, sebisa mungkin saya akan membalas pertanyaan anda.

Anda Terbantu artikel ini? Silahkan bergabung dengan centerklik di Twitter dan Facebook+.