0
Development FSOSS 2009
full-time now!
What is  ? … and it’s  FREE
Where do I find  ?
This number changes every few minutes. 8, 000, 000  People publish blogs on WordPress.com 200 million people visit one or ...
, not just a blog anymore
 
 
 
 
 
 
Getting started
What you need PHP  version 4.3 or greater MySQL  version 4.0 or greater Creativity and Passion
Installing   <ul><li>5 minute install ,  </li></ul><ul><li>really it’s that quick and easy! </li></ul>
Installing   <ul><li>If installing locally </li></ul><ul><ul><li>Install a local server ( Mac:   MAMP ,  PC: XAMPP  or  WA...
Installing   Update wp-config.php File
Installing   Run install.php
Theming   <ul><li>Create or download a Photoshop design.  Create a static HTML+CSS template of each page . </li></ul>
Theming   <ul><li>Why Create a Static HTML File First? </li></ul><ul><li>Mainly because it will make the development proce...
Theming   How it all works If you go the default theme folder ( wp-content/themes/default ),  you will see many PHP files ...
Theming
Theming   Splitting the file
Theming   The Loop The Loop is used to display blog posts and it also lets you  control what to display. Basically, The Lo...
Theming   <?php wp_list_cats('exclude=1'); ?> <?php wp_list_cats('exclude=1, 2'); ?> <?php the_content('Read the rest of t...
Theming   Styles.css /* Theme Name: Theme NAME Theme URI: http://yoursite.com/ Description: My cool theme. Version: 1.6 Au...
Theming   <ul><li>Loop Resources </li></ul><ul><li>The Loop in Action  </li></ul><ul><li>Template Tags   </li></ul><ul><li...
Plugins and Widgets   Plugins Plugins are tools to extend the functionality of WordPress . The core of WordPress is design...
Plugins and Widgets   if ( function_exists('register_sidebar') ) { register_sidebar(array( 'before_widget' => '<li id=&quo...
Essential  Plugins <ul><li>Ad Rotator -  http://kpumuk.info/projects/wordpress-plugins/ad-rotator   </li></ul><ul><li>Adva...
Essential  Plugins <ul><li>p2pConverter -  http://www.briandgoad.com/blog/p2pConverter   </li></ul><ul><li>Post2pdf -  htt...
Extending BuddyPress is a suite of WordPress  plugins and themes, each adding a  distinct new feature. BuddyPress  contain...
Extending When a visitor browses to a WordPress.com blog on a  mobile device we show special themes designed to work  on s...
Mobile Install
Resources <ul><li>Documentation </li></ul><ul><li>Codex -  http://codex.wordpress.org/Main_Page </li></ul><ul><li>Site Arc...
Resources <ul><li>Plugins </li></ul><ul><li>Simplified AJAX For WordPress Plugin Developers using Jquery </li></ul><ul><li...
Thank You <ul><li>Where to find me… </li></ul><ul><li>http://www.brendanserashriar.com </li></ul><ul><li>http://www.dropth...
Upcoming SlideShare
Loading in...5
×

Wordpress Development Fsoss 2009

3,614

Published on

Not just a blog anymore! Focused on design and development. We’ll cover the essentials of setup and installation. We’ll learn how to build custom themes using CSS and PHP.We’ll also jump into custom code and template files, best practices for design and management, and how to build and install WP and custom plug-ins. We'll also look at the future of WordPress like mobile apps and themes.

Published in: Technology, Business
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
3,614
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
84
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

Transcript of "Wordpress Development Fsoss 2009"

  1. 1. Development FSOSS 2009
  2. 2. full-time now!
  3. 3. What is ? … and it’s FREE
  4. 4. Where do I find ?
  5. 5. This number changes every few minutes. 8, 000, 000 People publish blogs on WordPress.com 200 million people visit one or more WordPress.com blogs every month.
  6. 6. , not just a blog anymore
  7. 13. Getting started
  8. 14. What you need PHP version 4.3 or greater MySQL version 4.0 or greater Creativity and Passion
  9. 15. Installing <ul><li>5 minute install , </li></ul><ul><li>really it’s that quick and easy! </li></ul>
  10. 16. Installing <ul><li>If installing locally </li></ul><ul><ul><li>Install a local server ( Mac: MAMP , PC: XAMPP or WAMP , LINUX: LAMP ). </li></ul></ul><ul><li>Create a new database. </li></ul><ul><li>Download WordPress from wordpress.org and extract the files to a new folder under the htdocs folder. </li></ul><ul><li>Rename the wp-config-sample.php file to wp-config.php and update the database details according to your local server. </li></ul><ul><li>Run wp-admin/install.php and follow the instructions to install WordPress. </li></ul><ul><li>Done! </li></ul>
  11. 17. Installing Update wp-config.php File
  12. 18. Installing Run install.php
  13. 19. Theming <ul><li>Create or download a Photoshop design. Create a static HTML+CSS template of each page . </li></ul>
  14. 20. Theming <ul><li>Why Create a Static HTML File First? </li></ul><ul><li>Mainly because it will make the development process a lot </li></ul><ul><li>easier. I usually create a HTML file for every template that I </li></ul><ul><li>need, test it across all browsers, validate both HTML and CSS </li></ul><ul><li>markups, then all I have to do is cut & paste the WordPress </li></ul><ul><li>code. By doing so, I don’t have to worry about HTML or CSS </li></ul><ul><li>bugs during my theme making process. </li></ul>
  15. 21. Theming How it all works If you go the default theme folder ( wp-content/themes/default ), you will see many PHP files (these are template files) and one style.css file. When you are viewing the front page, WordPress actually uses several template files to generate the page ( index.php << header.php , sidebar.php , and footer.php ).
  16. 22. Theming
  17. 23. Theming Splitting the file
  18. 24. Theming The Loop The Loop is used to display blog posts and it also lets you control what to display. Basically, The Loop checks if there are posts in your blog, while there are posts, display it, if no post found, say &quot;Not Found&quot;.
  19. 25. Theming <?php wp_list_cats('exclude=1'); ?> <?php wp_list_cats('exclude=1, 2'); ?> <?php the_content('Read the rest of this entry &raquo;'); ?> <div class=&quot;alignleft&quot;><?php next_posts_link('&laquo; Older Entries') ?></div> <div class=&quot;alignright&quot;><?php previous_posts_link('Newer Entries &raquo;') ?></div> Conditional Tags * See WordPress Codex- Conditional Tags
  20. 26. Theming Styles.css /* Theme Name: Theme NAME Theme URI: http://yoursite.com/ Description: My cool theme. Version: 1.6 Author: Brendan Sera-Shriar Author URI: http://dropthedigibomb.com */ body { … } H1, h2, h3 { … } #header { … } #content { … } #sidebar { … } #footer { … } .post { … } .comments { … } } This defines the template theme } Theme id’s and classes
  21. 27. Theming <ul><li>Loop Resources </li></ul><ul><li>The Loop in Action </li></ul><ul><li>Template Tags </li></ul><ul><li>Using the Loop in Template Files </li></ul><ul><li>Matt Read Loop Article </li></ul><ul><li>MaxPower Dynamic Sticky Tutorial </li></ul><ul><li>IfElse Query_post Redux </li></ul><ul><li>1001 WordPression Loops </li></ul><ul><li>Global Variables and the WordPress Loop </li></ul><ul><li>WordPress Triple Loop Tutorial </li></ul><ul><li>Multiple Loops with Multiple Columns </li></ul><ul><li>WordPress - modified, dependent and extra Loops </li></ul><ul><li>Super Loop: Exclude Categories and Limit Number of Posts </li></ul><ul><li>Easily Adaptable WordPress Loop Templates: Basic Loops, Mullet Loops, and More </li></ul>* See my presentation on WordPress Theme Design
  22. 28. Plugins and Widgets Plugins Plugins are tools to extend the functionality of WordPress . The core of WordPress is designed to be lean, to maximize flexibility and minimize code bloat . Plugins offer custom functions and features so that each user can tailor their site to their specific needs. Widgets WordPress Widgets (WPW) is like a plugin, but designed to provide a simple way to arrange the various elements of your sidebar content (known as &quot;widgets&quot;) without having to change any code. VS. “ Plug-ins can extend WordPress to do almost anything you can imagine.” -WordPress.org * See my presentation on WordPress Plugin Development
  23. 29. Plugins and Widgets if ( function_exists('register_sidebar') ) { register_sidebar(array( 'before_widget' => '<li id=&quot;%1$s&quot; class=&quot;widget %2$s&quot;>', 'after_widget' => '</li>', 'before_title' => '<h2 class=&quot;widgettitle&quot;>', 'after_title' => '</h2>', )); } Widgetizing a theme functions.php <?php /* Widgetized sidebar, if you have the plugin installed. */ if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?> Your widgets will show up here… <?php endif; ?> sidebar.php
  24. 30. Essential Plugins <ul><li>Ad Rotator - http://kpumuk.info/projects/wordpress-plugins/ad-rotator </li></ul><ul><li>Advanced Random Post - http://www.danielesalamina.it/advanced-random-post </li></ul><ul><li>AFD Admin Theme - http://aenonfiredesign.com/blog/afd-wordpress2-admin-theme </li></ul><ul><li>Akismet - http://akismet.com/ </li></ul><ul><li>All in One SEO Pack - http://semperfiwebdesign.com </li></ul><ul><li>Article Templates - http://www.bin-co.com/tools/wordpress/plugins/article_templates </li></ul><ul><li>Audio player - http://www.1pixelout.net/code/audio-player-wordpress-plugin </li></ul><ul><li>Blogroll Page - http://www.byte-me.org </li></ul><ul><li>Different Posts Per Page - http://www.maxblogpress.com/plugins/dppp </li></ul><ul><li>Disable WordPress Core Update - http://lud.icro.us/disable-wordpress-core-update </li></ul><ul><li>Executable PHP widget - http://wordpress.org/extend/plugins/php-code-widget </li></ul><ul><li>Kimili Flash Embed - http://www.kimili.com/plugins/kml_flashembed </li></ul><ul><li>Lightbox 2 - http://www.stimuli.ca/lightbox </li></ul><ul><li>Maintenance Mode - http://sw-guide.de/wordpress/plugins/maintenance-mode/ </li></ul><ul><li>myStatus - http://eightface.com/code/wp-mystatus </li></ul><ul><li>NextGEN Gallery - http://alexrabe.boelinger.com/?page_id=80 </li></ul>
  25. 31. Essential Plugins <ul><li>p2pConverter - http://www.briandgoad.com/blog/p2pConverter </li></ul><ul><li>Post2pdf - http://wordpress.org/extend/plugins/post2pdf </li></ul><ul><li>PXS Mail Form - http://www.phrixus.co.uk/pxsmail </li></ul><ul><li>QuickTime Embed - http://www.channel-ai.com/blog/plugins/quicktime-embed </li></ul><ul><li>Random Featured Post - http://www.mydollarplan.com/random-featured-post-plugin </li></ul><ul><li>Riffly Video/Audio Comments - http://riffly.com </li></ul><ul><li>Role Manager - http://www.im-web-gefunden.de/wordpress-plugins/role-manag er </li></ul><ul><li>Widget Logic - http://freakytrigger.co.uk/wordpress-setup </li></ul><ul><li>WordPress Database Backup - http://www.ilfilosofo.com/blog/wp-db-backup </li></ul><ul><li>Wordpress Download Monitor - http://wordpress.org/extend/plugins/download-monitor </li></ul><ul><li>WP Cache - http://mnm.uib.es/gallir/wp-cache-2 </li></ul><ul><li>WP e-commerce - http://www.instinct.co.nz/e-commerce </li></ul><ul><li>WP Polls - http://lesterchan.net/portfolio/programming/php </li></ul><ul><li>WP SpamFree - http://www.hybrid6.com/webgeek/plugins/wp-spamfree </li></ul><ul><li>WP-Sticky - http://lesterchan.net/portfolio/programming/php </li></ul><ul><li>WP Shopping Cart - http://www.instinct.co.nz </li></ul>
  26. 32. Extending BuddyPress is a suite of WordPress plugins and themes, each adding a distinct new feature. BuddyPress contains all the features you’d expect from WordPress but aims to let members socially interact. http://buddypress.org/ WordPress MU, or multi-user, is designed to do exactly that. It is most famously used for WordPress.com where it serves tens of millions of hits on millions of blogs each day. http://mu.wordpress.org/
  27. 33. Extending When a visitor browses to a WordPress.com blog on a mobile device we show special themes designed to work on small screens focussing on fast load times. The first theme is a modification of WPtouch and is displayed to phones with rich web browsers like the iPhone and Android phones. The second theme was developed from an old version of the WordPress Mobile Edition and will be displayed to all other mobile devices.
  28. 34. Mobile Install
  29. 35. Resources <ul><li>Documentation </li></ul><ul><li>Codex - http://codex.wordpress.org/Main_Page </li></ul><ul><li>Site Architecture – http://codex.wordpress.org/Site_Architecture_1.5 </li></ul><ul><li>Template Hierarchy - http://codex.wordpress.org/Template_Hierarchy </li></ul><ul><li>WordPress Plugins - http://www.webdesignerwall.com/general/useful-wordpress-plugins/ </li></ul><ul><li>WordPress Theme Hacks - http://www.webdesignerwall.com/tutorials/wordpress-theme-hacks/ </li></ul><ul><li>Tutorials </li></ul><ul><li>Web Designer Wall - http://www.webdesignerwall.com </li></ul><ul><li>Six Revisions – http://www.sixrevisions.com </li></ul><ul><li>NetTuts - http://net.tutsplus.com/ </li></ul><ul><li>Tutorial 9 – http://www.tutorial9.net </li></ul><ul><li>WPTopics - http://www.wptopics.com/ </li></ul><ul><li>WordPress Tutorials - http://www.wp-tutorials.org/ </li></ul><ul><li>Themes </li></ul><ul><li>Function - http://wefunction.com </li></ul><ul><li>WPSnap - http://www.wpsnap.com/ </li></ul><ul><li>WooThemes – http://www.woothemes.com </li></ul><ul><li>StyleShout - http://www.styleshout.com </li></ul>
  30. 36. Resources <ul><li>Plugins </li></ul><ul><li>Simplified AJAX For WordPress Plugin Developers using Jquery </li></ul><ul><li>“Desenvolvendo Plugins para WordPress” by Rafael Dohms (in Brazilian Portuguese) </li></ul><ul><li>12 part “How to Write a Wordpress Plugin” at DevLounge.net by Ronald Huereca ( PDF ) </li></ul><ul><li>How to create WordPress Plugin from a scratch </li></ul><ul><li>Using AJAX with your WordPress Plugin , also at DevLounce.net </li></ul><ul><li>How to Write a Simple WordPress Plugin at ATD </li></ul><ul><li>Other </li></ul><ul><li>BuddyPress - http://buddypress.org/ </li></ul><ul><li>WordPress MU – http://mu.wordpress.org/ </li></ul><ul><li>WP e-Commerce – http://www.instinct.co.nz/e-commerce/ </li></ul><ul><li>Thematic – http://themeshaper.com/ </li></ul><ul><li>WpTouch – http://www.bravenewcode.com/wptouch/ </li></ul><ul><li>WordPress Mobile – http://en.blog.wordpress.com/2009/10/20/the-hero-is-in-your-pocket/ </li></ul>
  31. 37. Thank You <ul><li>Where to find me… </li></ul><ul><li>http://www.brendanserashriar.com </li></ul><ul><li>http://www.dropthedigibomb.com </li></ul><ul><li>[email_address] </li></ul><ul><li>http://www.twitter.com/digibomb </li></ul><ul><li>http://www.twitter.com/OptimalPayments </li></ul>
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×