We don’t actually create the links for the images ourselves, we are actually using WordPress to pull the images from the media library.
Therefore, it is very likely that you probably created those layouts before you went HTTPS. If this is correct, can you try clearing the cache from WordPress Admin Dashboard > Settings > Page Builder > Cache and see if this resolves your issue, please.
I totally understand that you are using WordPress native functions to create the links. That’s perfectly fine. Yes, you are right, I’ve created those layouts before I tried HTTPS. I forgot to mention that I’ve flushed the BB’s cache before 'cause I thought this would be the case.
Anyway, I think my proposed solution would be more flexible I think. Because that way you can use your website with and without HTTPS. I think I’ll create a pull request for this for you guys, I just wanted to talk this over in case I’ve missed something.
Thanks, Oliver! I understand what you’re doing there now, very clever!
My only question is, is there any possibility of this breaking something? It looks like it should work fine for links on the main domain, but what if a link gets into a stylesheet from another domain that doesn’t have SSL enabled? Will that throw and error and not render the content?
To answer your question first: if you enable SSL on your website than every asset has to be loaded via HTTPS. Otherwise your website is not protected - at least that’s what browser says (Mark’s case). So, you need to be aware of this. In case of Google assets (like fonts for example), these are HTTPS ready, so there is no issue with them whatsoever. I personally use the protocol relative URLs for Google Fonts in my themes and it works fine. CDN hosted sources also support HTTPS - at least the major ones I’ve tested.
So, I went ahead and edited the proposed pull request.
It’s kind of weird to me that this function is needed though. You guys use WordPress native functions to retrieve image source URLs and I thought that WordPress would handle HTTPS in that case. Well, not working for me and here is how I’ve tested:
I have a website built with BB and wanted to make it SSL now, so I've set up SSL certificate for my website, set the WordPress URLs to HTTPS in Settings > General, so the website defaults to HTTPS. (To test this, I've added a helper to display the state of is_ssl() function for me. It worked fine, with TRUE as an output.)
I've checked the website and got those http:// background images in BB page layout stylesheet (these were "Mixed content" warnings in Chrome browser's console).
So, I went ahead and flushed the BB's cache, thinking this will change the image URLs to https:// now that the whole website is SSL. However, that was not the case and I was left with http:// URLs still.
I went ahead and tested if the is_ssl() function actually works when generating BB page layout stylesheet. It does.
Than I've tried to edit a particular page with BB and change the background image on one row. This worked fine: the correct https:// image URL was applied on the row background, however, all the other previously set background images stayed at http:// protocol.
So, finally I came to this conclusion: When you set up your SSL on an established website that uses BB, the BB's "Clear Cache" button won't help you to fix those image URLs in page layout stylesheets. That's why I needed to create the additional function in a pull request. This function now clears all those http:// even if you use "Clear Cache" button after you enabled SSL on your website. I have also renamed the function now to be more descriptive for its updated usecase.
or that we’re storing the image URLs in the node settings
Yes, you are correct. It occurred to me after I submitted my previous reply. And that’s a good approach you use as otherwise it could be impossible to export/import the content using WordPress’ native tool for it. So, with this SSL fix it works just fine, you just need to flush the BB’s cache once you enable SSL on your website.
There will be a lot of websites going SSL these days I think as hosting companies starting to implement https://letsencrypt.org/