mobile/phone emulator for html files on hard drive? - html

I have a website built on my hard drive that is not yet on the web. I'd like to check how to displays on various mobile devices prior to uploading to the web. I have downloaded a few emulators, but they seem to only "point" to a website and I cannot make them display a html file on my hard drive. Any help or pointers? I'm new to website development and learning while helping a friend.

Run website on your hard disk:
To run a website on your computer you need to have a web server, You should download one of these
mamp, xampp, wamp.
Then put your website on the web server software root folder.
Mobile Version:
Adobe Dreamweaver has a further for web designer who wants to see websites with mobile
http://www.htmlgoodies.com/beyond/webmaster/toolbox/how-to-build-a-native-mobile-application-in-dreamweaver-cs5.5.html
The adobe mobile simulator works like mobile and you don't need to upload your website and just test it with adobe Dreamweaver mobile simulator
Other mobile version:
If you are going to do it with your browser firefox you can press ctrl+shift+m

Hey if your phone and the computer with the harddrive are in the same wifi network, I would do it like this:
Install XAMPP. It is a very easy to-use, preconfigured webserver for development. After installing it, create a folder for your website (example: "mywebsite") in the "htdocs" folder in the xampp installation folder.
Open Xampp and start the apache webserver. Now, when you enter "localhost/mywebsite" as a URL in your browser, you will see the content of the folder. If you enter "localhost/mywebsite/mysite.html" you will see the "mysite.html" file rendered as a website.
Now as long as your apache sever is running, you should be able to access the site from any device within your network, without further configurations (like port forwarding or DynDNS).
Edit: Now as I reread your question I see that you don't want to test the site with real devices but with emulators. Well, I hope it is still helpful.

Related

How to test HTML/CSS files from PC on mobile device

Here's the situation:
I have a folder on my PC containing a single HTML file, a CSS file, and an images folder. I've been testing it through the browser on my PC, but I wanted to run the same files off my Android to test on mobile. I zipped the entire folder, emailed it to myself, and then downloaded it and unzipped it on my Android. When I click on the HTML file I can open the page on the mobile browser, but it appears that the CSS file is not loading at all, despite all of the files still being in the same folder together on my phone. Is there an obvious problem I'm missing?
If the issue is coming from your phone and not the file, try to upload it on a free web host, like byethost, and open it directly trought internet.
You'll need to get your files into a web server.
If you don't have an external site you can use, you can still do it with a local web server. Depending on your OS, options for a local web server include IIS, Apache (via XAMPP on Windows), or even debug mode from an IDE like Visual Studio.
Next, get a tunnelling service like ngrok or localtunnel. When you run it, it will give you a temporary external website address that redirects to your local web server. You can then use your mobile device to test.

Can access WAMP on mobile phone but layout is destroyed

I am new to WAMP Server Configurations and it seems that I managed to setup my server to run on other devices by using the Ngrok that allows user to create a terminal for their website.
I tried visiting the URL that ngrok gave me. The layout shows properly in a desktop. BUT upon accessing it in my android phone, the layout is not showing and it is just plain HTML.
Is there anything that I can do to fix this one?

how do I host my webpage in localhost on my Mac?

I am working on a webpage & I would like to see how it renders on my iPhone's safari browser. Rather than officially purchasing a domain & hosting, because its in the development stage I just want to view it on mobile safari temporarily.
So far I have enabled Web Sharing:
and when i type in my IP address in my iPhone's safari, the localhost seems to be up:
I have also re-created the "sites" folder:
So How do I host the current webpage i am working on with localhost, then being able to access it on mobile safari? *NOTE I want both the html and css files to be accessed to show a complete webpage
You should consider downloading and installing Prepos and you'll be able to view your website in any device connected to the same network.
It's easy to use and the trial version never expires!
After installing it to your Mac, just drag and drop the site root folder into Prepos. There's a tab where you can see the http path to view in any device: TV, tablet, smartphone or any device with internet access. The only requirement is that they must be connect to the same network.
Go to your Network Settings.
Then write down your IP Address.
Go to http://youriphere/~youruser/ in Safari or whatever browser and that's it!

Hosting web app on xampp

*I hav made a small demo web app(using html5, and jquery mobile)
*I have installed and set up Xampp
*set passwords for local server
* I am confused as in what to do next, where do i store my .html files and other resources
*I need to test my app on a network
*I want to set up a database using xampp ,(i have no idea how to)
*edit: since its a mobile web app, i want to test it from my mobile, is it possible by hosting it on my pc ? If yes, then how?
If you have the apache server running on xampp, you have to put the files in the /htdocs map. This is usually located in something like C:/xampp/htdocs. Then you go to your localhost in your browsers, so localhost and then /example.html.
This would be for example localhost/example.html, this would redirect to the example.html file in the htdocs folder.
Then if you want to set up an mySQL database you should take a look around at localhost/phpmyadmin

LAMP server, website not displaying correctly on host

I'm pretty new to LAMP and web design in general, so please excuse any obvious mistakes I may be making.
I have setup a LAMP server on my Linux (Ubuntu) virtual machine and proceeded to install Wordpress. Everything is working fine when I access via the virtual machine.
However, when I access my Wordpress site via the host machine (Windows), it seems to be lacking any styling. The HTML seems to be rendering fine, but nothing else.
Here is screenshot of how the Wordpress page is displaying on my host system-
Any ideas what is causing this behavior? Thank you!
Maybe you can provide us the folder structures of your WordPress template and CSS?
Can you also view page source of the webpage and check the current CSS path that the template is pointing to?
Thank you.
Your web server is communicating with the database which is definitely a good sign. What's causing the behavior is that the link to style.css isn't configured correctly. Could be file permissions if your using the theme that WP comes with otherwise it could be permalinks or a broken link in the theme.
If your just looking to set up a site locally for development I would recommend using WAMP (pc) or MAMP (mac). A VM is a little overkill and CPU intense if your running Illustrator and Photoshop at the same time.
WAMP http://www.wampserver.com/en/
MAMP http://www.mamp.info/en/index.html