There are plenty of great project management solutions available on the web. Unfortunately you don't have a lot of control over what you can do with them. Wouldn't it be great if you could create a custom tool for your own projects? In this presentation/workshop from WordCamp Toronto 2013, we create a WordPress-powered project communication and collaboration solution using the P2 theme and a smattering of plugins.
- 1. Andy McIlwain & WPUniversity.com @ WordCamp Toronto 2013 October 6, 2013 @ Humber College Lakeshore Campus
2. Andy McIlwain, a guy with many hats: Co-Organizer, Toronto WordPress Group & WordCamp Toronto Content Guy (Communications) @ WPUniversity.com 3. Lots of players. Basecamp, Teambox, Huddle, Asana, Teamwork PM, Ace Project, Zoho Trello (a personal favourite of ours) What are you using? Incremental costs. Features vary from one to the next. Lack of control. Need a feature? Well take it into consideration or add yet another service. 4. Open Source = Control Themes & Plugins Free (as in Free Beer) Objective: Were going to play to WordPress strengths by creating a platform for communication and collaboration. This wont handle time tracking, invoicing, or file storage. 5. Over 100 P2 blogs running at Automattic. Make.WordPress.org sites now running on P2. Completely free to use. 6. Create something that is secure and private. Every project (e.g. client) has a separate site. Every site is locked down with restricted capabilities and access. Users must log in to get access! We dont want stuff shared publicly* *Michaels methods are still awesome though! 7. A good web host like WP Engine. The latest version of WordPress. P2 theme from Automattic. A dozen plugins. (More on that in a moment.) SSL certificate. (Optional.) Separate service for storing/sharing files. (Sync it up, baby!) 8. Members Whos Online P2 Check In P2 Likes P2 by Email P2 Resolved Posts Backup plugin (e.g. Backup Buddy) Custom Login Blog Copier 9. Install WordPress. Suggest using a subdomain, e.g. projects.yoursite.com Enable multisite. Follow the steps in Create a Network. Use the subdirectory option. 10. Install the Members plugin. Activate it for the network. Go to your main network blog. Under Settings, click Members. Under Private Site, check the Redirect All Users and Show error message for feed items checkboxes. Click Update Settings. This forces users to log in whenever they try to access the site. 11. From the Network Admin screen, go to Themes > Add New. Look for P2 from Automattic. Click Install Now. Click Network Enable. 12. Whos Online Sidebar widget. Shows which users are active on the site. P2 Check In Lets users check into the site. Shows how long theyve been checked in for. Useful for real-time collaboration on pages. P2 Likes Adds the equivalent of upvoting/+1 voting to individual posts and comments. P2 by Email Gives you more email notifications than what P2 provides out of the box. Lets you submit posts and comments via email. P2 Resolved Posts Lets you mark posts as Resolved or Unresolved. Use in combination with smart tagging to add a task management/bug tracking component. 13. Its like insurance for your site! Youre using your multisite network for collaboration, documentation, and other fun stuff. Good backup plugin = worth every penny. Backup Buddy from iThemes is one we swear by. 14. Create a custom-branded experience for clients. Small details like this add to the level of polish. Network Activate this plugin. 15. Easily copy blogs within a multisite network. Network Activate this plugin. 16. Were building a collaboration & communication solution. WordPress is not a replacement for file synchronization. Plenty of great options to choose from: Google Drive SkyDrive from Microsoft SharePoint Dropbox Box Copy.com any others? 17. Goal: Set up a dummy P2 site that well replicate for all projects. Use the Blog Copier plugin to simplify replication process. 18. Log into the Network Admin dashboard. Under Sites, click Add New. Enter the address and site title. Keep it simple, and make it something you wont get confused with a project site. Enter your email address for Admin Email. Click Add Site. WordPress might take a moment to set things up. Once its done, youll see an alert message saying Site Added. Click Visit Dashboard to go to the new sites WordPress dashboard. 19. Click Appearance. Under Available Themes, click Activate for P2. Under Appearance, explore the Customize and Theme Options screens to see what you can customize. Tidy up the design to align more closely to your own brand, so you have a graceful fallback if you dont customize for each project. 20. The pages you use will depend on the work you do. Some handy starting points for most projects: Contacts: A list of all team members and any other important people. Project Overview: Scope of the project, deliverables, and a timeline. Links: Important links to other websites, assets, resources, and so on. Introduction: A welcome message for project members. These pages are placeholders. Youll flesh them out in more detail for each one of your projects. Simply create the pages and add some subheadings or placeholder text for now. 21. Under Appearance, click Menus. If your pages arent on the menu, add from the Pages dropdown. From the Links dropdown, use the # symbol for the URL. This will be a placeholder for each of your projects. The links will depend on your project. Good standbys: Calendar (e.g. Google Calendar), links to files on Google Drive or Dropbox, etc. Have a lot of links? Consider using dropdown menus for quick access. Click Save Menu. Click the Manage Locations tab. Set the Primary Menu to the menu you just created. 22. Under Appearance, click Widgets. We suggest: Search: Quickly search the site for information. P2 Filter Posts: Toggle between Resolved and Unresolved posts. P2 Recent Comments with Avatars: See the comments that have been left recently, along with an avatar for each user. Archives: Jump to a specific month. Calendar: Jump to a specific date. Whos Online: Listing of users who are also logged in and viewing the site. Use whatever widget setup that makes sense for you. 23. Go to your Network Admin dashboard. Mouse over Sites, click Blog Copier. Choose the source blog this is the template site you created. Enter a URL for the new blog. Use only lowercase numbers, letters, and hyphens. Enter a title, e.g. the project or client name. Click Copy Now. It may take a moment for WordPress to create the new site. When completed, youll see a Copied status message. 24. Site wont load? Theres a known bug with Blog Copier. On the sidebar, click Sites. Find the new blog and click Edit. In the Info tab, update the Path field and click Save Changes. Youre good to go! 25. Four post formats: Status Update, Blog Post, Quote, and Link. You can add tags, embed media, and use HTML. You can also use the normal Add Post screen. 26. Just click Reply next to any post to toggle the comment box. Click Toggle Comment Threads to show/hide comments below posts. 27. Need feedback or a decision to be made? Click Flag Unresolved to highlight the post in red. Click Unresolved to change the flag to Resolved in green. Click the flag again to reset to blank. You can filter posts using the widget we set up earlier. 28. Mouse over your name in the toolbar and click Edit My Profile. At the bottom of the page is the P2 By Email section. Customize your notification settings to suit your preference. Click Update Profile to save your changes. 29. Customize the site even more (e.g. custom login). Add users. Add content! Read/Watch: Michele Mizejewski: The Power of P2 (Video) Beau Lebens: Taking WordPress to the Front End with O2 (Video) Sign up for the O2 trial (Invite Only) 30. WPUniversity.com Twitter: @WPUni / Facebook: WPUniversity WordPress Training Resources: wpuniversity.com Our Plugin, Sidekick for WordPress: sidekick.pro Personal Stuff Twitter: @andymci Blog: andymci.com Photo Credits David Goehring Dinner Series