I'm trying to push a website I created off of my personal page and onto a GitHub page. It is successfully up at https://kalysren.github.io/, but my Tumblr embed isn't showing up. I've tried it in both Firefox and Chrome with the same results. If I check its existing location, it shows up perfectly in both Firefox and Chrome. Any thoughts?
Your site is https, but the tumblr content is http. You therefore have mixed content, and this is why it's not loading. You need to either, change your gh-pages site to http, or change the tumblr embed to https, assuming that's supported.
As explained by #dundonian, your current problem is mixed content.
As Github pages is requiring https for sites created after June 15, 2016, so you cannot downgrade to http and remove mixed content problem. Nevertheless, it's better to serve over https.
Trying to get joshwarmuth.tumblr.com served over https just by changing url protocol to https is not enough because tumblr is redirecting to the http version.
It seems that you can now change this behavior from your tumblr blog settings and force tumblr to serve over ssl.
Related
I have been learning HTML and CSS and i am creating a WebSite there is a section where I add 3 images, and this images have an odd behavior when displaying.
when I access to the website on Samsung Internet under HTTP i get them as expected: like this
but when I access under HTTPS i get: this
I have notice that it works under HTTP and HTTPS on other browsers like chrome.
This issue is an instance of mixed content that occurs when HTML pages load over a secure HTTPS connection but link to resources (images, CSS, or JS) over an insecure HTTP connection. This is generally triggered by inputting an image within the page that runs over an HTTP connection. When you upload and post images but do not update the image links on the page after getting an SSL certification, the browsers will recognize them as insecure elements.
For your own domain, serve all content as HTTPS and fix your links. Often, the HTTPS version of the content already exists, and this just requires adding an “s” to links – http:// to https://.
For images hosted on other domains, use the site’s HTTPS version if available.
sitechecker
I have a website www.kasnupaisezvaigzdes.lt. I made it on WordPress landing page. Everything was good, but i decided to move that page to Https:// protocol (SSL).
Installed WordPress https SSl plugin to make sure that wp content would be 100 % https, not mixed with https and http, green lock appeared as well.
But landing page links #link, #link2 etc. are not sliding anymore. Instead page is refreshing on particular spot. How to make again pages land on https ?
Export your database. make a copy for safe side as backup. Now replace all the urls in the sql file to https:// instead of http://
This will solve the issue
I'm entirely new to GitHub and I am facing some problems while trying to create my first project.
I am using GitHub (username.github.io) to preview (live). But locally my work is well but not in Github pages.
In Github pages, it doesn't work any CSS, js, or my style. All of my CSS, js, and style all in the index.html page. If I go to page source it shows all code but not work!
What I do for showing actual(like as localhost)?
The link is given below. Please see and tell me what I do?
https://mostafizur67.github.io
The browser console shows that your external resources are blocked:
(index):8 Mixed Content: The page at 'https://mostafizur67.github.io/' was loaded over HTTPS, but requested an insecure stylesheet 'http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css'. This request has been blocked; the content must be served over HTTPS.
(index):1 Mixed Content: The page at 'https://mostafizur67.github.io/' was loaded over HTTPS, but requested an insecure script 'http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js'. This request has been blocked; the content must be served over HTTPS.
(index):13 Mixed Content: The page at 'https://mostafizur67.github.io/' was loaded over HTTPS, but requested an insecure stylesheet 'http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css'. This request has been blocked; the content must be served over HTTPS.
Try loading the external resources using https instead of http.
Actually not a Git question, it's really an HTML/CSS one.
You have links to http resources in an https page, and browsers do not like this. Prefer links like //example.com/path/to/file to http://example.com/path/to/file to let your browser pick the right protocol.
To debug this kind of issues, use the webmaster tools provided with your browser. For example, with Firefox, Right-click anywhere on page -> Inspect element. The console shows the errors.
I am using django-embed-video to embed videos from YouTube and Vimeo on my site. It works quite fine. But now I switched to https and videos suddenly stopped to work. Have you any idea why?
Output from pip freeze
Django==1.5
distribute==0.6.34
django-embed-video==0.5
wsgiref==0.1.2
in console log I have had:
[blocked] The page at 'https://localhost:8000/articles/my-test/' was loaded over HTTPS, but ran insecure content from 'http://www.youtube.com/embed/g9fHqTOYpm4?wmode=opaque': this content should also be loaded over HTTPS.
Upgrade django-embed-video.
Support for HTTPS sites has been added in version 0.7. You can read more about this problem in issue in Github repository.
I've switched my Facebook page to pull an iframe as a result of Facebook's recent announcement that they were supporting iframes in pages. Since you need to host the iframe page outside of Facebook, I figured it would be nice to do using Cloudfront to host the files (an HTML page, a CSS stylesheet and a jpg image). Unfortunately, despite setting the permissions on the Cloudfront files to 744, the iframe page loads correctly in a browser, but when called from Facebook, I get this error message.
When I host the same files on my Media Temple server, the iframe on the actual Facebook page also loads correctly.
Is there a reason why Facebook and Cloudfront don't play together? I haven't been able to find one so far.
Unfortunately Facebook loads the iframe page using an HTTP POST, not an HTTP GET and is not compatible since Amazon has a REST interface and properly uses POST to upload/modify content.
Best,
David Bullock
I ran into this problem today and it caused some headscratching. As David Bullock points out the problem is that Facebook loads the HTML page via a POST request but S3 (and thus by extension CloudFront) won't serve resources in response to this (it returns 405 Method Not Allowed).
You can host your CSS, scripts and images on S3 / CloudFront, but the initial HTML page has to be on some other server. If you're concerned about load or latency from across the globe then you could try implementing a tiny redirector that forwards the Facebook POST request to the CloudFront-cached location (you'll have to return 303 See Other to do this redirection so the browser makes a GET request instead: see RFC 2616).
There is a shockingly easy workaround to the fact that AWS rejects POST requests and the fact that Facebook requires page tabs to be hosted via HTTPS: just redirect the request through https://bit.ly/….
Yes, it's really that easy.
Host the HTML page wherever you like. HTTP is fine.
Create a bit.ly-shortened URL to the page.
Use it—substituting https:// for http://—as the "Secure Page Tab
URL" as you create your Facebook Page Tab.
Activate the tab using this highly-undocumented dialog URL: https://www.facebook.com/dialog/pagetab?app_id=app_id&redirect_uri=bitly_url
Boom: done.
OK, it can be done: but you need to host the images on Cloudfront and the rest of the content on S3. Amazon provides a set of clear instructions on how to this. Issue solved.
Use Cloudfront to trap the 405 error and serve your html as the "Custom Error Response" page to the desired index page
Updated:
This was down voted, however I'm going to help lots of Facebook developers with the following. The final Issue that we had with hosting a facebook application on S3 was with CORS. We fixed the 405's by doing a "Custom Error Response" See this link for details:
http://blog.celingest.com/en/2014/10/02/tutorial-using-cors-with-cloudfront-and-s3/