CSS Per Post

August 29th 2010 | Posted by Hari Mulya

Dalam beberapa postingan, saya menggunakan style css khusus untuk masing-masing artikeL. Ada artikeL yang menggunakan inLine style, adapuLa yang terpaksa menggunakan externaL style. Untuk artikeL dengan inLine syle tidak ada masaLah yang mengganggu, tapi untuk yang externaL styLe, ada sedikit ganjaLan.

Sebelumnya, saya menggunakan satu fiLe css dengan nama poststyle.css yang saya incLude di header.php. Setiap ada artikeL baru yang membutuhkan externaL style, saya tuLiskan styLenya di daLam fiLe poststyle.css. Jika jumLah artikeL yang membutuhkan poststyle.css masih sedikit tentu tidak ada masaLah, tapi bagaimana jika kelak artikeLnya bertambah banyak? Tentu ukuran fiLe poststyle.css itu akan bertambah besar, yang pasti akan menambah beban loading, padahaL tidak semua styLe didaLamnya digunakan untuk artikeL yang bersangkutan.

Beberapa hari laLu akhirnya saya menemukan soLusi untuk mensiasati haL tersebut. Yaitu dengan menambahkan beberapa kode di function.php. Penggunaannya adaLah sebagai berikut:

1. Tulis / tambahkan kode berikut ke daLam fiLe function.php yang ada di daLam foLder theme.

[php]
function cssperpost() {
global $post;
if (is_single()) {
$currenttitle = $post->post_name;
$serverfilepath = TEMPLATEPATH.'/css-per-post/'.$currenttitle.'.css';
$publicfilepath = get_bloginfo('template_url');
$publicfilepath .= '/css-per-post/'.$currenttitle.'.css';
if (file_exists($serverfilepath)) {
echo "< link rel='stylesheet' type='text/css' href='$publicfilepath' media='screen' />"."\n";
}
}
}

add_action('wp_head', 'cssperpost');
[/php]

2. Buat foLder baru dengan nama “css-per-post” (atau nama lain sesuai kode yang ditambahkan ke daLam function.php)
3. Tulis style css yang diperLukan untuk suatu artikeL, dan simpan di daLam foLder tersebut dengan nama sesuai nama artikeL.

Ketika artikeL dibuka, wordpress secara otomatis akan mencari fiLe css dengan nama yang sesuai nama artikeL tadi, jika ada maka fiLe css tersebut akan diload di header. Maka styLe-styLe daLam fiLe css tersebut akan berLaku untuk artikeL yang bersangkutan, dan fiLe css yang diLoad hanya fiLe yang sesuai dengan nama artikeL. Mudah-mudahan bingung. bermanfaat.

Incoming Search Terms:

artikel css, menambah font di blog, cara menambah font pada blog, menambahkan font css, menambah font pada blogger, mencari font, cara menambahkan font di blog, cara menambah style font pada blogspot, menambahkan font pada postingan, cara cari fonts, cara membuat font metal dengan coreldraw

Related Posts

18 Responses to “CSS Per Post”

Bila tidak bertambah berat dan dari mesin pencari lebih mudah , pengen juga ikutan bro. wah aku harus belajar banyak neeh.

dibandingkan cara-cara yang sebeLumnya saya utarakan, nampaknya lebih enteng dan lebih mudah dicari…

Semoga tetap sehat ya dan tetap semangat dalam hari hari yang mulia ini.

[Reply]

Weh…
Aku malah ra mikir loading2an…
Sing penting sekarang dowang,
Sing penting tak bukak lancar.

sing penting dollar ngaLir deras… :D

[Reply]

makasi sharingnya Hari, sangat bermanfaat. eMak suka klo Hari bahas yang kayak beginian.. gampang dicerna.
:sleeping:

dicerna sambiL tidur? kok kayak hewan memamah biak… :sleeping:

[Reply]

nDuk | August 29th, 2010 at 17:41

kasian Mak, gak da yang nemenin :sleeping:

senengane nduseL.. padahaL ketek nya emak bau lho, beLum mandi…

[Reply]

nDa | August 30th, 2010 at 16:52

melok ngancani eMak dan nDuk… :sleeping:

aku entuk meLok ngancani ra? :sleeping:

[Reply]

Kakaakin | August 31st, 2010 at 23:25

Maap, aku baru bergabung :sleeping:

[Reply]

tapi nek d takoni kancane ra tau glm jwb.. eh.. kancane dudu si? :sleeping: :sleeping:

:lmao:

[Reply]

kancane | August 29th, 2010 at 14:42

aku nembe entuk carane pas dhewe mbahas wingi kae lho…

[Reply]

nice share nie, terus berbagi ya !!

insya Allah…

[Reply]

terus terang aku masih belum ngerti banyak sekitar css kini. terimakasih sudah berbagi

saya juga masih beLajar, Om…

[Reply]

manggut manggut saja soal css, masih newbie, masih harus banyak belajar…

kita sama-sama beLajar..
basecamp Semarangnya mana, Mas?

[Reply]

tapi emang untukku yah bingung.. :-@

hawong ndak pernah bermain dengan css dan teman temannya ;) )

sama bingungnya ketika aku muter-muter ga bisa keLuar dari hutan…

[Reply]

Aku juga turut bingung :-? ?

[Reply]

Hari neranginnya dah keren banget, cuma aku aja yg tetuteup gak mudheng……… hiks……hiks……….
salam

ga harus mudeng kok, Bun.. berkunjung ke sini saja aku sudah seneng banget… :D

[Reply]

kalau sudah ngebahas kode2 seperti itu,… nah aku langsung manggut2 pura2 ngerti.

[Reply]

[...] terpisah atau di luar file HTML), cara ini pernah dibahas oleh Kang Hari Mulya di postingan ini CSS Per Post, bisa secara Internal (Kode CSS dipasang di dalam tag head HTML) danĀ Inline (kode CSS langsung [...]

Naturally, what a great web site and informative posts, I??ll add backlink ?C bookmark this internet site? Regards,

[Reply]

salam…..thanx tipsnya ane langsung praktek deh……….

[Reply]

Leave a Reply:

Name (required):
Mail (will not be published) (required):
Website:
Comment (required):