Jump to content

Need help including class to detect mobile phones

maycontainweasel

By maycontainweasel
in Core developers

 Share

Recommended Posts

maycontainweasel Newbie

maycontainweasel

Posted
Posted

Hey everyone

 

I'm a basic php developer but i'm really having issues figuring out smarty & php in Prestashop.

i've only just realized that you can't use php in smarty..

 

could someone please point me in the right direction..

 

this is my situation,

 

----

I bought a theme which already responds to different devices..

 

I've needed to replace the menu with a mega menu, so i used a module,

but i dont want the mega menu on an iphone, i want to use the normal menu for the iphone design

 

which means i'd need both but display either when appropriate..

 

so my logic is to include this class into my theme,

 

http://mobiledetect.net/

https://github.com/serbanghita/Mobile-Detect

 

i was hoping i could use php conditionals to detect mobile devices and then display the mega menu when not a mobile and the normal menu when the user is using a mobile..

-----

 

questions.

 

Does anyone have a better approach that i'm not aware of?

if it is appropriate how can I use php in smarty templates.. or how do i activate smartyBC?

how do i niclude this class in my theme and call it from the header.tpl.

 

sorry for the broadness of this i'm really lost

please can someone advise :)

 

Thanks in advance

Michael

Link to comment
Share on other sites
ebonit Newbie

ebonit

Posted
Posted

first of all, start reading this:

http://doc.prestashop.com/display/PS15/Creating+a+PrestaShop+module

that will give you some basic insight in how a module works...

 

and for Smarty:

http://www.smarty.net/docs/en/

 

 

Then: one quick and dirty aproach is to edit you megamenu module

 

you do the php logic in the /module/yourmenumodule/yourmenumodel.php

most probably there is a public function hookDisplayHeader()

in there you can set a smarty variable: $this->smarty->assign('devicetype', $device);

 

in the menu template, you do:

 

{if $device == 'iphone'}

here your iphone compatible menu html

{elseif $device == 'ipad'}

here your ipad compatible menu html

{elseif $device == '' }

here your megamenu html code

{/if}

 

 

you can also use includes for every menutype in your smarty if/else code to keep think a bit more clean

 

be aware that if you change the module, your changes will be lost when you update the module.....

Link to comment
Share on other sites
  • 3 months later...
misthero Newbie

misthero

Posted
Posted

this is how I got it done, I needed a mobile/desktop class without mobile theme enabled

 

override FrontController.php

 

inside "public function init()"

 

add

 

require_once(_PS_TOOL_DIR_.'mobile_Detect/Mobile_Detect.php');
 $this->mobile_detect = new Mobile_Detect();
 $mobile_class = 'desktop';
 if ($this->mobile_detect->isMobile()){
  $mobile_class = 'mobile';
 }

 

then assign $mobile_class to smarty

 

$this->context->smarty->assign(array(
// Usefull for layout.tpl
'mobile_device' => $this->context->getMobileDevice(),
'isMobile' => $mobile_class,
...
....

 

now open your header.tpl find the body tag and add {$isMobile} inside the class attribute like this:

 


<body class="{$isMobile} {if $hide_left_column}hide-left-column{/if}">

 

now you will get body class "mobile" or "desktop" depending on the device and regardless you have an active mobile theme, the rest is a matter of css and javascript, or you can hide/ show parts of your theme with smarty itself like this

 

{if $isMobile == 'mobile'}
 //this will only show if you are on a mobile
{else}
 //this will only show if you are on a desktop
{/if}

  • Like 2
Link to comment
Share on other sites
  • 8 months later...
  • 3 weeks later...
misthero Newbie

misthero

Posted
Posted (edited)

Hi,

 

Thanks for your help, but I think that incomplete the info in:

 

"then assign $mobile_class to smarty"

 

I cant do it this work.

Any help?

 

Thanks.

did you followed the example?

 

find this in your overridden front controller (it is around line 314)

$this->context->smarty->assign(array(

// Usefull for layout.tpl
'mobile_device' => $this->context->getMobileDevice(),

and add:

'isMobile' => $mobile_class,

the result will be like this :

$this->context->smarty->assign(array(
// Usefull for layout.tpl
 'mobile_device' => $this->context->getMobileDevice(),
'isMobile' => $mobile_class,
...
....
Edited by misthero (see edit history)
Link to comment
Share on other sites
misthero Newbie

misthero

Posted
Posted

I dont have overriden FrontController :(

 

to override FrontController.php just copy "classes/controller/FrontController.php"

in "ovverride/classes/controller/FrontController.php"

if the override folders doesn't exist create it

 

now open ovverride/classes/controller/FrontController.php

 

and where you see at the beginning:

class FrontControllerCore extends Controller

replace with

class FrontController extends FrontControllerCore

save and you have overridden the front controller

 

sometime may be necessary to delete the file cache/class_index.php (don't worry the system will recreate it automatically)

 

have fun

Link to comment
Share on other sites
  • 1 month later...
misthero Newbie

misthero

Posted
Posted

Hi,

 

There are many of header.tpl in my prestashop folder, would you specify which header.tpl and more info twhere and which line I need to add this

 

<body class="{$isMobile} {if $hide_left_column}hide-left-column{/if}">

 

thanks

 

but only one in your active theme folder, that is the correct one, this should be in the path: themes/mythemename/header.tpl

 

where "mythemename" is the name of your theme

Link to comment
Share on other sites
akhumaini Newbie

akhumaini

Posted
Posted (edited)

Hi Misthero,

 

Thank your for answering my question, I have following all the procedure above.

 

However I got white screen when following the procedure above when opening on my desktop and mobile.

This is probably below command in FrontController.php

require_once(_PS_TOOL_DIR_.'mobile_Detect/Mobile_Detect.php');
	 $this->mobile_detect = new Mobile_Detect();
  $mobile_class = 'desktop';
  if ($this->mobile_detect->isMobile()){
   $mobile_class = 'mobile';
  }

When I removed it, the website content is displayed properly,

 

Would you advice what is wrong here

 

Thanks

Edited by akhumaini (see edit history)
Link to comment
Share on other sites
misthero Newbie

misthero

Posted
Posted

Hi Misthero,

 

Thank your for answering my question, I have following all the procedure above.

 

However I got white screen when following the procedure above when opening on my desktop and mobile.

This is probably below command in FrontController.php

require_once(_PS_TOOL_DIR_.'mobile_Detect/Mobile_Detect.php');
	 $this->mobile_detect = new Mobile_Detect();
  $mobile_class = 'desktop';
  if ($this->mobile_detect->isMobile()){
   $mobile_class = 'mobile';
  }

When I removed it, the website content is displayed properly,

 

Would you advice what is wrong here

 

Thanks

 

I have not enough details, enable developer mode and try again so you will get an error message instead of a blank page specifiyng what's wrong, than copy that error and show us here

 

to enable developer mode open defines.inc.php and set _PS_MODE_DEV_ to TRUE:

 

define('_PS_MODE_DEV_', true);
Link to comment
Share on other sites
akhumaini Newbie

akhumaini

Posted
Posted

Below is the error after enable developer mode :

Parse error: syntax error, unexpected 'require_once' (T_REQUIRE_ONCE), expecting '&' or variable (T_VARIABLE) in /home/rajamcom/public_html/classes/controller/FrontController.php on line 97

Link to comment
Share on other sites
misthero Newbie

misthero

Posted
Posted

Below is the error after enable developer mode :

Parse error: syntax error, unexpected 'require_once' (T_REQUIRE_ONCE), expecting '&' or variable (T_VARIABLE) in /home/rajamcom/public_html/classes/controller/FrontController.php on line 97

that is a "syntax error" probably you pasted the code in the worng place breaking PHP syntax somewhere

 

when you have a function like

public function init() { .... }

your code should be between the {.....}

try this way,

inside the init function locate this line:

 

$this->context->smarty->assign(array(

// Usefull for layout.tpl

.....

 

and paste the code just BEFORE it

 

it should appear something like this:

 

foreach ($languages as $lang)
$meta_language[] = $lang['iso_code'];

/* START mobile/desktop classes declaration */
require_once(_PS_TOOL_DIR_.'mobile_Detect/Mobile_Detect.php');
$this->mobile_detect = new Mobile_Detect();

$mobile_class = 'desktop';
if ($this->mobile_detect->isMobile()){
$mobile_class = 'mobile';
}
/* END mobile/desktop classes declaration */

$this->context->smarty->assign(array(
// Usefull for layout.tpl

 

Link to comment
Share on other sites
  • 1 year later...
  • 3 months later...
pedroserapio Newbie

pedroserapio

Posted
Posted

Nice tip. Did what I need.

I just have one question, I applied this method inside the product-list.tpl and I ask to break the foreach after displaying 4 products in phone, and to break after displaying 6 products in desktop. After I clear the cache and open the website in desktop, it displays 6 products but also in mobile. If I clean and open in mobile, it displays 4 products but also in desktop. I guess this is a question of smarty cache. How can I rebuild the product-list every time? My only concern it's optimization, maybe will get impact in website performance.

 

My best regards.

Link to comment
Share on other sites
  • 4 months later...
  • 1 month later...
  • 6 months later...
  • 10 months later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing
×
×
  • Create New...