My post footer currently looks like this:
Post Footer without Like button.
On a whole, I guess I'm pretty happy with the way it looks. But some time ago since some readers suggested that I include a "Like" button to it. Not a bad suggestion, I suppose. It allows you guys to interact with my post without having to think about what to say. =)
But considering I'm no programmer,
I put it off for the longest time.
Till last night. =p
Tinkered away with Blogger Settings and experimentally tweaked some codes. But unfortunately for me, those codes are just NOT working the way I intended them to. Hrrmph. >( When added, the Like button somehow expands my footer in a way I don't appreciate.
Post Footer with Like button in a new line.
Yuck! Such an eyesore! Blergh!
Cannot make it lah liddat. -_-'''
This *points below* is what
I want my Post Footer to look like:
Post Footer with Like button BETWEEN Comments and Share buttons.
Does anybody know how I can customise my codes
to make my Like button behave the way I want it to?
13 comments :
Currently from the code, the "Like" table (yes I see it's a <table>..</table>) is positioned AFTER those Share-Buttons. Maybe try slot the code in between Post-Timestamp and the Share-Buttons?
ATTN: narrowband
– Thanks for the suggestion! Will try that now. =)
ATTN: narrowband
– Oh yes, now I remember why I didn't leave it that way. It's cos I end up with FOUR lines instead of the already-terrible-looking three. -_-'''
It's like the "Like" button always wants to be in a new line and refuses to sit on a line on its own.
I'm gonna revert it back to what I had before (with the three lines and the "Like" button sitting on its own) but you can click *here* to see what I mean.
ATTN: narrowband
– Sorry, I mean it refuses to sit on the same line as the other things on the post footer. -_-'
Let me know when you are free gal..I will look into it for you.
Try this:
Put the span element with class="post-icons" that contains your "like" button in a div with class="post-share-buttons" and move it to where you want it (between the span with class="post-comment-link" and the div with class="post-share-buttons" that contains your share buttons).
This seems to work, for me at least.
ATTN: Willett
– Haha. It's okay! My cousin solved it!
ATTN: Terence Song
– Terence Koko you so very many amazingness!! Thank you!!!
Ai yah... ka-ki-nang... mien khek-khi...
Seriously, it worked?
You might want to duplicate the post-share-buttons style and give it a different name... maybe post-reaction-buttons?... same style as post-share-buttons, but with different style id (so you can change the style of your like button without affecting the style of the share buttons).
ATTN: Terence Song
– Haha. Do you see it? Does it look ok on your side? Cos on my side it does. But I haven't tried loading the page on other browsers. Right now, it appears as per this post on Firefox. =D
And urm... what do you mean by changing the style? As in the look? Actually I really don't like the font for the "Like" word. So tak matching with all my other text. But... is it even possible to change that? -_-'
ATTN: Terence Song
– Eee, Terence Koko, it looks really ugly on Chrome, Opera and Safari. T_T Look! *click*
ATTN: Terence Song
- Cannot wor. If I do that, it goes back to what it was before where there are 3 lines. Hmmm...
ATTN: Terence Song
– Reverted it back to the previous one for the time being till this problem gets figured out. Bleh. And there I was thinking everything's fine and dandy now. Haha.
Post a Comment
Talk to me!