How to customize the iPhone version of your Morph powered Joomla site
Today, everybody and their dog browse the internet using a mobile device. Mobile browsing is increasing and you can (should?) show your website visitors a different, mobile browsing friendly version of your site.
Based on popular demand, each themelet on the Morph framework
has its own unique iPhone layout.
If you’ve enabled iPhone compatibility
in Morph’s Configurator, then that’s the layout your website visitors automatically see when browsing your site on an iPhone. As easy as a flip of a switch.
This blog post is focused on how to configure the iPhone version of your Morph powered Joomla website
You turn iPhone compatibility ON/OFF from within Configurator
Go to the tab Customize
> iPhone Compatibility
, where you can also set which header
images to be used.
The webclip icon is used when someone saves your site to their iPhone home screen. It is also displayed at the top of the layout, next to your sites name.
Your iPhone graphics
(header/webclip) are located in the “/morph_assets/iphone” folder of your Joomla site root and is accessible from within Configurator’s tab Your Assets
Available module positions
The iPhone optimized version of Morph has its own module positions. This allows you to display different content to users browsing your site on their iPhone
The diagram below shows the available positions, which are iphonenav
position is used to display the iPhone specific menu, which means that you can display only the links that are relevant to someone browsing your site on a mobile device.
positions are positioned outside the main content block and they work similarly to the outer shelves in Morph. (Learn more about Morph’s layout system
You will also notice that the default Joomla contact form has been optimized for the iPhone, making it easy for the person browsing your site to get in touch.
If you want to customize it further than a few point’n clicks in Configurator, you can easily do so by adjusting the iphone.css located in the themelets css folder. Learn more about Morph’s developer options.
Learn more about the Morph framework for Joomla
Tags: configurator, framework, Joomla, Morph, themelets, usability