Let's Go Mobile Together! A step by step guide to ... - FA Mobile

motherlamentationInternet και Εφαρμογές Web

7 Δεκ 2013 (πριν από 3 χρόνια και 7 μήνες)

76 εμφανίσεις




1




Let’s Go Mobile Together!

A step by step guide to monetizing your mobile traffic!









2





Let’s Go Mobile Together
– Before we get started…

Congratulations! You are on the road to becoming a mobile super affiliate!

We have put together a solution that hopefully will help you derive as much value from any mobile traffic
your site might already be receiving. You may also have domains you have purchased for mobile which have
not yet been developed or they are still parked. Well now it’s time to get those domains working and making
money for you!

The solutions presented below have been simplified as much as possible in order to work with a wide variety
of hosts. While we hope that the solutions supplied will work on your particular platform, unfortunately
every webhost is configured differently and you may be required to contact their support for additional
assistance. In terms of mobile handsets there are literally thousands, however we have focused our solutions
on the most popular and highest converting mobile devices based on our experience.

The solutions outlined in this document are composed of 2 elements:

 HTML Mobile optimized landing pages
 Mobile redirection
o Wordpress
o .htaccess (Linux based hosting)

If you are using Joomla or Drupal, you may wish to refer to the following links for plugins / extensions that
will perform the required redirection. You can however also utilize the .htaccess method detailed in this
document.

Joomla -
http://extensions.joomla.org/extensions/mobile/mobile-display/8438

Drupal -
http://drupal.org/project/simple_mobile_redirect





3


If you are using a Windows based hosting platform, unfortunately the .htaccess solution supplied will not
work with Windows. You can however still use the landing pages, but will need to refer to other online
resources detailing URL rewriting (similar to .htaccess). The required solution for this will vary from host to
host and versions of IIS being used. Please contact your webhost for additional advice on how to achieve user
agent detection and redirection.

Each website and environment is different and we have taken a very simple and broad approach to be
compatible with as many of these environments as possible. We cannot guarantee that these solutions will
work for you, nor can we supply you any advanced support. Implementation of these solutions by you is
beyond our control and you therefore take full responsibility for the installation, maintenance and risks
associated with implementation.

If you have advanced technical knowledge please feel free to use these solutions as a foundation and build
them outwards and upwards to meet your specific needs.

Are you ready to go mobile?

Well then… Let’s get started….






4




Step by Step Guide:
Wordpress Solution
Before we start you will need the following:
1. Zip files from your Relationship Manager with the Wordpress plugin and web templates. If you do not
have these yet please email your RM with the following information:
 Website URL’s you want mobi-optimized pages for
 Your website logo images (300x100 max, <40Kb, .png / .gif / .jpg)
 You preference in terms of template colors for header and body
 What currency banners you would like - $ / € / £
2. Your Wordpress website admin login details
3. FTP program and your website ftp login details. If you don’t have a ftp program you can download
Core ftp for free here:
http://www.coreftp.com/download.html


Mobile Optimization Recipe:
1. This solution uses a Wordpress plugin call WPtap. While plugins generally do not present any major
risk and can be disabled if there is a problem, it is always recommended that you backup your site
first before implementing.
2. Save the zip files from your RM to a directory on your local computer.
3. Unzip the Lets-Go-Mobile.zip file on your computer. (Do not unzip the wptap-mobile-detector.zip,
this is the Wordpress plugin and will need to be uploaded as a zip file.) You can ignore the .htacccess
file as you will be using the plugin. (DO NOT upload the .htaccess file if you are using the plugin)
4. Login to your webserver via ftp
5. Create a directory/folder in the root directory of the website that you wish to use to represent
mobile. For example you could call it “mobile” or “mobile-casino”. i.e. The url will look something
like this:
http://www.mysite.com/mobile
or
http://www.mysite.com/mobile-casino


NB: Be sure to name this directory something that is not an existing name of a category, page or post
in your existing Wordpress site.

Hint: If you know how to create a sub-domain through your domain host, you may wish to create
something like this:
http://mobile.mysite.com
or
http://m.mysite.com





5



6. FTP the following files from the unzipped “Lets-Go-Mobile.zip” folder into your newly created
website directory:
 index.html
 android-casinos.html
 ipad-casinos.html
 iphone-casinos.html
 mobile.css
 logo_s.png
 logo_m.png
 logo_l.png

7. Now open your web browser and visit each of the 4 new pages that you have just uploaded We want
to ensure that they are all working. They may look a little odd in your web browser as they are
designed for a smaller mobile screens but don’t worry, we are about to make the magic happen.

Page Name URL - *please replace “mysite.com” with your URL &
”mobile” with the name of your new directory

Description
android-casinos.html http://www.mysite.com/mobile/android-casinos.html For Android powered mobile devices
ipad-casinos.html http://www.mysite.com/mobile/ipad-casino.html For Apple iPad
iphone-casinos.html http://www.mysite.com/mobile/iphone-casinos.html For iPhone & iPod
index.html http://www.mysite.com/mobile/index.html Default page for other mobile devices


8. Login to your Wordpress admin console and click on ‘Plugins’ on the left hand-side.





6



9. Now click on ‘Add New’ at the top.

10. Just below the main heading Install Plugins, click on ‘Upload’. You can then click on ‘Browse’ and
navigate to the folder where you unzipped to earlier. Locate and click on the wptap-mobile-
detector.zip that you saved on your computer. Then click ‘Install Now’





7



11. Wait a few moments until it says plugin installed successfully. Click ‘Activate Plugin’

12. Now we need to configure our newly installed plugin. On the bottom left of the Admin console is a
tab called ‘Mobile Detector’, click on ‘Settings’.





8


13. We need to copy and paste each URL for the new mobile pages. Add one URL at a time into the table
and click “Update” after each one.

Devices

Redirect

iPhone/iPod

http://www.mysite.com/mobile/

iphone
-
casinos.html

Android

http
://www.mysite.com/mobile/
android
-
casinos.html

Blackberry Storm

http://www.mysite.com/mobile/
index
.html

Nokia

http://www.mysite.com/mobile/
index
.html

Apple iPad

http://www.mysite.com/mobile/ipad
-
casinos.html

Opera

http://www.mysite.com/mobile/
index
.html

Palm

http://www.mysite.com/mobile/
index
.html

Windows Smartphone

The casino software does not support Windows Smartphones so leave this blank
Blackberry

http://www.
mysite.com/mobile/index
.html

*Please replace “mysite.com” with your URL & ”mobile” with the name of your new directory

Please Note: This solution is intended to address the most popular mobile devices and to enable you to
better serve these visitors. You do not have to redirect a specific group if you do not want to.

Congratulations, your Wordpress site is now ready to start delivering mobile casino players!



9



.htaccess Solution

This approach of “User Agent Detection” and redirection is an alternative to the Wordpress plugin but only
for sites hosted on Linux based hosting. Hypertext Access Files (.htaccesss) allows for directory level rules /
instructions to be specified, and in this case we will be telling the webserver that whenever it detects certain
mobile devices it must send them to a specified page i.e. The supplied mobi-landing pages.

This solution requires more technical skill than the Wordpress plugin solution and incorrect implementation
can result in server errors, therefore it is highly recommended to first backup your site (which is best practice
anyway before any rollout) as well as to make a backup of the original .htaccess file – which is explained
below.

While this solution is more technical it also offers the feature of allowing mobile visitors to click on a link in
the mobi site called, “View Full Website” which will allow them to visit your original desktop site.

Are you ready to get your hands dirty? ....Let’s go!

Before we start you will need the following:
1. Zip files from your Relationship Manager with the
“htaccess - mobile redirect with desktop redirect (subdomain version).txt” file and web templates.
If you do not have these yet please email your RM with the following information:
 Website URL’s you want mobi-optimized pages for
 Your website logo images (300x100 max, <40Kb, .png / .gif / .jpg)
 You preference in terms of template colors for header and body
 What currency banners you would like - $ / € / £
2. Your webhost and or domain host admin login details
3. FTP program and your website ftp login details. If you don’t have a ftp program you can download
Core ftp for free here:
http://www.coreftp.com/download.html


Implementation:
1. Backup your website
2. FTP to the root of the website where you will be implementing the solution and copy the existing
.htaccess file to your computer



10


3. Locate the .htaccess file on your local machine and make another copy in a safe location and rename
it “original_htaccess”. The purpose of this is that if you hit any hiccups or need to rollback you can
simply rename this back to .htaccess and copy it back to your server, thereby restoring everything
back to the original configuration.

Now that we have the housekeeping out the way – let’s move forward with our implementation….

4. We need to create a subdomain for the site in question where you will host the mobi pages. Please
note the solution provided will only work with a subdomain. By default most control panels will
automatically create a directory/folder in the root with the name you used for the subdomain. You
need to login to your domain host or webhost depending on where your DNS configuration is hosted
and create a subdomain for your new mobile landing pages, for example:

http://mobile.mysite.com
or
http://m.mysite.com


NOTE: If your hosting creates the directory outside of the root, this is also fine so long as it has the
right permission to be viewed publicly. Please note it can take up to 24 hours for DNS propagation to
take effect.

5. FTP the contents from the unzipped “Yoursitename.zip” folder into your newly created subdomain.
You typically will see the following files but there may be more or less depending on how we put
together your templates:
a. index.html
b. android-casinos.html
c. ipad-casinos.html
d. iphone-casinos.html
e. mobile.css
f. logo_s.png
g. logo_m.png
h. logo_l.png





11


6. Now open your web browser and visit each of the 4 new pages that you have just uploaded. We want
to ensure that they are all working. They may look a little odd in your web browser as they are
designed for smaller mobile screens but they are going to look awesome on a mobile phone.

Page Name URL - *please replace “yourdomain.com” with your URL &
”mobile” with the name of your new sub-domain

Description
android-casinos.html http://mobile.yourdomain.com/android-casinos.html For Android powered mobile devices
ipad-casinos.html http://mobile.yourdomain.com/ipad-casino.html For Apple iPad
iphone-casinos.html http://mobile.yourdomain.com/iphone-casinos.html For iPhone & iPod
index.html http://mobile.yourdomain.com/index.html Default page for other mobile devices

7. Open the .htaccess file that you copied to your computer with notepad or with your favorite editor
such as Dreamweaver.

8. Open the “htaccess - mobile redirect with desktop redirect (subdomain version).txt” file supplied.

9. Copy and paste all the code from “htaccess - mobile redirect with desktop redirect (subdomain
version).txt” file into the bottom of your .htaccess file. If you already have any existing rules in your
.htaccess file, you might see the following code somewhere near the top:

RewriteEngine On
RewriteBase /

If yes, then you can remove this from Mobile_Redirect_htaccess code supplied as this only needs to
appear once in the .htaccess file. If your .htaccess file did not have The “RewriteEngine On…” then
simply copy and paste all the code exactly as supplied. Make sure to include the “#” comments to
keep it neat and easy to identify within the file.



12



10. You now need to edit the URL’s and replace:
 “mobile” - with the name of your subdomain you created something other than “mobile”
 “yourdomain” - with your domain name including TLD example: .net OR .com OR .org etc

NOTE: Make sure to only edit as per above and do not change any other characters such as period (.)
or slashes \ /



13



11. Now save your .htaccess file

12. FTP the newly saved .htaccess file back to the root of the site we are working on. Your FTP program
will probably ask you if you want to overwrite, you can click Yes.

NB: If you host multiple websites on a single host make 100% sure you are working on the correct
website before copying across or overwriting.

13. Test, Test, Test… the first thing you want to test is to go to your homepage in your browser and make
sure your core desktop website is working 100% fine, also visit a few pages. If there are any errors
you should rollback immediately by copying back the backed up .htaccess file

All working?...Good let’s continue…

14. Now it’s time to test the redirection and mobi pages by visiting your homepage with a mobile phone
such as an iPhone or Android. You can also test your site with the following emulators:

http://www.mobilephoneemulator.com/

http://www.puresimstudios.com/ibbdemo


You should automatically redirect to the new mobi landing pages!

15. Now scroll to the bottom and click on “View Full Website” and you should redirect to your main
desktop website

That’s it! …..Congratulations on Going Mobile!!







14



Final Comments

The solutions above are simple and effective ways to start leveraging off your existing traffic that is coming in
through mobile devices or to finally get those parked domains working. There are various solutions available
today and when you are ready to take the next step and build your complete mobile site there are a range of
mobile themes / templates and plugins for Wordpress, Joomla, Drupal and others.

We hope you achieve great success and thank you for Going Mobile with Us!

Watch this space as we bring you more mobile offers, solutions and technologies.


FAQ’s

I am not using Wordpress or a Linux webhosting solution, can I still use these mobile templates?
Absolutely, the templates were specifically built with HTML and do not use Java script so they could work
with any platform and be hosted with ease. There are various plugins/extensions/applications for other
platforms that perform user agent detection that will allow you to redirect your mobile traffic to these
landing pages.

Why do I need to upload new pages? Can’t I just redirect to the mobile casino website?
You definitely can just load your affiliate link URL’s into the re-direct settings or .htaccess file, however from
an SEO perspective it is not recommended to automatically redirect a user to an external domain. The reason
for the creation of the interim mobile landing pages on your domain allows you to develop your mobile web
presence.

Can I change the page names and optimize for my own terms?
Sure you can. Simply open the pages with your favorite HTML editor e.g. Dreamweaver. Just make sure to use
the correct URL’s when configuring the plugins or .htaccess. With a little bit of content, SEO and backlinks to
these pages, who knows… they could even start ranking for mobile terms.





15



Do I need to use all the landing pages?
It’s up to you…The reason for the multiple landing pages is that each one is optimized both visually and from
an SEO perspective for its targeted device/s. While it is possible to use a single page and use HTML rules &
CSS to render accordingly, we have aimed to keep the solution as simple as possible and to maintain
maximum SEO value.

Where can I get more info on this Wordpress plugin?
http://wordpress.org/extend/plugins/wptap-mobile-detector/
and be sure check out the developer’s site at
http://www.wptap.com


How long will it take to get the required files to load up?
We will do our best to have your templates and files to you within 1 business day of receiving your request.

If I need help, who can I speak to?
Send your Fortune Affiliates Relationship Manager an email or give them a call. Unfortunately every site and
webhost is different so we cannot guarantee that we will have all the answers but we will certainly try our
best. After all your success is our success!