If your site having mixed content then padlock some time show in black or show in broken or do not show even you have a valid SSL Certificate. If the SSL is installed but the green padlock is missing after fully loading, this is due to the site calling files that are not secure, the following tool will show more details:
https://www.whynopadlock.com/
It will show all elements of the site that are not using https:// so that you or your developer can correct the resources within your code.
Your website is not loading fully secure (even though has a valid SSL) because there is some information that is not being secure.
For example, on any page of your website the next content have not been uploaded via https that is causing the problem:
Mixed Content: The page at 'https://yourdomainname.com' was loaded over HTTPS, but requested an insecure image 'http://imageurl.com/image.jpg'. This content should also be served over HTTPS.
If a user requests this page using an https:// connection, the page itself is encrypted, but the url of image file is not. As a result, the page contains secure and insecure content, and the browser displays a warning message to the user.
This problem can occur with any type of url or hyperlinked resource file - a JavaScript library, a CSS file, and so on.
You can ask your developer to check the above images and the content of the site and adjust the site to use the https contents.
It also to depend on the browser and sometime on desktop they are black and on mobile green.
If your site is WordPress based, the following plugin should be helpful and correct the issue in most situations:
https://wordpress.org/plugins/
If there any mixed contents on the Web Page then it show not secure.
This problem occurs if a web page contains hyperlinks to insecure elements.
You will need to replace the insecure URL with the secure URL.
The easiest way to fix this on a WordPress website is a plugin called "Really Simple SSL" , which will force the redirect and scan through all resources to make sure they're loading over https:// as well. We always recommend making a full backup before making significant changes to your websites.
When the Apache web server processes an incoming client request for a file, it looks for an .htaccess file in the same directory. If the .htaccess file exists, Apache reads the directives in the file and overrides the server's global configuration. Any directives defined in an .htaccess file apply to the directory where the file is located, and to all subdirectories beneath it.
Adding the following lines of code via .htaccess and the meta tag will prevent insecure elements from appearing on the page.
// header
Content-Security-Policy "upgrade-insecure-requests;
// meta tag
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
You may want to ensure that visitors to your web site always use a secure connection. To do this, you can use Apache rewrite rules in a custom .htaccess file.
If you use the rewrite rules in an .htaccess file in the web site's root directory, all requests will be redirected to HTTPS connections. Alternatively, you can modify the rewrite rules in a specific directory's .htaccess file to limit redirection to files in that directory.
The following lines demonstrate how to redirect users from a non-secure URL (http://) to a secure URL (https://) using an .htaccess file. Replace yourdomainname.com with the domain name associated with your own SSL certificate:
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule (.*) https://example.com/$1 [R=301,L]
If there are any misconfigured rules or incorrect syntax in an .htaccess file, users see an “Internal Server Error” message when they visit a page in the same directory. Be very careful when you make any changes to an .htaccess file.