Your SlideShare is downloading. ×
0
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Mobilizing your Drupal Site - Vancouver League of Drupallers
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Mobilizing your Drupal Site - Vancouver League of Drupallers

4,202

Published on

Presentation I gave on Thursday 27th May 2010 demonstrating the mobile_tools module and Mobile theme as a way to create a 'mobile verion' of a drupal website.

Presentation I gave on Thursday 27th May 2010 demonstrating the mobile_tools module and Mobile theme as a way to create a 'mobile verion' of a drupal website.

Published in: Technology
0 Comments
10 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
4,202
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
10
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1.  
  • 2. Introduction <ul><li>Who is this chap?
  • 3. What's this going to cover? </li><ul><li>'Entry level' Drupal mobile integration – a starting point for you to explore more </li><ul><li>Downloading & Installing Modules
  • 4. Themeing
  • 5. Module Stuff </li></ul><li>Experts – don't leave. </li><ul><li>Your input is much appreciated
  • 6. What am I doing wrong? </li></ul></ul></ul>
  • 7. Why Mobile? <ul><li>Mobile browsing is big & getting bigger </li><ul><li>Surpassing or surpassed 'desktop' access to the web </li></ul><li>Clients are asking for it </li><ul><li>Noticeable increase in mobile interest </li></ul></ul>
  • 8. Do you need a mobile site? <ul><li>Does your site have data that people need to access 'on the go' </li><ul><ul><li>Looking for answers, facts, details </li></ul></ul><li>Not Screen Size but Context
  • 9. Examples: </li><ul><li>Tourism Sites </li><ul><li>Listings, Upcoming Events, Nearest Information Kiosks </li></ul><li>Brochure Sites </li><ul><li>Contact Details / Location Information
  • 10. Key Information </li></ul></ul></ul>
  • 11. Mobile Site Recipes <ul><li>Lots of alternatives </li><ul><li>3 rd party vs D.I.Y. </li></ul><li>Ingredients I used: </li><ul><li>Drupal 6
  • 12. Theme: Mobile
  • 13. Modules: </li><ul><li>Mobile Tools
  • 14. Device Detection: </li><ul><li>Browscap
  • 15. Wurfl </li></ul></ul></ul></ul>
  • 16. 2 recipes; same ingredients <ul><li>Really Simple </li><ul><li>Keep the same URL, but switch theme for a mobile device
  • 17. Issues with Performance? </li></ul><li>Simple </li><ul><li>Switch theme and URL for a mobile device
  • 18. Slightly more complicated but not really
  • 19. Buggy in parts </li></ul></ul>
  • 20. In my presentation I went to a browser where I had Drupal 6 installed. I went through the process of enabling the Mobile Tools and Browscap modules, and the Mobile theme. I then demo'd the 'really simple' and 'simple' recipes from the previous slides. If you want to try it, download the modules and give it a go – it's really quite straightforward and self explanatory.
  • 21. Information Architecture <ul><li>Mobile visitors: </li><ul><li>Who are they, and what do they want? </li><ul><li>Contact Details, Directions to... </li></ul></ul><li>Special Architecture for Special people </li><ul><li>Structure content differently
  • 22. Remove fluff – get to the goods as quick as possible </li></ul><li>Mobile Web Initiative – Best Practices </li><ul><ul><li>http://www.w3.org/Mobile/
  • 23. http://www.w3.org/2005/MWI/BPWG/ </li></ul></ul></ul>
  • 24.  
  • 25.  
  • 26.  
  • 27.  
  • 28. Theming Considerations <ul><li>User </li><ul><li>Less Text, Clear Calls to Action, Simple Navigation </li></ul><li>Performance </li><ul><li>Less Imagery, less HTTP requests </li></ul><li>Platforms </li><ul><li>Sub Themes for different platforms: Blackberry vs iPhone vs ...
  • 29. Platform specific coding (meta tags etc.) </li></ul></ul>
  • 30. Building your Mobile Site <ul><li>These are some problems I encountered when creating a mobile site </li><ul><li>Homepage
  • 31. Primary Links
  • 32. Views
  • 33. Content Types </li><ul><li>Field Level Considerations </li><ul><li>Image Fields – different sizes
  • 34. Google Maps – static image maps
  • 35. Phone Numbers <a href=”tel:1.222..... </li></ul></ul></ul></ul>
  • 36. So in the demo, I quickly ran through how I overcame the 4 issues that I highlight in the previous slide. Homepage: Create a new homepage node, and in the settings.php file for your mobile domain, update the $conf variable $conf['site_frontpage'] = 'node/123'; Primary Links: Create a new menu specifically for your mobile website, and use the block for this menu to display only on your mobile theme Views: Create separate views for your mobile site and link to them in your mobile menus Content Types: Use node template files to control node displays in your mobile theme
  • 37. Custom Modules? <ul><li>Mobile tools provides global session variables you can use in your custom modules </li><ul><li>e.g. To do mobile specific form_alters </li></ul><li>What are the variables? </li><ul><li>Look in mobile_tools.module file:
  • 38. $_SESSION['mobile-tools-site-type'] </li></ul></ul>
  • 39. So here in the demo, I just did some super basic code in a custom module: function yourTheme_init() { if($_SESSION['mobile-tools-site-type'] == 'mobile') { drupal_set_message('hello world'); } }
  • 40. Development Tools <ul><li>Useful blog post: http://tinyurl.com/55sk3m
  • 41. Android/Nokia – Download SDK </li><ul><li>Android: http://tinyurl.com/dhcpvy
  • 42. Nokia: http://tinyurl.com/yd9w7en </li></ul><li>Blackberry/Windows Mobile – download simulator (Windows only) </li><ul><li>Microsoft: http://tinyurl.com/23lx9yc
  • 43. Blackberry: http://tinyurl.com/5ogpad </li></ul></ul>
  • 44. Development Tools <ul><li>iPhone </li><ul><li>Safari Web Browser
  • 45. Apple Developers SDK
  • 46. http://www.marketcircle.com/iphoney/ - doesn't seem to resize correctly :( </li></ul><li>Opera Mobile </li><ul><li>http://www.opera.com/mobile/demo/ </li></ul></ul>
  • 47. Development Resources <ul><li>Mobile Internet Architecture </li><ul><li>http://www.slideshare.net/xian/mobile-information-architecture </li></ul><li>Safari HTML Reference – meta tags </li><ul><li>http://developer.apple.com/safari/library/documentation/appleapplications/reference/safarihtmlref/articles/metatags.html </li></ul><li>Drupal Mobile </li><ul><li>http://mobiledrupal.com
  • 48. http://mobiledrupal.com/content/overview-mobile-modules-drupal </li><ul><li>Little bit outdated (links to some modules that aren't supported anymore) but still good & useful </li></ul></ul></ul>
  • 49. The End <ul><li>Thank you for your patience
  • 50. Does anyone have any Questions? </li><ul><li>Does anyone have any Answers? </li></ul></ul>

×