I am using the below page to create a Pinterest Profile widget: https://business.pinterest.com/en/widget-builder#do_embed_user
The problem is that when the widget displays the images use non secure links. I need to display the widget on a secure page so need them to be https://
Any ideas how I can go about this?
Ok so after a bit of research I have made a pretty intense hack to make this work. Pintrest does serve https content, it is just that for some reason they have not included this in their API. So I have stepped through the API and found the attribute setter that sets attributes to any elements the API creates.
Anyway.. here is the fiddle: https://jsfiddle.net/nanff007/1/ (make sure to https)
And here is the code that performs the magic...
This is a workaround/hack or whatever you want to call it. It will not work forever. It may also not work in all countries as the akamai urls may change. The best option would be to raise a request ticket with Pintrest.
(function() {
$('a[data-pin-do]').each(function () {
$(this).attr('data-pin-dont', $(this).attr('data-pin-do'));
$(this).removeAttr('data-pin-do');
});
var timer = setInterval(function () {
for (prop in window) {
if (prop.search(/^PIN_/) > -1 && typeof window[prop] != 'boolean') {
clearInterval(timer);
window[prop].f.set = function (el, att, string) {
if(att == 'src' && el.tagName.toLowerCase() == 'img') {
string = string.replace(/(^http:\/\/)/i, "https://s-");
}
if (typeof el[att] === 'string') {
el[att] = string;
} else {
el.setAttribute(att, string);
}
};
$('a[data-pin-dont]').each(function () {
$(this).attr('data-pin-do', $(this).attr('data-pin-dont'));
$(this).removeAttr('data-pin-dont');
});
window[prop].f.init();
break;
}
}
}, 100);
}());
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With