Cara Menambahkan Class Pada Excerpt WordPress

Cara Menambahkan Class Pada Excerpt WordPress

WordPress memiliki sebuah fitur yang disebut The WordPress Excerpt atau singkatnya disebut excerpt yang berfungsi menampilkan deskripsi, rangkuman, atau gambaran sebuah post. Biasanya fungsi ini dipanggil untuk menampilkan snippet deskripsi di halaman homepage atau arsip pada masing-masing rangkuman post (loop). Dengan fungsi ini, kita bisa menampilkan snippet yang berbeda dengan isi post. Tanpa fungsi ini, tampilan di dalam rangkuman post otomatis diambil dari teks awal post (biasanya berjumlah 50 kata).

Fungsi sederhananya:

<?php the_excerpt(); >

Excerpt dimuat dalam tag paragraph (p), sama seperti konten post WordPress secara default. Dalam beberapa kasus, anda mungkin ingin memberikan styling atau memberikan fungsi javascript melalui penggunaan class. Tapi tentu class tidak bisa dimasukkan begitu saja. Maka kita perlu memberikan penyisipan pada fungsi (hook), dan dalam kasus ini, kita bisa menggunakan fungsi add_filter. Pertama kita set parameter-parameter pada add_filter, dalam hal ini kita akan melakukannya pada filter excerpt dengan menentukan class reference-nya sebagai callback, taruhlah kita membuat class “add_class_to_excerpt”.

add_filter( ‘the_excerpt’ ‘add_class_to_excerpt’ );

Kemudian kita tentukan fungsinya:

function add_class_to_excerpt( $excerpt )

Fungsi itu diikuti dengan mengembalikan (return) menggunakan str_replace, sebuah fungsi PHP murni yang berfungsi menggantikan (sekelompok) karakter dengan karakter lainnya. Dalam hal ini, saya akan menggantikan tag pembuka <p dengan yang sudah disisipi atribut class lengkap dengan nama selector-nya, <p class=”excerpt-artikel”.

{return str_replace(‘<p’, ‘<p class=’excerpt-artikel”, $excerpt);}

Jadi kita dapatkan secara keseluruhan:

add_filter( ‘the_excerpt’, ‘add_class_to_excerpt’ );
function add_class_to_excerpt( $excerpt ) {
return str_replace(‘<p’, ‘<p class=’excerpt-artikel”, $excerpt);
}

Copy (arahkan mouse ke atas code hingga toolbar muncul di sebelah kanan, klik view source) dan letakkan pada file functions.php sebelum tag php terakhir (?>). Pada beberapa theme, untuk menambahkan fungsi baru disarankan membuat file lain dengan nama custom_functions.php. Buat dan upload ke dalam folder theme yang digunakan. Isi dengan fungsi di atas.

Setelah itu, anda bisa menggunakan class untuk beberapa keperluan, misalnya css styling, gunakan nama class selector-nya. Contoh:

.excerpt-artikel {
color: #333;
margin: 5px;
Padding: 4px 0;
font-size: 14x;

}

That’s it!

You May Also Like

About the Author: Xsoal

Hello, I am Admin Xsoal.com

Leave a Reply

Your email address will not be published. Required fields are marked *