TUTORIAL: Share This Post
Sunday, April 17, 2016
ASSALAMUALAIKUM | SALAM SEJAHTERA
Firstly, maaf sebab lambat sangat share this tutorial hihi. For those yang request, nah tuto ni utk uols. Maaf lambat buatkan. Siapa yang nak share this post kat post footer dia makin comel, boleh laa buat tutorial ni yee hehee.Ok lets start!
1. Layout. Kat Blog Posts, klik pada Edit sepertimana gambar di bawah:
Akan keluar pop up seperti gambar di bawah ini. Sila untick show share buttons. Kosongkan jangan tick pun k. Save.
2. Template. Pergi kat Edit HTML. Ctrl+F dan cari kod ini:
<div class='post-footer'>
Kalau ada beberapa kali keluar kod yg sama, use the second one yee.
3. After the code above, paste kod di bawah ni:
<!-- AddThis Button BEGIN -->
<div style='text-align: left;'>
<div class='addthis_toolbox'>
<div class='custom_images'><a class='addthis_button_share'><img alt='Share this Post' border='0' src='http://i1077.photobucket.com/albums/w480/vendettatraveller/stpp_zpsazur3ixt.png'/></a><a class='facebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url + "&t=" + data:post.title' rel='nofollow' target='_blank' title='Share This On Facebook'><img alt='Facebook share' border='0' src='http://i.imgur.com/HDF2fsq.png'/></a><a class='twitter' expr:href='"https://twitter.com/share?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank' title='Tweet This'><img alt='Twitter share' border='0' src='http://i.imgur.com/rXfEVmp.png'/></a><a class='addthis_button_pinterest_share'><img alt='Pin This' border='0' src='http://i.imgur.com/TPniipl.png'/></a><a class='addthis_button_email'><img alt='Email This' border='0' src='http://i.imgur.com/t8q1o7z.png'/></a>
</div></div></div><script type='text/javascript'>var addthis_config = {"data_track_addressbar":false};</script><script src='//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-511bbe8405a64ebd' type='text/javascript'/>
<!-- AddThis Button END -->
MERAH: Url Share This Post
BIRU PEKAT: Url Gambar Icon Facebook
BIRU CAIR: Url Gambar Icon Twitter
KUNING: Url Gambar Icon Pinterest
PURPLE: Url Gambar Icon Email
Contoh selepas paste kod, akan jadi seperti gambar di bawah:
3. PREVIEW. Hasilnya post footer anda akan kelihatan seperti gambar di bawah. Kalau takde error, boleh save. Siap!
Berjaya tak uols buat? Hihii. Kalau tak jadi, mungkin sbb uols salah paste kod.
<div class='post-footer'>
Sebab kod di atas ni, dalam html ada dua. Jadi, sila enter lagi sekali, lepastu paste dekat yg kedua kali yee. Url icon dalam koding tu adalah macam dalam contoh kat atas. Kalau nak tukar, boleh tukar. Kat bawah ni aku ada kasi sekali icon lain. Boleh right click dan copy image address okay. Share this post tu kalau nak tukar, boleh usha freebies kat SINI
Harap tutorial ni membantu. Tataaa!
5 COMMENT
saya pakai tuto ni ^.^
ReplyDeletethankyou for the tuto kak rrai :))
ReplyDeletethank you kak rrai. :D
ReplyDeleteleya guna
ReplyDeleteyan guna dan ambik icon tukar yg lama tu :) thx buat tuto ni :D
ReplyDeletePenghantaran sebarang komen, permintaan, cadangan ATAU komunikasi lain yg lucah, sumbang, palsu, mengancam ATAU negatif dengan niat untuk menyakiti hati, menganiayai, mengugut ATAU mengganggu orang lain dengan ATAU tanpa mendedahkan identitinya adalah suatu kesalahan boleh didenda tidak melebihi 58 ribu ringgit atau dipenjarakan selama tempoh tidak melebihi 1 tahun ATAU kedua-duanya sekali.