DatePicker Loading mixed (insecure) display content on a secure page

I have added an SSL certificate to my Wordpress site and all of the pages show secure with the exception of one. On that page, I use a jQuery DatePicker that seems to prevent my page from being shown as secure.

<link rel='stylesheet' id='st_jquery_ui_style-css'  href='https://example.com/includes/css/jquery-ui.css?ver=1.0.0' type='text/css' media='all' />
<script type='text/javascript' src='https://example.com/includes/js/jquery-ui.js?ver=4.9.4'></script>

$( "#datepicker" ).datepicker({ altFormat: "yy-mm-dd", altField: "#lastInspected", });

When I remove the DatePicker by deleting the above script, the page shows as secure. I thought the image icons loaded in the calendar load may be loading from an insecure location, but those seem fine. However, when I hover over to reveal the hover state of the datepicker next and back arrows, the inspector given me the same warning.

The warning I get does not point to any url request that is being made over http:// so it is difficult to find what is happening. It just says "Loading mixed (insecure) display content “http://example.com/” on a secure page [Learn More]"

Does anyone know what I might try to ensure my page shows as secured?

1 answer

  • answered 2018-02-13 16:30 vanreus

    I was using Firefox, which did not give me details of the warnings. Once I switched over to Chrome, it had the same warnings, but told me more. The DatePicker was pulling in images/icons that were not in the correct location on my server. It was not that they were using http://, it was simply that they did not exist. Very silly. Thanks!