Blank page displayed when accessing html file from local host in XAMPP - html

I've been going mad for the last two days trying to understand why my localhost connection merely displays a blank page in any browser for my "index.html" file in my "htdocs" folder in XAMPP. The page is blank in every browser (Edge, Chrome, Firefox, IE). Strangely, I can view the source code fine for the page in the browser though! Even more strangely, my "index.html" file displays a blank page even when it's loaded from another location other than htdocs (such as the desktop). And my test html file I created displays just fine using the htdocs folder in XAMPP. I'm using the default Apache ports 80 and 443. I'm also using Windows 10.
Could this be some error in my webpage code? I'm doing pretty vanilla stuff here: just CSS/HTML and Bootstrap. All CSS/HTML/Bootstrap files are in the htdocs directory. If you'd like to see the full code, you can go to my publicly hosted site at stephengladwin.com You can also view my current XAMPP code for my "index.html" file in the attached screenshot.
Here's what I've tried:
-Unticking the "use ports 80 and 443" box in Skype
-Re-installing XAMPP
-Updating the config file to listen to a different port (used port "123")
-tried disabling "World Wide Web Publishing Service" in services.msc
Thanks in advance for any help you can provide!
XAMPP Code

The best question is the one you answer yourself! Turns out it was a bootstrap error. In the Chrome browser inspect tool I opened the console and lo and behold, there was an error where the browswer couldn't access the "tether.min.js" file which bootstrap requires. Indeed I did have the tether file linked in my index.html file, but it was not in the right order in the code flow. It had to come before the javascript link. Now my index.html page displays fine on the localhost via XAMPP!

Related

apache2 not serving css file despite showing file in directory

I have a website I am trying to host, but for whatever reason, apache2 is refusing to serve the css file I have for my website. I have not change any settings and everything is completely default. I installed apache in the past 2 weeks so everything is clean and fresh.
All I did was copy all the files generated by jekyll from the _site folder and put them into /var/www/html on my server. now, when I go to my website, I can see all the content and the html loads correctly. The links work, images work. but there is no css styling available.
Because the default settings on apache arent that good, i can browse the folder contents. for example, my css file is store in /var/www/html/assets/css/style.css. So, when I access the website by going to https://mywebsite.com/assets/css, I can see the file structure and apache shows that I have a css file in there. but, when I try and click on that file, I get a
Not Found.
The requested URL was not found on this server.
----
Apache/2.4.52 (Ubuntu) Server at xxxx.com Port 443
All other files can be browsed in the folder structure and every file appears to be present, its just the pesky css file that will not load.

MAMP Pro can't see index /

I'm testing MAMP Pro demo and I created a few wordpress folders in the htdocs of the MAMP folder. Whenever I attempt to launch the WebStart, I get to a web page that tells me MAMP Pro was correctly installed, but whenever I attempt to access the localhost:8888 page, instead of seeing the index of wp instances, I only get this message:
The virtual host was set up successfully.
If you can see this page, your new virtual host was set up successfully. Now, web content can be added and this placeholder page1 should be replaced or deleted.
Server name: localhost
Document root: /Applications/MAMP/htdocs
1 Files: index.php and MAMP-PRO-Logo.png
Any help?
Thanks!
Helo, in my case, the problem was solved by removing index.php and reloading the project folder in htdocs.
Check the folder that the files are in and see if there’s a file in there called ‘index.htm’ or ‘index.html’. Basically, anything like that isn’t ‘index.php’ (that’s the WordPress file). If you find that, then delete the file.
Deleting the file index.php hopefully you'll fix that problem

Laravel Exception after page is refresh - OpenSSL extension is required

I am newbie in Laravel. I am using windows 7. I have downloaded and created a laravel project inside xampp inside htdocs folder.I have uncommented the statement,extension=php_openssl.dll inside php.ini. When I type the http://localhost/laravel/public/ in the browser, it shows the home page. When I refresh the page I get an exception like this.
When I remove the cookies and session variables in the browser settings, it will show the home page for once and if I refresh the page after,it shows the above page again.
NB: I have edited nothing in the project.I just tried to run the project
After uncommenting the line in the php.ini file, you must still activate it: left click on the WAMP server icon, then PHP-> PHP extensions and ensure that php_openssl is checked. If not, click it. WAMP will restart and it should be OK.

Live Reload not working (WIN7)

I have the windows application installed, Live Reload extension for chrome and i'm using Sublime Text with Live Refresh and Live Reload plugins. For some reason any HTML doc i edit on sublime text is not auto updating on chrome. The extension is stuck on "Live Reload is connecting" when i enable it. What exactly am i missing, do i need to setup a local web server or something like that?
I think your issue may be that you did not add the folder that contains your HTML document to the LiveReload windows application so that it can monitor for changes to the file.
If you open up the LiveReload app, it should have a list of site folders. Try adding your test project's folder to the list.
If you load from local file it does work you must runt the local file through a web server e.g python -m http.server in the folder your .html exists otherwise the option match to local file never appears and then you can have the save and reload functionality.
I mention it because I hadn't found the problem through reading the post

HTML 5 GeoLocation in Google Chrome

I am using HTML 5 Geolocations API's for tracking location however I am getting the following error on the Geolocation icon in Chrome Browser
"This Page has been blocked from tracking your Location"
I went to the Preferences and Setting's Page but did not find any help.
In my case the problem was that I opened the HTML file from the file system (file:///...). Browsers generally try to prevent accessing personal information (which includes location) from local files, so you have to serve the file through a web server (even if it is local).
One simple way to serve a static website located in your filesystem is SimpleHTTPServer if you have Python installed. Just navigate to the folder using the command prompt, and say python -m SimpleHTTPServer, and then you can view the file on localhost:8000.
Even I was facing the same problem. One of the solution is to open to file in another browser, I tried in Firefox and it worked fine. Another solution is to open the file through your WAMP server (Local host).
There is a good article here about Geolocation API. You have to go to chrome://settings/content and there, you can find Location information. You should be able to find the exceptions and manage them there.