sailing123 Posted March 14, 2019 Share Posted March 14, 2019 Hi I do not want bxslider live on the mobile homepage as to improve the website speed. I have searched around but I do not see how to achieve it. Surely I need to make some adjustments in CSS. Thanks for your help. S. Link to comment Share on other sites More sharing options...
fabriceunko Posted March 14, 2019 Share Posted March 14, 2019 I respond to this post because I am also interested in this and I do not know how to follow a post without answering. Link to comment Share on other sites More sharing options...
havenswift-hosting Posted March 14, 2019 Share Posted March 14, 2019 7 minutes ago, fabriceunko said: I do not know how to follow a post without answering. Click on the "Follow" button top right of the page just above the green "Reply to this topic" button Link to comment Share on other sites More sharing options...
bsmither Posted March 14, 2019 Share Posted March 14, 2019 Please remind us what skin(s) you are using? The solution could be different depending if you are using a responsive skin or a pair of non-responsive skins (a normal and a separate mobile skin). Link to comment Share on other sites More sharing options...
fabriceunko Posted March 14, 2019 Share Posted March 14, 2019 I use the skin foundation standard Link to comment Share on other sites More sharing options...
bsmither Posted March 14, 2019 Share Posted March 14, 2019 The solution is going to involve having CubeCart make a decision on how to deal with the HomePage document. This before CubeCart sends the finished page to the browser so as to not include the <ul class="bxslider"> block of code. By removing this block of code, the <img> tags will not be present and so the total time to finally display the page will be lessened. On the other hand, if you just want to hide it on a mobile skin, we can create a simple CSS rule: .bxslider { display:none;} To hide it on a responsive screen: The html in the document would be: <ul class="show-for-medium-up bxslider"> Getting back to not including it, we need a version of CubeCart that includes the ability to parse Smarty tags. In admin, Documents, click the edit icon for any document. On the General tab, check for the presence of the "Parse Smarty Tags" checkbox. Link to comment Share on other sites More sharing options...
bsmither Posted March 14, 2019 Share Posted March 14, 2019 So, the one scenario that is proving difficult to solve is when a responsive skin is being shown on a mobile device. CubeCart might not know this is happening because the browser takes care of everything. So, we need to know if the browser can be told (somehow) to not load images if a CSS rule says "hide_for_small" (might be inside a media query). Or we can ask CubeCart if it detected the device is mobile. Link to comment Share on other sites More sharing options...
bsmither Posted March 14, 2019 Share Posted March 14, 2019 Unfortunately, the Github issue #1226 has not yet been implemented (as of CC622), so CubeCart will not run code to determine if a mobile device is being used when a responsive skin is in play. Link to comment Share on other sites More sharing options...
bsmither Posted March 14, 2019 Share Posted March 14, 2019 Ok, so with a short Hook Snippet, we can override CC6's insistence that, if using a responsive skin, all aspects pertaining to "mobile" be ignored. Thus, if on a mobile device, the entire "bxslider" code block is discarded from the document. Complete instructions shortly. Link to comment Share on other sites More sharing options...
bsmither Posted March 14, 2019 Share Posted March 14, 2019 The scenario is that there is some part of a document where the HTML for that part must not be present when the document is being displayed on a mobile device. The version of CubeCart must support parsing Smarty tags in the document (apparently, all versions of CC6). The mobile device must send a User Agent (UA) string that CubeCart will recognize as being a mobile device. When editing the Content of a document (the HomePage's BXSlider,Ā for example), use the following: {if !GUI::getInstance()->mobile} <ul class="bxslider"> <li><img src="skins/foundation/images/examples/slide1.jpg" title="Message Foo" /></li> <li><img src="skins/foundation/images/examples/slide2.jpg" title="Message Bar" /></li> <li><img src="skins/foundation/images/examples/slide3.jpg" title="Message Baz" /></li> </ul> {/if} Be sure to have "Parse Smarty Tags" setting enabled. Then, create a snippet. In admin, Manage Hooks, Code Snippets tab, click Add Snippet. In the form that appears, fill in fields as follows: Enabled: Checked Unique ID: force_detect_mobile@CC6+ Execution Order: 1 Description: Forces CubeCart to detect if a mobile device Trigger: class.gui.css Version: 1.0 Author: https://forums.cubecart.com/topic/54744-how-to-turn-bxslider-off-on-mobile-homepage PHP Code: <?php $current_disable_mobile_skin_setting = $GLOBALS['config']->get('config', 'disable_mobile_skin'); $GLOBALS['config']->set('config', 'disable_mobile_skin', false); $this->_detectMobile(); $GLOBALS['config']->set('config', 'disable_mobile_skin', $current_disable_mobile_skin_setting); The reason we use the "class.gui.css" hook is because CubeCart processes this hook early - before processing the action of getting a document ready for display. It also has to be a hook in the GUI class because that is where the private code is located that determines if the UA string is mobile. Let me know if I left anything out. Link to comment Share on other sites More sharing options...
fabriceunko Posted March 15, 2019 Share Posted March 15, 2019 Hello, I'm going to test today but can you tell me where is Parse Smarty Tags I've already seen it but I can not find it anymore .. Link to comment Share on other sites More sharing options...
bsmither Posted March 15, 2019 Share Posted March 15, 2019 In admin, Documents, click the Edit icon for any document. On the General tab, there will be a checkbox for "Parse Smarty Tags". It applies to this this document. Link to comment Share on other sites More sharing options...
sailing123 Posted March 15, 2019 Author Share Posted March 15, 2019 Works a treat bsmither, thanks a lot. You would not believe how much difference this little trick made to my mobile speed test via Google, moved from 70 to 82 ! Still some work to be done but I am super pleased with that result ! Thanks again. S. Link to comment Share on other sites More sharing options...
fabriceunko Posted March 15, 2019 Share Posted March 15, 2019 so i was super happy because i see sailing123 that it works .. but in my case nothing works i always have the same thing on mob phone or on my pc. Link to comment Share on other sites More sharing options...
sailing123 Posted March 15, 2019 Author Share Posted March 15, 2019 Fabrice, 1. Did you turn on Smarty tags once you are in the documents / homepage ? 2. Is your code snippet looking like this: Ā Link to comment Share on other sites More sharing options...
fabriceunko Posted March 15, 2019 Share Posted March 15, 2019 that's what I did then Ā then I am under cubecart 6.2.4 and when I go to my site with my phone nothing has changed Link to comment Share on other sites More sharing options...
sailing123 Posted March 15, 2019 Author Share Posted March 15, 2019 Looking all good from my point of view but I am not an expert.Ā I hope bsmither will see where the issue lies. By the way, I noticed that your slider images were not resizing with the screen size. I had the same problemĀ until I removed the height of the images in the homepage documentĀ although now not really an issue as the slider is off on mobile screens.Ā Link to comment Share on other sites More sharing options...
bsmither Posted March 15, 2019 Share Posted March 15, 2019 Using your phone, it may be virtually impossible to determine what the User Agent string may be. However, examining the access logs maintained by the web server hosting your site will show it. (Visit your hosting account's control panel and look for Logs.) It could be that the UA string of your phone fails to match the pattern used by CubeCart to detect a mobile device. On the other hand, I am able to customize my browser to use a user-supplied UA string that I know CubeCart would see. That is how I tested this project. Visiting your site with same setting on my browser, indeed, the page contents do not change. I also see some strange-looking cookies. Would these indicate some sort of server-level caching? After making the edits to the source code of the HomePage document, did you clear CubeCart's cache? (I assume you know this by now, but I still have to ask.) Ā Link to comment Share on other sites More sharing options...
fabriceunko Posted March 15, 2019 Share Posted March 15, 2019 2 hours ago, sailing123 said: Looking all good from my point of view but I am not an expert.Ā I hope bsmither will see where the issue lies. By the way, I noticed that your slider images were not resizing with the screen size. I had the same problemĀ until I removed the height of the images in the homepage documentĀ although now not really an issue as the slider is off on mobile screens.Ā if I erase the height it breaks the slide yes I always erase the cache Ā Link to comment Share on other sites More sharing options...
bsmither Posted March 15, 2019 Share Posted March 15, 2019 I wonder if CubeCart is overwriting the Content (as shown in a post above) with a translation. I note that the French version of the HomePage document has seven images on the BXSlider, the English-US version has six images, and the English-UK version has three images. When in admin, Documents, do the flags in the Language and Translations columns make sense? Link to comment Share on other sites More sharing options...
fabriceunko Posted March 15, 2019 Share Posted March 15, 2019 I did not make the change on all languages but only on French. I will try to do it everywhere Ā I edit in all languages and erase the cache. no difference. Link to comment Share on other sites More sharing options...
bsmither Posted March 15, 2019 Share Posted March 15, 2019 We need to look deeper. In the CubeCart file /classes/gui.class.php: Near line 152, find: $css = array(); foreach ($GLOBALS['hooks']->load('class.gui.css') as $hook) include $hook; $GLOBALS['smarty']->assign('CSS', $css); Just BEFORE those statements, add: $GLOBALS['debug']->debugMessage("Before, the GUI::mobile variable is ".(($this->mobile)?"True":"False")); And then just after those statements, add: $GLOBALS['debug']->debugMessage("After, the GUI::mobile variable is ".(($this->mobile)?"True":"False")); In admin, Store Settings, Advanced tab, "Enable Debugging" set to Enabled, and enter your IP address in the next field (www.whatismyip.com). When you next ask for the storefront page, there will be a long grey 'debug' section at the bottom of the page. Near the bottom of the debug section will be any Debug Messages. Are there any and what do they say? Link to comment Share on other sites More sharing options...
fabriceunko Posted March 15, 2019 Share Posted March 15, 2019 Debug Messages: [0] Before, the GUI::mobile variable is False [1] After, the GUI::mobile variable is False Link to comment Share on other sites More sharing options...
bsmither Posted March 15, 2019 Share Posted March 15, 2019 Interesting. That suggests that the snippet is not getting executed, or the statement in the snippet: $this->_detectMobile(); is failing, or some other code is interfering with theĀ GUI::mobile variable. Bring the snippet code up for editing. Change to: <?php $current_disable_mobile_skin_setting = $GLOBALS['config']->get('config', 'disable_mobile_skin'); $GLOBALS['config']->set('config', 'disable_mobile_skin', false); $GLOBALS['debug']->debugMessage("Before _detectMobile(), the GUI::mobile variable is ".(($this->mobile)?"True":"False")); $this->_detectMobile(); $GLOBALS['debug']->debugMessage("After _detectMobile(), the GUI::mobile variable is ".(($this->mobile)?"True":"False")); $GLOBALS['config']->set('config', 'disable_mobile_skin', $current_disable_mobile_skin_setting); This new code narrows where the likely problem might be found. Link to comment Share on other sites More sharing options...
fabriceunko Posted March 15, 2019 Share Posted March 15, 2019 Well done .. it works perfectly now. I thank you very much and I am happy thanks to you and your availability! Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.