Blending Social Media in WordPress


Published on

Extended version.

Published in: Design
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • Talk about self-influence very briefly before this slide then continue to ask about their interests/passions.
  • Blending Social Media in WordPress

    1. 1. WordCamp Malaysia 2010 Blending Social Media in WordPress Presented by Yahya Ayob Tweet me @yahya_ayob Find me in or
    2. 2. Self-Influence <ul><li>Who are you? </li></ul><ul><li>Find the one thing inside that you are so passionate about. </li></ul><ul><li>Write down short & long term goals to achieve. </li></ul><ul><li>Focus on the short goals, execute plans to achieve them. </li></ul><ul><li>Keep long-term goals in mind, heart and soul. </li></ul><ul><li>Dedicate and commit at all times for at least 6 months. </li></ul>
    3. 3. Social Influence <ul><li>Buddies or kakis or mission comrades </li></ul><ul><li>Similar passion and interests </li></ul><ul><li>Learn more from similar groups and enhance self-influence </li></ul>
    4. 4. Self Influence Align Yourself Social Influence
    5. 5. Great example <ul><li>Self-Influence </li></ul><ul><ul><li>Naoko passion on translating WordPress in Japanese. </li></ul></ul><ul><li>Social-Influence </li></ul><ul><ul><li>Mingle with the WordPress Japanese community. </li></ul></ul><ul><li>Achievement </li></ul><ul><ul><li>WordPress Japanese users benefit from her books. </li></ul></ul><ul><ul><li>Got hired as Happiness Engineer in Automattic. </li></ul></ul>
    6. 6. Common Question What is Social Media? Real Question How to blend Social Media in the awesome WordPress?
    7. 7. “ describes the online technologies and practices that people use to share opinions, insights, experiences and perspectives with each other .” - Wikipedia
    8. 8. When WordPress becomes Social? <ul><li>Share news by blogging a post. </li></ul><ul><li>Discussions via comments left by readers. </li></ul><ul><ul><li>Intense Debate </li></ul></ul><ul><ul><li>Disqus </li></ul></ul><ul><ul><li>Facebook Comments </li></ul></ul><ul><li>Practices - Read / Share / Quote / Link Back </li></ul>
    9. 9. – Intense Debate Usage
    10. 10. Intense Debate usage
    11. 11. Intense Debate usage
    12. 12. Disqus
    13. 13. Facebook Comments
    14. 14. Shortcomings <ul><li>WordPress </li></ul><ul><ul><li>Limited Contacts but Rich Content </li></ul></ul><ul><li>Social Media </li></ul><ul><ul><li>Massive Layers of Contacts but Limited Content </li></ul></ul>
    15. 15. Marrying them together <ul><li>I read a WordPress blog post about hair loss. </li></ul><ul><li>Really good post that I like and I want to share it. </li></ul><ul><li>I tweet it. I facebook it. I stumbleupon it. </li></ul><ul><li>In those networks I just shared, a friend of mine David notices my shared links and find it very very interesting. </li></ul><ul><li>Apparently, he has hair loss problem. </li></ul><ul><li>He clicks the shared link and the link redirects him from Social Media platform to the WordPress site. </li></ul>
    16. 16. Next thing I know…
    17. 17. <ul><li>Landing strip – WordPress website </li></ul><ul><li>Destination – Content </li></ul><ul><li>Plane with passengers – Social connections </li></ul><ul><li>Pilot – You </li></ul>
    18. 19. Social Media Plugins in WordPress
    19. 20. Sociable 3.0.6
    20. 21. Wordbook Your blog posts will show up in Facebook wall! Wordbooker
    21. 22. Facebook Craze in Asia!
    22. 23. When to use FB Like <ul><ul><li>Reading news in posts </li></ul></ul><ul><ul><li>Viewing photos or videos </li></ul></ul><ul><ul><li>Site browsing </li></ul></ul>
    23. 24. When to use FB Recommend <ul><ul><li>After you buy something, you recommend. </li></ul></ul><ul><ul><li>After you eat roti canai, you recommend. </li></ul></ul><ul><ul><li>After a holiday trip, you recommend. </li></ul></ul>
    24. 25.
    25. 26. Recommend in action
    26. 27. iframe option can only do this
    27. 28. xfbml + javascript option can do this
    28. 29. User wall with open graph metatags
    29. 30. The Easy Way <ul><li>Facebook Like Button Plugin </li></ul><ul><li> </li></ul>
    30. 31. Application ID / app id
    31. 32. Wanna hide the count?
    32. 33. Use the Permalink-Template tag to generate links Example: <a href=&quot; <?php the_permalink(); ?> &quot;>Tweet this</a>
    33. 34. Use the Permalink-Template tag to generate links Example: <iframe src=&quot; = <?php echo urlencode(get_permalink($post->ID)); ?> &amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light&quot; scrolling=&quot;no&quot; frameborder=&quot;0&quot; allowTransparency=&quot;true&quot; style=&quot;border:none; overflow:hidden; width:450px; height:60px;&quot;></iframe>
    34. 35. Blending Tips <ul><li>title area </li></ul><ul><li>before & after posts </li></ul><ul><li>after or side of photos or videos </li></ul><ul><li>near download areas </li></ul><ul><li>eyeball hot spots </li></ul>
    35. 36. - Tweetmeme compact button
    36. 37. At Vocanic homepage
    37. 38. Vocanic - Embed inside posts with shortcodes or plugin settings
    38. 39. Right after a post in single.php
    39. 40. TechCrunch - Near post title
    40. 41. I Love Typography
    41. 42. I Love Typography – after post
    42. 43. theAppleBlog – near metadata
    43. 44. LaughingSquid – twitter stream, after post & below video
    44. 45. MTV – FB Connect
    45. 46. MTV – FB Connect
    46. 47. MTV – FB Connect
    47. 48. MTV – FB Connect
    48. 49. Mashable – Twitter Connect
    49. 50. Mashable – Twitter Connect
    50. 51. Mashable – Twitter Connect
    51. 52. End note <ul><li>Focus & a definite choice. Eg. Coffee or tea? </li></ul><ul><li>Start with Facebook & Twitter </li></ul><ul><li>Blend it with logic and common sense </li></ul><ul><li>Align self with social influence </li></ul><ul><li>Rich content is still a must </li></ul>
    52. 53. Ask away! <ul><li>Tweet me – yahya_ayob </li></ul><ul><li>Skype me – yahyaayob </li></ul><ul><li>+65-93437601 </li></ul><ul><li>[email_address] </li></ul>