Perlu web design, wordpress development, atau online shopping? Konsultasi Gratis!

Anda perlu web design, modifikasi website, wordpress template / plugin? Membangun website profil perusahaan atau online shopping? Atau ingin mengoptimalkan website Anda untuk meningkatkan penjualan? Hubungi kami sekarang juga!

Bagaimana Membuat Sticky Post di WordPress dan Merubah Stylenya?

28 October 2014 oleh Bambang Sugiarto

Sticky Post di WordPressSticky post menurut pengertian saya adalah satu atau lebih penggalan artikel di homepage yang posisinya tetap pada urutan paling atas walaupun ada artikel baru yang dipublish. Sticky post dapat digunakan untuk menampilkan artikel penting dari blog anda atau bila anda pemain program Paid To Review dan harus menampilkan link di homepage yang diberikan dari job yang anda dapatkan selama beberapa hari, anda bisa menggunakan sticky post ini.

Sekarang bagaimana caranya membuat sticky post itu ? Tidaklah sulit membuat sticky post itu, silahkan anda ikuti caranya di bawah ini.

  1. Masuk dashboard
  2. Kemudian pilih Posts »Add New
  3. Setelah itu anda lihat di kanan layar anda ada kotak Publish
  4. Klik Edit pada Visibility : Public Publish option di WordPress
  5. Kemudian akan muncul drop down, centang Stick this post to the front page bila anda ingin membuat artikel anda sebagai Sticky post

Sticky Option

Cara Merubah Style / Design Sticky Post

Secara default styling/design dari sebuah sticky post akan sama dengan style dari postingan/artikel biasa, mungkin anda ingin agar pengunjung blog anda tahu bahwa ada stiky post di blog anda, satu-satu cara adalah dengan membedakan style sticky post dengan artikel lainnya. Untuk merubah style sticky post anda harus membuka file index.php, kode standard rata-rata template untuk menampilkan artikel biasanya seperti ini :

<h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3><?php the_content(); ?><?php endwhile; endif; ?>

Untuk menambahkan class pada sticky post anda cukup merubahnya menjadi seperti ini

<?php if(have_posts()) : while(have_posts()) : the_post(); ?><div <?php post_class(); ?>><h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3><?php the_content(); ?></div><?php endwhile; endif; ?>

Atau apabila anda bingung dengan kode di atas, silahkan anda tambahkan div baru sebagai pembungkus artikel/post.

<div <?php post_class(); >>Div pembungkus artikel, looping artikel.</div>

Fungsi dari kode div tersebut adalah sebagai div class generator yang akan membuat class baru, salah satunya class=sticky. Setelah anda selesai menambahkan kode di atas, sekarang anda hanya tinggal membuat style baru untuk class sticky. Buka file style.css kemudian anda masukan kode css di bawah ini.

.sticky {    background: #000;    border: 2px solid black;}

*nb : styling silahkan disesuaikan dengan keinginan anda masing-masing
Semoga bermanfaat and good luck

Related Articles

2 Komentar sejauh ini.

  1. Zippy says:

    Untuk tambahkan div baru sebagai pembungkus artikel/post setelah code apa yah?
    Dan dibagian mana?
    Untuk class sticky juga setelah code apa?
    Hheheh…
    Belum gitu paham soalnya :D
    Thx :)
    *kalo bisa balasnya ke email ya :)

  2. Mukti Effendi says:

    Tips yang saya cari cari nich. Thanks atas sharingnya

Tulis Komentar