My comments page style.

My blog-friend Rad asked me how i made my comment page. Since she asked me that, might as well share it with others too. Actually, i planned on posting it here before Rad had asked me :neutral: Just pardon my explanation because i s*ck at it :oops: this is not actually a tutorial just sharing my own CSS style.

1st. Get this file comment.phps and rename it to .php

2nd. Get my comment-template CSS code here and type it in your css file.

3rd. In your single.php this is what should come out (noticed the highlighted lines) click image.

Free Image Hosting at www.ImageShack.us

then thats it your done and you can customize it along with your own plugins. Here is a little explanation about that “talk shape” effect. I used this image as background. I made a class attribute and name to .comments-author as shown below.

.comments-author {
padding-left: 90px;
padding-bottom: 10px;
width: 380px;
background: url(monica/bubble.png) no-repeat 48px 49px;
}

48px and 49px is the position of the bubble.png image where is the first number is x and 2nd number is y.

AND this is what it looks like….

Next time, i will include all the plugins i used here in my links page for reference :3:

This entry was posted in Designs and tagged , , , , . Bookmark the permalink.

11 Responses to My comments page style.

  1. Rad says:

    haha i tried it kaso medyo nag back fire…bukas ko na lang ayusin when I get home from work..di ko kasi pinagaralan nag copy and paste lang ako..medyo antok na kasi ko. :grin:

    bukas pagaaralan ko…thanks scarty for sharing your code! :shock:

  2. scart says:

    cge rad tanong mo rin sakin san nagbreak yung layout kasi magkaiba ng width yung layout adjust mo nalang sigura :wink:

  3. Noreen says:

    ay naku buti ka pa ang galing mo sa mga ganyan…ako wala ako naiintindihan…nakanganga lang ako hahahahahahahaha

    take care ganda!

  4. scart says:

    @noreen: ganda trial and error lang din ginawa ko dyan :razz: importante lang maintindihan mo kung para saan yung code at kung ano function nya :wink:

  5. EJAY says:

    Ohmygosh, ur layout rocks Ate Scart!! I love it!! Super duper cute…
    at kahit tong comment thingy mo ang ganda… inggit ako hahaha :lol:

  6. skulgirltrx says:

    wow, feeling school girl ako sa comments page mo! hehehe sorry ngayon lang nakadaan ha? talented ka talaga Sis! :-)
    how i wish i have this skill!
    happy fourth of JULY nga pala! me utang ka pang pics sa wedding mo ha? (at demanding mode pa daw!):smile:

  7. Rina says:

    Hi ate scarty, thanks for commenting on my website!! you’re so sweet naman ate.. yeah, i’m flying to japan for attending the camp with the students.. im so excited hehehe.. have you been there? :4:

  8. andrea says:

    youve been tagged for being accuse ot making non-sense, childish entries. http://pinoybalut.com/24-oras-walang-tulogan/

  9. Michelle says:

    hi sis! pasensya na kung ngayon lang me ulit nakadaan dito. Been really busy sa baby ko. Ilang araw na akong walang matinong tulog. Palagi akong puyat. Takaw kasi nang baby ko eh. Lol. Kung makahawak man ako nang computer eh saglit lang. Hindi tulad nang dati na kahit maghapon akong nasa comp okay lng. Oh sya ingatz lagi ha!

  10. chase says:

    I really like the new look and totally digging your comment section as well! Awesome!

  11. Rachel says:

    hay ang galing galing mo talaga as in. ang cute ng layout mo sana ganyan din ako. ano bang secret? hehe anyway salamat sa pagshare. genius!

Leave a Reply

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

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>