blog post's image on my home page not seen

[sait]

Hi,

I do not see the blog post’s image on my home page. Can you please tell me how to fix

Attachments:

You must be logged in to view attached files.

[Harry]

Hi,

Our theme uses the Aqua Resizer script to resize/crop images to the selected size, this script only accepts images hosted on the same server as the site so CDN images will not work.

In order to support CDN images you will need to disable the cropping functionality. This is not an elegant solution as this will mean the full size images are loaded in all cases but at least your images will be working.

To do this copy the following function to claue-child > functions.php file:

Replace “http://cdnurl.com/wp-content/uploads” with your CDN uploads directory.

class Aq_Exception extends Exception {}
class Aq_Resize {
    /**
     * The singleton instance
     */
    static private $instance = null;
    /**
     * Should an Aq_Exception be thrown on error?
     * If false (default), then the error will just be logged.
     */
    public $throwOnError = false;
    /**
     * No initialization allowed
     */
    private function __construct() {}
    /**
     * No cloning allowed
     */
    private function __clone() {}
    /**
     * For your custom default usage you may want to initialize an Aq_Resize object by yourself and then have own defaults
     */
    static public function getInstance() {
        if(self::$instance == null) {
            self::$instance = new self;
        }
        return self::$instance;
    }
    /**
     * Run, forest.
     */
    public function process( $url, $width = null, $height = null, $crop = null, $single = true, $upscale = false ) {
        try {
            // Validate inputs.
            if (!$url)
                throw new Aq_Exception('$url parameter is required');
            if (!$width && !$height)
                throw new Aq_Exception('$width and $height parameter are required'); // MODIFIED
            // Caipt'n, ready to hook.
            if ( true === $upscale ) add_filter( 'image_resize_dimensions', array($this, 'aq_upscale'), 10, 6 );
            // Define upload path & dir.
            $upload_info = wp_upload_dir();
            $upload_dir = $upload_info['basedir'];
            $upload_url = 'http://cdnurl.com/wp-content/uploads';
            
            $http_prefix = "http://";
            $https_prefix = "https://";
            $relative_prefix = "//"; // The protocol-relative URL
            
            /* if the $url scheme differs from $upload_url scheme, make them match 
               if the schemes differe, images don't show up. */
            if(!strncmp($url,$https_prefix,strlen($https_prefix))){ //if url begins with https:// make $upload_url begin with https:// as well
                $upload_url = str_replace($http_prefix,$https_prefix,$upload_url);
            }
            elseif(!strncmp($url,$http_prefix,strlen($http_prefix))){ //if url begins with http:// make $upload_url begin with http:// as well
                $upload_url = str_replace($https_prefix,$http_prefix,$upload_url);      
            }
            elseif(!strncmp($url,$relative_prefix,strlen($relative_prefix))){ //if url begins with // make $upload_url begin with // as well
                $upload_url = str_replace(array( 0 => "$http_prefix", 1 => "$https_prefix"),$relative_prefix,$upload_url);
            }
            
            // Check if $img_url is local.
            if ( false === strpos( $url, $upload_url ) )
                throw new Aq_Exception('Image must be local: ' . $url);
            // Define path of image.
            $rel_path = str_replace( $upload_url, '', $url );
            $img_path = $upload_dir . $rel_path;
            // Check if img path exists, and is an image indeed.
            if ( ! file_exists( $img_path ) or ! getimagesize( $img_path ) )
                throw new Aq_Exception('Image file does not exist (or is not an image): ' . $img_path);
            // Get image info.
            $info = pathinfo( $img_path );
            $ext = $info['extension'];
            list( $orig_w, $orig_h ) = getimagesize( $img_path );
            // Get image size after cropping.
            $dims = image_resize_dimensions( $orig_w, $orig_h, $width, $height, $crop );
            $dst_w = $dims[4];
            $dst_h = $dims[5];
            // Return the original image only if it exactly fits the needed measures.
            if ( ! $dims && ( ( ( null === $height && $orig_w == $width ) xor ( null === $width && $orig_h == $height ) ) xor ( $height == $orig_h && $width == $orig_w ) ) ) {
                $img_url = $url;
                $dst_w = $orig_w;
                $dst_h = $orig_h;
            } else {
                // Use this to check if cropped image already exists, so we can return that instead.
                $suffix = "{$dst_w}x{$dst_h}";
                $dst_rel_path = str_replace( '.' . $ext, '', $rel_path );
                $destfilename = "{$upload_dir}{$dst_rel_path}-{$suffix}.{$ext}";
                if ( ! $dims || ( true == $crop && false == $upscale && ( $dst_w < $width || $dst_h < $height ) ) ) {
                    // Can't resize, so return false saying that the action to do could not be processed as planned.
                    //throw new Aq_Exception('Unable to resize image because image_resize_dimensions() failed');
                    $img_url = $url; // MODIFIED
                }
                // Else check if cache exists.
                elseif ( file_exists( $destfilename ) && getimagesize( $destfilename ) ) {
                    $img_url = "{$upload_url}{$dst_rel_path}.{$ext}";
                }
                // Else, we resize the image and return the new resized image url.
                else {
                    $editor = wp_get_image_editor( $img_path );
                    if ( is_wp_error( $editor ) || is_wp_error( $editor->resize( $width, $height, $crop ) ) ) {
                        throw new Aq_Exception('Unable to get WP_Image_Editor: ' . 
                                               $editor->get_error_message() . ' (is GD or ImageMagick installed?)');
                    }
                    $resized_file = $editor->save();
                    if ( ! is_wp_error( $resized_file ) ) {
                        $resized_rel_path = str_replace( $upload_dir, '', $resized_file['path'] );
                        $img_url = $upload_url . $resized_rel_path;
                    } else {
                        throw new Aq_Exception('Unable to save resized image file: ' . $editor->get_error_message());
                    }
                }
            }
            // Okay, leave the ship.
            if ( true === $upscale ) remove_filter( 'image_resize_dimensions', array( $this, 'aq_upscale' ) );
            // Return the output.
            if ( $single ) {
                // str return.
                $image = $url;
            } else {
                // array return.
                $image = array (
                    0 => $url,
                    1 => $dst_w,
                    2 => $dst_h
                );
            }
            return $image;
        }
        catch (Aq_Exception $ex) {
            error_log('Aq_Resize.process() error: ' . $ex->getMessage());
            if ($this->throwOnError) {
                // Bubble up exception.
                throw $ex;
            }
            else {
                // Return false, so that this patch is backwards-compatible.
                return false;
            }
        }
    }
    /**
     * Callback to overwrite WP computing of thumbnail measures
     */
    function aq_upscale( $default, $orig_w, $orig_h, $dest_w, $dest_h, $crop ) {
        if ( ! $crop ) return null; // Let the wordpress default function handle this.
        // Here is the point we allow to use larger image size than the original one.
        $aspect_ratio = $orig_w / $orig_h;
        $new_w = $dest_w;
        $new_h = $dest_h;
        if ( ! $new_w ) {
            $new_w = intval( $new_h * $aspect_ratio );
        }
        if ( ! $new_h ) {
            $new_h = intval( $new_w / $aspect_ratio );
        }
        $size_ratio = max( $new_w / $orig_w, $new_h / $orig_h );
        $crop_w = round( $new_w / $size_ratio );
        $crop_h = round( $new_h / $size_ratio );
        $s_x = floor( ( $orig_w - $crop_w ) / 2 );
        $s_y = floor( ( $orig_h - $crop_h ) / 2 );
        return array( 0, 0, (int) $s_x, (int) $s_y, (int) $new_w, (int) $new_h, (int) $crop_w, (int) $crop_h );
    }
}

Kind regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[sait]

This reply has been marked as private.

[Harry]

Hi,

Please don’t add class Aq_Exception extends Exception {} class Aq_Resize { /** * The singleton instance */ static private $instance = null; /** * Should an Aq_Exception be thrown on error? * If false (default), then the error will just be logged. */ public $throwOnError = false; /** * No initialization allowed */ private function __construct() {} /** * No cloning allowed */ private function __clone() {} /** * For your custom default usage you may want to initialize an Aq_Resize object by yourself and then have own defaults */ static public function getInstance() { if(self::$instance == null) { self::$instance = new self; } return self::$instance; } /** * Run, forest. */ public function process( $url, $width = null, $height = null, $crop = null, $single = true, $upscale = false ) { try { // Validate inputs. if (!$url) throw new Aq_Exception('$url parameter is required'); if (!$width && !$height) throw new Aq_Exception('$width and $height parameter are required'); // MODIFIED // Caipt'n, ready to hook. if ( true === $upscale ) add_filter( 'image_resize_dimensions', array($this, 'aq_upscale'), 10, 6 ); // Define upload path & dir. $upload_info = wp_upload_dir(); $upload_dir = $upload_info['basedir']; $upload_url = 'http://cdnurl.com/wp-content/uploads'; $http_prefix = "http://"; $https_prefix = "https://"; $relative_prefix = "//"; // The protocol-relative URL /* if the $url scheme differs from $upload_url scheme, make them match if the schemes differe, images don't show up. */ if(!strncmp($url,$https_prefix,strlen($https_prefix))){ //if url begins with https:// make $upload_url begin with https:// as well $upload_url = str_replace($http_prefix,$https_prefix,$upload_url); } elseif(!strncmp($url,$http_prefix,strlen($http_prefix))){ //if url begins with http:// make $upload_url begin with http:// as well $upload_url = str_replace($https_prefix,$http_prefix,$upload_url); } elseif(!strncmp($url,$relative_prefix,strlen($relative_prefix))){ //if url begins with // make $upload_url begin with // as well $upload_url = str_replace(array( 0 => "$http_prefix", 1 => "$https_prefix"),$relative_prefix,$upload_url); } // Check if $img_url is local. if ( false === strpos( $url, $upload_url ) ) throw new Aq_Exception('Image must be local: ' . $url); // Define path of image. $rel_path = str_replace( $upload_url, '', $url ); $img_path = $upload_dir . $rel_path; // Check if img path exists, and is an image indeed. if ( ! file_exists( $img_path ) or ! getimagesize( $img_path ) ) throw new Aq_Exception('Image file does not exist (or is not an image): ' . $img_path); // Get image info. $info = pathinfo( $img_path ); $ext = $info['extension']; list( $orig_w, $orig_h ) = getimagesize( $img_path ); // Get image size after cropping. $dims = image_resize_dimensions( $orig_w, $orig_h, $width, $height, $crop ); $dst_w = $dims[4]; $dst_h = $dims[5]; // Return the original image only if it exactly fits the needed measures. if ( ! $dims && ( ( ( null === $height && $orig_w == $width ) xor ( null === $width && $orig_h == $height ) ) xor ( $height == $orig_h && $width == $orig_w ) ) ) { $img_url = $url; $dst_w = $orig_w; $dst_h = $orig_h; } else { // Use this to check if cropped image already exists, so we can return that instead. $suffix = "{$dst_w}x{$dst_h}"; $dst_rel_path = str_replace( '.' . $ext, '', $rel_path ); $destfilename = "{$upload_dir}{$dst_rel_path}-{$suffix}.{$ext}"; if ( ! $dims || ( true == $crop && false == $upscale && ( $dst_w < $width || $dst_h < $height ) ) ) { // Can't resize, so return false saying that the action to do could not be processed as planned. //throw new Aq_Exception('Unable to resize image because image_resize_dimensions() failed'); $img_url = $url; // MODIFIED } // Else check if cache exists. elseif ( file_exists( $destfilename ) && getimagesize( $destfilename ) ) { $img_url = "{$upload_url}{$dst_rel_path}.{$ext}"; } // Else, we resize the image and return the new resized image url. else { $editor = wp_get_image_editor( $img_path ); if ( is_wp_error( $editor ) || is_wp_error( $editor->resize( $width, $height, $crop ) ) ) { throw new Aq_Exception('Unable to get WP_Image_Editor: ' . $editor->get_error_message() . ' (is GD or ImageMagick installed?)'); } $resized_file = $editor->save(); if ( ! is_wp_error( $resized_file ) ) { $resized_rel_path = str_replace( $upload_dir, '', $resized_file['path'] ); $img_url = $upload_url . $resized_rel_path; } else { throw new Aq_Exception('Unable to save resized image file: ' . $editor->get_error_message()); } } } // Okay, leave the ship. if ( true === $upscale ) remove_filter( 'image_resize_dimensions', array( $this, 'aq_upscale' ) ); // Return the output. if ( $single ) { // str return. $image = $url; } else { // array return. $image = array ( 0 => $url, 1 => $dst_w, 2 => $dst_h ); } return $image; } catch (Aq_Exception $ex) { error_log('Aq_Resize.process() error: ' . $ex->getMessage()); if ($this->throwOnError) { // Bubble up exception. throw $ex; } else { // Return false, so that this patch is backwards-compatible. return false; } } } /** * Callback to overwrite WP computing of thumbnail measures */ function aq_upscale( $default, $orig_w, $orig_h, $dest_w, $dest_h, $crop ) { if ( ! $crop ) return null; // Let the wordpress default function handle this. // Here is the point we allow to use larger image size than the original one. $aspect_ratio = $orig_w / $orig_h; $new_w = $dest_w; $new_h = $dest_h; if ( ! $new_w ) { $new_w = intval( $new_h * $aspect_ratio ); } if ( ! $new_h ) { $new_h = intval( $new_w / $aspect_ratio ); } $size_ratio = max( $new_w / $orig_w, $new_h / $orig_h ); $crop_w = round( $new_w / $size_ratio ); $crop_h = round( $new_h / $size_ratio ); $s_x = floor( ( $orig_w - $crop_w ) / 2 ); $s_y = floor( ( $orig_h - $crop_h ) / 2 ); return array( 0, 0, (int) $s_x, (int) $s_y, (int) $new_w, (int) $new_h, (int) $crop_w, (int) $crop_h ); } }

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[sait]

Hi,

This part is the original functions.php file, I didn’t add;

When delete this part and paste only your forum codes everything distorted but photos still don’t appear. Like Attach:

<?php
/**
* Claue child theme functions.
* @since 1.0.0
* @package Claue

* Enqueue style of child theme
*/

function jas_claue_enqueue_script() {
wp_enqueue_style( ‘jas-claue-parent-style’, get_template_directory_uri() . ‘/style.css’ );
}
add_action( ‘wp_enqueue_scripts’, ‘jas_claue_enqueue_script’ );

Attachments:

You must be logged in to view attached files.

[sait]

when look the developers tools, src is unknown. I try to attach a media as a featured image from cdn file direction, it can see image. I don’t understand, whats the problem

Attachments:

You must be logged in to view attached files.

[Harry]

Can you send me your site admin account and check in “Set as private reply” we need more check before give you a hint.

Thanks

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[sait]

This reply has been marked as private.

[sait]

Hi again,
While researching the subject, I saw one of the github user re-adapt the aqua resizer for the amazon s3. maybe this can give you an idea for other cdn providers.

https://github.com/richardyu314/aqua-resizer-s3/blob/master/aqua-resizer.php

Thank you for your interest.

[Harry]

Hi,

Did you running your site on Amazon S3?

Please following additional steps:

(1) download the AWS PHP SDK from https://github.com/richardyu314/aqua-resizer-s3

(2) update line 17 (“require_once”) to point to the absolute path of your AWS SDK installation’s aws-autoloader.php (i.e., /var/www/html/aws/aws-autoloader.php”)

(3) update $s3url on line 84 to point to the URL of your S3 or Cloudfront CDN (i.e., a888888.cloudfront.net). Do not use a trailing slash on this URL

(4) update lines 162 to 165 with your AWS credentials (S3 bucket name, IAM user key, IAM user secret)

Note that for (3), this implementation assumes that your S3 bucket has a wp-content/uploads path set up. If your S3 bucket is configured differently, change lines 139 and 155 where wp-content/uploads is referenced to your media directory in S3

Kind regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[sait]

Hi,

No,  my site not running on Amazon, but if they can run aqua resizer with amazon, can’t you adapt it to other cdn suppliers too?

[Harry]

Hi,

I’m sorry i check the code of Amazon S3 but can’t apply for our theme and your site. We still investigate your issue when find solution we will inform you.

Kind regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[sait]

Thanks for your interest, looking forward to your good news.

[sait]

Hi,

Have you found a solution to the problem ?

[Harry]

I’m sorry, we still not find solution. Does the CDN have option to exclude image of blog?

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[Author]

Posts