Wordpress image slider on Google App Engine can't access images on Google Cloud Storage
I have set up a Wordpress web site using the Customizr theme, including an image slider. Everything works perfectly on my local computer, but when I deploy to Google App Engine (GAE), the images aren't displayed in the slider. I have uploaded them, and I can see them in the wp-admin Media section. They are stored on Google Cloud Storage with URLs like https://storage.googleapis.com/<bucket-name>/<image-name>.jpg, and I can access them over http on those URLs. However, the image slider on my deployed WP site does not display any images. All image URLs in the slider are invalid, looking like
http://lh3.ggpht.com/dQWB2UTfQKJMkQIqFBG1TL3PbgYq4GKvf88HjZdbrQQXObIGtz4rTmVkD_vfEk6EXXIm0yOGmzy2UtQv5kw3YCU4f0g-98WUrQ=s99999-c
I have imported the data from my local setup using the XML export/import feature of Wordpress. I have activated the "Google App Engine for WordPress" plugin.
In the developer console of my browser, I get a load of error messages like these:
Type 1:
The page at 'https://wp-dot-xxx-yyy-123.appspot.com/' was loaded over HTTPS,
but displayed insecure content from 'http://lh4.ggpht.com/7SVmfoMBnl1kQ1su2cWZZTYQbO9KDzeuWql2TPvbnEdAS8T3N9OmUz1fv86Fws9OhoTc_7MEWjpa8MNubBHOxIJrWk4m4_NH=s99999-c':
this content should also be loaded over HTTPS.
Type 2:
Failed to load resource: the server responded with a status of 404 (Not Found)
http://lh3.ggpht.com/dQWB2UTfQKJMkQIqFBG1TL3PbgYq4GKvf88HjZdbrQQXObIGtz4rTmVkD_vfEk6EXXIm0yOGmzy2UtQv5kw3YCU4f0g-98WUrQ=s99999-c
Those are the image URLs used in the generated HTML on the deployed site, and they are all invalid. They seem to be generated by the appengine-wordpress-plugin, because disabling it results in normal URLs. The bad URLs only occur in context of the image slider and featured images, though, not for images inserted in posts, for example.*
UPDATE:
There are two problems here: 1) Invalid URLs and 2) http instead of https.
- Issue 2) has nothing to do with Customizr, it seems to be a GAE issue.
- Issue 1) can be partly fixed in Customizr by a) either disabling "full-width slider" in the admin section OR by b) modifying the file wp-content/themes/customizr/inc/class-fire-init.php.
Option b) will give you a full-width slider, but the images will be cropped and scaled incorrectly. Anyway, here is the modification:
On row 70:
$this -> slider_full_size = array('width' => 99999 , 'height' => 500, 'crop' => true );
Replace the 'width' value by a smaller number, like 9990 (note: four digits instead of five, and less than 9999).
It would be great with a proper fix for this problem, though.
Solutions
I just uploaded a new version of the plugin (v1.4) which gives you an option to generate https URLs for the uploaded media files, which should one of your problems.
The second problem we can also fix in the plugin, once I understand what it's trying to do. Why does the slider want to pass a width of 99999? Does it just want to crop to the height of 500 and keep the aspect ratio so it passes a rubbish value for width?