mobilize drupal
DESCRIPTION
TRANSCRIPT
Azri
AGENDA Me and my company Why Mobile Web is important Example Drupal sites on Mobile Mobile Tools Responsive Theme with Demo Mobile Native Apps Questions ????
Azri
‘Me’
My villageHUZURABAD
Azri
More about ‘Me’• I build applications on Drupal• I am an active contributor of code on
Drupal, jQuery and PHP communities• One of my projects, a real-time
collaboration suite was showcased at TechCrunch 50 in SF
• I build Facebook Applications• ...
Azri
My CompanyWe are based in
We code on
We build products & solutions using
Azri
Powerful Search Implementations onDrupal
Why Mobile Web is important ?
Azri
Azri
Azri
Some Drupal Sites on Mobile
Azri
Whitehouse.gov
Azri
newhope360.com
Azri
Consumersearch.com
Azri
Drupalcampdeccan.org
Azri
How to mobilize Drupal site?
Azri
Mobile Tools module A Custom mobile theme For extra special layouts, need 'Panels'
Azri
Mobile ToolsDetection of user agentAutomatic redirection to mobile siteAutomatic theme switching, based on device type (iphone, Android, ...)Integration with Panels, Node DisplaysAdding mobile context to permissioning systemChange number of nodes display for mobile
Azri
Custom Mobile ThemeBuild mobile theme using Fusion Mobile Nokia Mobile Theme Mobile Garland
Azri
Custom Layout for mobile Mobile layouts with Panels and Mobile
Tools Resize image content with CCK
display settings For images embeded in node use
TinySrc module
Azri
Responsive Design
Azri
Azri
Azri
Responsive Themes Omega
http://drupal.org/project/omega Adaptive Themes
http://drupal.org/project/adaptivetheme
Azri
Media Queries@media screen and (min-width: 480px) { .content { float: left; } .social_icons { display: none } // and so on...}
Azri
Recommended Widths 320px 480px 600px 768px 900px 1200px
Azri
Mobile Native Apps Use Services module and build API Use Titanium to build Mobile Apps
which interact with Drupal API
Azri
Titanium
Azri
Titanium Project
Azri
App.js
Azri
Call to Drupal API
Azri
Referencehttp://www.chapterthree.com/blog/elly-
jonez/drupal-and-mobile-are-friendshttp://drupal.org/project/mobile_toolshttp://drupal.org/project/fusion_mobilehttp://www.alistapart.com/articles/resp
onsive-web-design/