Drupal 7 a mobilní web: pár tipů a více povzdychnutí

Když se začnete pídit po tom, jak udělat mobilní web pomocí Drupalu 7, vyjede vám sice spousta zaručených návodů, množství modulů i témat vzhledu, ale realita je trošku mimo. Ne všechno funguje úplně skvěle, jak by se na první pohled zdálo.

Oblast mobilních webů v kombinaci s Drupalem 7 je pro mě jedna velká černá díra. Vytvořit téma vzhledu, které bude vypadat dobře na mobilu, to problém není. Stejně tak není problém vytvořit „responsive“ web, jehož grafika se bude přizpůsobovat rozměrům displeje, resp. prohlížeče.

Ovšem v mnoha situacích potřebujete mít prostě samostatné mobilní téma vzhledu a v něm úplně jiné bloky než na desktopové verzi. V takovou chvíli potřebujete spolehlivý nástroj, který dovede přepínat téma vzhledu podle toho, jaký prohlížeč na web zrovna kouká.

Pro Drupal existuje takovýchto přepínačů spousta. Radost z toho ale brzy zkazí zjištění, že většina těchto modulů je ve stabilní verzi jen pro starší Drupal 6. V sedmičce buď jejich vývojové verze fungují s problémy, nebo ani neexistují. Pár řešení, jak zprovoznit přepínání na mobilní vzhled v Drupalu 7 existuje, ale fungují spolehlivě jen do okamžiku, kdy se rozhodnete zapnout cacheování.

Drupal 7, cache a mobilní vzhled? To nejde dohromady

Myslím, že se touto problematikou trápím už něco přes rok. Vždy, když jsem našel dobře vypadající řešení pro přepnutí vzhledu webu na mobilní téma, narazil jsem na problém, který mají úplně všechny moduly. Tím je cache Drupalu. V momentě, kdy zapnete cacheování stránek pro anonymní uživatele, můžete se se spolehlivostí přepínátka na mobilní vzhled rozloučit.

Drupal totiž cacheuje jednotlivé stránky podle jejich URL. Pro přepínání na mobilní vzhled to má neblahý důsledek. Začněme s prázdnou cache. Na web se podívá první nepřihlášený návštěvník pomocí počítače nebo notebooku. Do cache se stránka uloží s výchozím tématem vhledu. Nyní se na web podívá někdo nepřihlášený přes mobil. Správně by mělo dojít k přepnutí na mobilní vzhled, ale jelikož je stránka již uložena v cache s desktopovou verzí, pošle se do mobilu desktop.

A obráceně. Začneme zase s prázdnou cache. Jako první se na web podívá nepřihlášený „mobilista“. Když pak na web koukne někdo z počítače, načte se mu mobilní vzhled, protože ten byl uložen do cache jako první.

Jak z toho ven? Snadno, stačí vypnout cacheování a nepoužívat jej. Jenže takové řešení je podle mého názoru špatné. Navíc u velkých webů je zapnutá cache nezbytností, jinak to brzy negativně pocítíte na jejich rychlosti načítání.

Přiznám se, že řešení neznám a pokud někdo ze zdejších čtenářů už něco podobného řešil, budu rád, když se o své zkušenosti rozdělí. Většina návodů na internetu totiž kombinaci přepínání na mobilní vzhled se zapnutou cache jaksi zapomíná řešit (zřejmě kvůli popsaným problémům).

Snad nejrozumnější kompromis, který se blíží ideálu (ale jen blíží) je použití modulu Dynamic Cache, který vám poskytne API pro dynamické vypnutí cache v závislosti na nějaké podmínce. Můžete tedy ve svém modulu zkusit implementovat funkci hook_boot() a zde pomocí Dynamic Cache cacheování vypnout v případě, že na web někdo kouká v mobilním prohlížeči. Příklad takového použití najdete v tomto komentáři na drupal.org. Potřebujete k tomu ještě modul Browscap.

Výsledkem by mělo být, že na mobilu se nikdy cache neuplatní, takže se nenačte cacheovaná desktopová verze ani se mobilní verze do cache neuloží. Musíte samozřejmě počítat s jedním ALE, a sice, že web v mobilu tak může být kvůli vypnuté cache pomalejší. V praxi jsem toto řešení ale zatím nezkusil.

Pokud nezapnete cache, jde to jako po másle. Skoro

V případě, že se rozhodnete cache kvůli bezproblémové podpoře mobilního tématu vzhledu pro Drupal 7 nezapínat, pak je situace poměrně jednoduchá. Z několika momentálně dostupných řešení pro přepínání na mobilní vzhled mohu doporučit dvoje. Na www.cnews.cz používáme starší modul Mobile Tools 2 s množstvím dodatečných patchů. Vývojovou trojkovou a modernější verzi se mi bohužel nepodařilo rozchodit.

Problém Mobile Tools je v tom, že to s jeho dalším vývojem nevypadá zrovna nejlépe. Z tohoto pohledu je na tom lépe modul Mobile Theme, který se také mnohem jednodušeji nastavuje. Jenom si v něm zapnete, které téma vzhledu se má aplikovat pro mobilní prohlížeče. Bohužel zde není možnost se v mobilu přepnout na desktop.

Pominu-li popsané problémy s cache, pak je z mého pohledu nejzajímavější modul Mobile Switch. Umí toho docela dost a hlavně se dále vyvíjí a je udržován. Stačí se podívat na data vydání aktuálních verzí.

Detekci mobilního prohlížeče provádí Mobile Switch pomocí knihovny Mobile Detect, kterou je potřeba nakopírovat do složky sites/all/libraries dle přiloženého návodu. Poté je potřeba zapnout modul Libraries. Teprve se zapnutými Libraries zapněte Mobile Switch, v opačném případě skončí instalace modulu chybou. Podrobnosti najdete v readme.

Trošku náročnější instalace mobilního přepínátka Mobile Switch je však jediná složitější věc u tohoto modulu. Po jeho zapnutí jděte do administrační části Konfigurace > Uživatelské rozhraní > Mobile Switch.

V základním nastavení si z rozbalovací nabídky Mobile Theme vyberte téma vzhledu, které se použije v mobilních prohlížečích. Na drupal.org najdete řadu výchozích témat vzhledu vhodných pro mobilní prohlížeče, musíte si je ale nastylovat, většina z nich slouží jen jako výchozí témata.

Můžete si rovněž vybrat, zda se mobilní téma aplikuje na tabletech a na administračních stránkách. V pokročilém nastavení lze pak automatické přepínání na mobilní vzhled vypnout – uživatel by tak musel použít přepínátko v bloku z doplňujícího modulu Mobile Switch Block.

Pro ladění můžete zapnout také podporu detekce emulátorů mobilních prohlížečů nebo si nechat zobrazovat mobilní vzhled na desktopu.

Jak vidíte, pokud si odmyslíme problémy s cache, je zapnutí přepínače na mobilní vzhled v Drupalu 7 celkem snadné. Z mého pohledu je však nedostupnost cache v této kombinaci natolik limitující, že na vlastních webech podobnou funkcionalitu zatím nemám. Jak jste na tom vy? A mimochodem, uvítali byste Maxiorla v mobilní podobě?

Tagy

Buďme ve spojení, přihlaste se k newsletteru

Odesláním formuláře souhlasíte s podmínkami zpracováním osobních údajů. 
Více informací v Ochrana osobních údajů.

Autor článku: Jan Polzer

Tvůrce webů z Brna se specializací na Drupal, WordPress a Symfony. Acquia Certified Developer & Site Builder. Autor několika knih o Drupalu.
Web Development Director v Lesensky.cz. Ve volných chvílích podnikám výlety na souši i po vodě. Více se dozvíte na polzer.cz a mém LinkedIn profilu.

Komentáře k článku

návštěvník

V mobilním zobrazení je budoucnost. Takže jsem za to, aby maxiorel byl i eMkový. Akorát já to asi nevyužiji - mám brýle a proto weby procházím velkým monitorem... Na mobilu jsou weby pro mě moc titěrné :-)

Jinak pane Polezer moc děkuji, že se o nás Drupalisty tak pěkně staráte. Moc rád čtu vaše články.

návštěvník

Souhlasím, že v mobilním prohlížení je budoucnost a uvítal bych mobilní verzi orla. Bohužel, bez cache je Drupal otrava pro všechny (už se těším na osmičku, ta má prý svištět) takže až to modul Mobile Theme bude podporovat, půjdu do toho taky.

návštěvník

Co při návštěvě z mobilního zařízení směrovat návštěníka na subdoménu m.vasweb.tld která bude tahat data i z databáze desktoptového webu?

Profile picture for user Jan Polzer

Jo, to je jedna z možností. Ovšem v Drupalu by se musel asi upravit index.php, na jehož začátek by se dala detekce a rozcestník. Jinak se bojím, že by do toho zase promlouvala cache. Osobně ale nejsem příznivcem tohoto řešení, protože pak vznikají články na duplicitních adresách. Navíc zásah přímo do jádra Drupalu taky není hifi. Apropo, existuje nějaké řešení přesměrovávající web na základě detekce prohlížeče už třeba webserverem nějak v .htaccess?

Profile picture for user Jan Polzer

To je asi ono! Děkuji. Zřejmě bych se měl lépe naučit používat Google. Ale hledal jsem, hledal...

návštěvník

Duplicita by šla vyřešit pomocí robots.txt, viz http://drupal.the-aim.be/block-subdomain-indexing-google

návštěvník

Maxiorla čtu z mobilu už teď. Spíš bych ocenil mobile-first responsivní téma než speciálku. Většina webů zvláštní bloky nepotřebuje a Maxiorel.cz taky ne.

návštěvník

Tak jsem se koukal. Na nasem webu mame zapnuty Cache bloku. JInak by jsme mobilni verzi potrebovali jako sul :O. Dotaz je, jestli muzeme vypnout cache bloku a pak isntalovat jeden z vyse uvedenym modulu, nebo radsi nechat profika at se na to koukne..

Profile picture for user Jan Polzer

Obávám se, že tento článek je už v době responzivních webů mimo mísu. Nemá smysl dělat něco jako "samostatnou mobilní verzi" webu.

Přidat komentář

Odesláním komentáře souhlasíte s podmínkami Ochrany osobních údajů

reklama
Moje kniha o CMS Drupal

 

Kniha 333 tipů a triků pro Drupal 9


Více na KnihyPolzer.cz

Sledujte Maxiorla na Facebooku

Maxiorel na Facebooku

Poslední komentáře
Hosting pro Drupal a WordPress

Hledáte český webhosting vhodný nejenom pro redakční systém Drupal? Tak vyzkoušejte Webhosting C4 za 1200 Kč na rok s doménou v ceně, 20 GB prostoru a automatické navyšováním o 2 GB každý rok. Podrobnosti zde.

@maxiorel na Twitteru

Maxiorel na Twitteru