Differences

This shows you the differences between two versions of the page.

--- litespeed_wiki:cache:litemage:seperate-mobile-versions-magento [2017/05/15 16:27]
Jackson Zhang
+++ litespeed_wiki:cache:litemage:seperate-mobile-versions-magento [2019/07/10 18:16]
Jackson Zhang
@@ Line 1: / Line 1: @@
-====== Handling Magento store mobile view with string match design exceiption ======
+====== Handling Magento Store Mobile View With String Match Design Exception ======
-To handle Magento mobile view, you may either add string match design exception or use separate mobile view Magento plugin. Separate mobile view through Magento plugin may bring cache implementation complexity and may require the code change, which is out of the scope of this wiki.  This wiki will focus on how to achieve the mobile view through exact string match by adding design exception.
+To enable a mobile view in Magento, you may either add a string match design exception or use a separate mobile view Magento plugin. To use a Magento plugin for a separate mobile view may bring cache-implementation complexity that requires a change to the code. This is out of the scope of this wiki.
-First, pick the preferred mobile Magento theme, such as default package bbdistributions template, or other theme.
+Let's focus on how to achieve the mobile view through an exact string match by adding design exceptions:
-Second, in the value field enter the name of your installed mobile theme.
-Next, you should add exceptions for the mobile devices. Navigate to the Magento administrative area -> System -> Configuration -> Design -> Themes. Click on the Add Exceptions buttons beside the Templates, Skin and Layout labels. Enter the following line in the Matched Expression field:
+  -Navigate to the Magento administrative area: **System -> Configuration -> Design -> Themes**.
+  -Pick the preferred mobile Magento theme, such as the default package's bbdistributions template, or other theme.
+  -Click on the **Add Exceptions** buttons beside the **Templates**, **Skin** and **Layout** labels.
+  -In the **Value** fields enter the name of your installed mobile theme.
+  -Enter the following line in the **Matched Expression** fields:
   iPhone|iPod|BlackBerry|Palm|Mobile|Opera Mini|Fennec|Windows Phone
+Like so:
 {{ :litespeed_wiki:cache:common:litemage-mobileview-design-exception.png?800 |}}
+LiteMage needs to cache the website's Mobile version differently than the main version so that mobile pages are not served to desktop users or vice-versa. Add something like the following to the top of the ''.htaccess'' file (these are examples only and you may have your own rules):
-To tell LiteMage to cache the website's Mobile version differently than the main version so they are not mixed up. Do this by adding the following to the .htaccess file (these are just some examples only and you may have your own rules):
 <code>
+<IfModule LiteSpeed>
+RewriteEngine on
 RewriteCond %{HTTP_USER_AGENT} "iPhone|iPod|BlackBerry|Palm|Mobile|Opera Mini|Fennec|Windows Phone"
 RewriteRule .* - [E=Cache-Control:vary=ismobile]
+</IfModule>
 </code>
-Don't add [NC] to the end of "RewriteCond" since in Magento code, the design exception is regular expression match and is case sensitive.
+**Note1:** Don't add ''[NC]'' to the end of ''RewriteCond'' since in Magento code, the design exception is a regular expression match and is case sensitive.
+**Note2:** The above rule must be placed on the very top of the .htaccess to avoid other rules stopping its execution.
+**Important:** Your rewrite rules must //exactly match// your backend's mobile detection (i.e. the string you entered in Step 5 above). If these do not match, your rewrite rules may think that a device is mobile while the backend does not (and vice-versa). This can cause, for example, the desktop version of a page to be cached and flagged as the mobile version which will then be wrongly served to all mobile viewers.
+====== Troubleshooting ======
+===== Case 1:Rewrite rules should be placed at the top of the .htaccess =====
+The user has set up mobile view at Magento 1.8 backend as the following and mobile view is working fine.
+{{ :litespeed_wiki:cache:litemage:magento1-mobileview-case.png?nolink&800 |}}
+After enabling LiteMage, the user setup rewrite rules in .htaccess with exact matching string with above Magento backend setup, however, desktop version is still showing on mobile with LiteMage. What's wrong with it?
+  <IfModule Litespeed>
+  RewriteEngine on
+  RewriteCond %{HTTP_USER_AGENT} "android.+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|iP(hone|od)|iris|kindle|lge |maemo|meego.+mobile|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino|(Android.+Mobile)|NOKIA|SymbianOS|N900|BlackBerry"
+  RewriteRule .* - [E=Cache-Control:vary=ismobile]
+   </IfModule>
+By further checking the full .htaccess file, the above rules have been added to the end of .htaccess.  Other rules like ''RewriteRule .* index.php [L]'' stopped the cache rules being executed.  The cache rule should be always placed on the very top of the .htaccess. After the rules relocated to the top, everything is working fine now.
+<code>
+	<IfModule Litespeed>
+	LiteMage on
+	RewriteEngine on
+	RewriteCond %{HTTP_USER_AGENT} "android.+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|iP(hone|od)|iris|kindle|lge |maemo|meego.+mobile|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino|(Android.+Mobile)|NOKIA|SymbianOS|N900|BlackBerry"
+	RewriteRule .* - [E=Cache-Control:vary=ismobile]
+        </IfModule>
+	############################################
+	## uncomment these lines for CGI mode
+	## make sure to specify the correct cgi php binary file name
+	## it might be /cgi-bin/php-cgi
+	#    Action php5-cgi /cgi-bin/php5-cgi
+	#    AddHandler php5-cgi .php
+	############################################
+	## GoDaddy specific options
+	#   Options -MultiViews
+	## you might also need to add this line to php.ini
+	##     cgi.fix_pathinfo = 1
+	## if it still doesn't work, rename php.ini to php5.ini
+	############################################
+	## this line is specific for 1and1 hosting
+		#AddType x-mapp-php5 .php
+		#AddHandler x-mapp-php5 .php
+	############################################
+	## default index file
+		DirectoryIndex index.php
+	<IfModule mod_php5.c>
+	############################################
+	## adjust memory limit
+	#    php_value memory_limit 64M
+		php_value memory_limit 256M
+		php_value max_execution_time 18000
+	############################################
+	## disable magic quotes for php request vars
+		php_flag magic_quotes_gpc off
+	############################################
+	## disable automatic session start
+	## before autoload was initialized
+		php_flag session.auto_start off
+	############################################
+	## enable resulting html compression
+		#php_flag zlib.output_compression on
+	###########################################
+	# disable user agent verification to not break multiple image upload
+		php_flag suhosin.session.cryptua off
+	###########################################
+	# turn off compatibility with PHP4 when dealing with objects
+		php_flag zend.ze1_compatibility_mode Off
+	</IfModule>
+	<IfModule mod_security.c>
+	###########################################
+	# disable POST processing to not break multiple image upload
+		SecFilterEngine Off
+		SecFilterScanPOST Off
+	</IfModule>
+	<IfModule mod_deflate.c>
+	############################################
+	## enable apache served files compression
+	## http://developer.yahoo.com/performance/rules.html#gzip
+		# Insert filter on all content
+		SetOutputFilter DEFLATE
+		# Insert filter on selected content types only
+		AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/javascript
+		# Netscape 4.x has some problems...
+		BrowserMatch ^Mozilla/4 gzip-only-text/html
+		# Netscape 4.06-4.08 have some more problems
+		BrowserMatch ^Mozilla/4\.0[678] no-gzip
+		# MSIE masquerades as Netscape, but it is fine
+		BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
+		# Don't compress images
+		SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png)$ no-gzip dont-vary
+		# Make sure proxies don't deliver the wrong content
+		Header append Vary User-Agent env=!dont-vary
+	</IfModule>
+	<IfModule mod_ssl.c>
+	############################################
+	## make HTTPS env vars available for CGI mode
+		SSLOptions StdEnvVars
+	</IfModule>
+	<IfModule mod_rewrite.c>
+	############################################
+	## enable rewrites
+		Options +FollowSymLinks
+		RewriteEngine on
+	############################################
+	## you can put here your magento root folder
+	## path relative to web root
+		#RewriteBase /magento/
+	############################################
+	## uncomment next line to enable light API calls processing
+	#    RewriteRule ^api/([a-z][0-9a-z_]+)/?$ api.php?type=$1 [QSA,L]
+	############################################
+	## rewrite API2 calls to api.php (by now it is REST only)
+		RewriteRule ^api/rest api.php?type=rest [QSA,L]
+	############################################
+	## workaround for HTTP authorization
+	## in CGI environment
+		RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
+	############################################
+	## TRACE and TRACK HTTP methods disabled to prevent XSS attacks
+		RewriteCond %{REQUEST_METHOD} ^TRAC[EK]
+		RewriteRule .* - [L,R=405]
+	############################################
+	## redirect for mobile user agents
+		#RewriteCond %{REQUEST_URI} !^/mobiledirectoryhere/.*$
+		#RewriteCond %{HTTP_USER_AGENT} "android|blackberry|ipad|iphone|ipod|iemobile|opera mobile|palmos|webos|googlebot-mobile" [NC]
+		#RewriteRule ^(.*)$ /mobiledirectoryhere/ [L,R=302]
+	############################################
+	## always send 404 on missing files in these folders
+		RewriteCond %{REQUEST_URI} !^/(media|skin|js)/
+	############################################
+	## never rewrite for existing files, directories and links
+		RewriteCond %{REQUEST_FILENAME} !-f
+		RewriteCond %{REQUEST_FILENAME} !-d
+		RewriteCond %{REQUEST_FILENAME} !-l
+	############################################
+	## rewrite everything else to index.php
+		RewriteRule .* index.php [L]
+	</IfModule>
+	############################################
+	## Prevent character encoding issues from server overrides
+	## If you still have problems, use the second line instead
+		AddDefaultCharset Off
+		#AddDefaultCharset UTF-8
+	<IfModule mod_expires.c>
+	############################################
+	## Add default Expires header
+	## http://developer.yahoo.com/performance/rules.html#expires
+		 ExpiresActive On
+		 ExpiresDefault "access plus 1 year"
+	</IfModule>
+	############################################
+	## By default allow all access
+		Order allow,deny
+		Allow from all
+	###########################################
+	## Deny access to release notes to prevent disclosure of the installed Magento version
+		<Files RELEASE_NOTES.txt>
+			order allow,deny
+			deny from all
+		</Files>
+	############################################
+	## If running in cluster environment, uncomment this
+	## http://developer.yahoo.com/performance/rules.html#etags
+		#FileETag none
+	###########################################
+	## Deny access to cron.php
+		<Files cron.php>
+	############################################
+	## uncomment next lines to enable cron access with base HTTP authorization
+	## http://httpd.apache.org/docs/2.2/howto/auth.html
+	##
+	## Warning: .htpasswd file should be placed somewhere not accessible from the web.
+	## This is so that folks cannot download the password file.
+	## For example, if your documents are served out of /usr/local/apache/htdocs
+	## you might want to put the password file(s) in /usr/local/apache/.
+			#AuthName "Cron auth"
+			#AuthUserFile ../.htpasswd
+			#AuthType basic
+			#Require valid-user
+	############################################
+			Order allow,deny
+			Deny from all
+		</Files>
-**Important:** Your rewrite rules must exactly match your backend's mobile detection. If these do not match, you may run into the issue where your rewrite rules think that a device is mobile while the backend does not and visa-versa. This can cause, for example, the desktop version of a page to be cached and flagged as the mobile version which will then be wrongly served to all mobile viewers.
+</code>