Convert websites into mobile website format - php

I would like to display other we pages in my mobile webapp, but some web pages will be too cumbersome for use on a tiny mobile device screen. So implement some kind of google mobilizer feature. Is there any API available in PHP so that i can use that to convert these pages into mobile compatible

No. You'll have to do it manually. You should look into responsive CSS layouts. These will adjust the content of the page as the width of the browser changes. So same page will work in a full browser window and mobile.
Look at
http://www.columnal.com/
http://lessframework.com/
http://speckyboy.com/2011/11/17/15-responsive-css-frameworks-worth-considering/

I got it, we can use skweezer API for this. If you want to see your website in mobile compatible format try this
http://www.skweezer.com/s.aspx?q=www.example.com
Replace www.example.com with your website URL.
For more details, visit http://company.skweezer.com/

Related

Convert a PHP website to an Android App

This question may seem off-leading but I want to convert my website in to an actual android app. There were suggestions that I should just create a custom-web browser and that the address will then lead to my website which of course looks like the app is the website itself, but what if I'd like to "convert" like code-for-code in to android's IDE? Is this possible?
Because when I stick to the "browser" method, sometimes, since it has to load the HTML, CSS, JS and etc. I'd like to make it "rooted" to the Android app like it's already there so that when it connects to the internet, it will only get my MSQL data and skip the whole HTML, CSS, ... loading stuffs everytime they visit my page.
Is there any way to achieve something like this?
You can try at webview. It is a View that displays web pages. This class is the basis upon which you can roll your own web browser or simply display some online content within your Activity. It uses the WebKit rendering engine to display web pages and includes methods to navigate forward and backward through a history, zoom in and out, perform text searches and more.
You can explore from the following link:
https://developer.android.com/reference/android/webkit/WebView.html
The simplest way is to use ionic/cordova to create a webview that will browse the live website on the app load. Alternatively you can use online service such as applika.me that does more of the same.

Display a view in the mobile app, from the website (knowing if user comes from application)

Let's see if I can explain this and make sense at the same time...
I've a website and a mobile app for that website. In some cases I'll use the view on the website in the app. I wont redirect the user to the website, but the website view will display in the application. But in this view I'll also make some changes. Lika media queries but at the same time not, because it the user is using a mobile but not the app, a the website will show as normal, but responsive of course.
UPDATE (trying to explain a bit better)
If you use the mobile app, only a specific part of the website will be shown. In this case it will be product categories. Header, footer and all the other content will be gone except for the product categories. If you use the mobile and for example safari, the header, footer and all that stuff will be shown.
So the question here is how can I check, with using PHP, if the user is coming from a mobile app and thereafter display a certain view?
You could have the mobile application open up the website with a GET variable set. Example would be the mobile app would open up www.myWebsite.com?source=mobile.
This way when the php is run on the page you can have something like:
if ((isset($_GET['source'])) && ($_GET['source'] == 'mobile'))
{
//This is a mobile view!
}
A downfall to this would be that anyone could just type ?source=mobile to trick the browser into thinking it's coming from the app.
If you use third party mobile application you can try figure out the source of the request by HTTP User-Agent. Usually issues about views solving by CSS with #media rules.
I hope I got your problem.
You can check by user agents. Using _SERVER['HTTP_USER_AGENT'];
Or else you can use 3rd party libraries like
http://mobiledetect.net or you can use bootstrap library for do that.
If you want to do different design for mobile and desktop then I prefer to you to use bootstrap library.

url reload with custom Number sign

We are making a website that has a desktop and mobile part
but we would like to use the same URL for both of them and depending on the user-agent load in the correct html/css
for the desktop part we are using Ember and its routing capabilities
so for instance: http://domain.com/#!/newsitems/news-item-1
for our mobile part we would like not to use JS for our routing but manual page refreshes ( so our mobile site works on as many different devices possible )
so if i want to make a button that redirects to "news-item-1"
link
doesn't reload my page because it recognizes its Number sign.
Is there a possibility that i can refresh the page but still keep the url.
We would capture the URL in php and then display the correct html/css
The "fragment" of the URL is never passed to the server, it is stripped off by the browser for its own use. It is therefore impossible to directly read it in PHP.
What you can do instead is the opposite: for non-JS situations, the HTML should contain a normal URL like <a href="/foo">.... The JS can then enhance this by adding a #! as appropriate, dynamically changing the link to <a href="#!/foo">...
This general idea, that you write the simple code first and layer rich features on top, rather than embedding them in the code, is known as "progressive enhancement". It can be viewed as a solution to the problem of "graceful degradation", which is what you are trying to achieve in supporting as many platforms as possible.

How to make certain widgets not to show up on a mobile version of a site

I have recently placed google ads on my website, and the site is mobile optimized, but the ads are too big for a phone and I do not want them to show up. I am running my site on Wordpress and I put the ads using widgets, so can you please tell me if there is any kind of plugin that disables certain widgets for a mobile phone?
Thanks!
Edit: One of the answers below said that I could use mdetect.php. How can I implement this into Wordpress? Please help! (sorry for my bad php!)
Check out mdetect.php http://code.google.com/p/mobileesp/source/browse/PHP/mdetect.php
It's really simple to use:
create the uagent object
add an if ($uagent->TypeOfPhone) and you can precesely control what is shown to which devices (so you can target tablets and not phones, for example)
There are other methods based on screen resolutions, but that's now getting tricky with "retina displays" that have more pixels than you can see. So I use mdetect now. Very reliable so far.
You can hide this portion by adding "display:none" css code in media query for mobile.

Don't load jQuery on mobile devices

This question may have been asked before, but I couldn't find an answer to it using both Google and the built-in search function of this site.
I want to use jQuery on my website, but only if it is displayed on a desktop computer. If my site is displayed on a mobile device, I don't want it to load jQuery.
What's the best way to do this?
Should I use Javascript or PHP for detecting the device type?
http://jsfiddle.net/fk9kC/
The code above is pretty much self-explanatory - by using a DOM element being hidden or shown depending by a screen width you're being able to target mobile phones more or less accurately.
Furthermore, you can also replace the device-width statement with max-device-width.
What about this? Auto detect mobile browser (via user-agent?)
You would need to check the user agent.
You will need to define what is a mobile platform to you.
One hack may be to include a media type mobile stylesheet, and have it set an element to something specific that you could check for using JavaScript. This is hacky though, but it will mean you won't need to parse user agents.

Categories