web-dev-qa-db-ja.com

Wp_get_image_editorを使用して画像のサイズを変更する方法

私はメタフィールドでアップロードした画像をどのようにリサイズすることができるかをたくさん探しますが、wp_get_image_editorの代わりに何も得られません。私はそれについてコーデックスから読みましたが何も役に立たなかったので私はこの関数について検索してこれらのリンクを見つけました

http://bhoover.com/wp_image_editor-wordpress-image-editing-tutorial/ /

http://wpunknown.com/wp_image_editor/

しかし、それは私にとっても役に立ちません。

最初のリンクからスクリプトを試しました。最初にメディアから画像をアップロードしてからページテンプレートを作成し、whileループで私のテンプレートにこのコードを書きます。

if(have_posts()) :
    while(have_posts()) :
        the_post();

        the_title();

        // wp editor image script
        $testing_img_src = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'full');

        $img = wp_get_image_editor( $testing_img_src[0] );

        if ( ! is_wp_error( $img ) ) {
            $img->resize( 500, NULL, false );
            $img->set_quality( 100 );
            $img->stream();
        }

    endwhile;

このページを更新すると、このようながらくたが発生します。

����JFIF��,��gf8�R�����;�8'���Z�v� F��`q�q� <+�g�51N��`NO���2�Bo���Jֵ��>����o3����M]�(��]�[�u���^핺��_�#;U�,OLs��$�� �F �+XΪ�|�rx�v���p |�&�����s�u<H��a��=r�}�X��dR�� ������07`qھk�r� ���$����tvw�l����朴�B�i]�-R��}.�N)6���>ҵ�,na��G9-���8�#��Kik6 �$y>�w�� �N��~=��1�y8!�ʂ:��v��1����V(U%r6�e��Ns��'�7t �x��1�yF2�I]Y���ˢ~�����5��Z�T��m5&����u+�^��^�} 7���\ЎGL�����`�� ��jm�Q�s� gn���#8�p���Um#�v�rQZu�d����N@� `�3�s^�a�:�����2G�<�A��njz�'�fx+Ƣ����;��>�.�6֎��1Y�:sS�MYI[E�v\�����j��5τk)>\!K���덤�@�둞�9�|)����u9 ��\c9��v<�_�>�y���㿠����98��_M�S�FK��� ��`�!H#�������IENSi+ZZ��o��V������=���sx��MNWmӌcZO�i�=��馺/��� �Zk�h���#pʶHc�J����1Y?oլ���]F2�(�BN�1�Q�A�2 �����:�IKt,s� 9(��m�n�^;�|�Us�������9$� �3���@?k���"1X�T�t�������o}ZX�G�>��U2�UJmk9;+-4�\R��QM�eu��ŏ��9[�����`���O�9� �$q�[kZu�+�N����O\���� {����f��@�pH%Hϧ$����$�~�c���L�B�7#��gvO�k�)b�{2Iӯ R��rV�u�M+lܞ������4�㍲5(���S�q����f�ҋ~�W~���[�R++�J��۹O^:�|����`֟��\�����$�`7:���s۟e � ����)$E�X�H$��(U>�v'Z���[��H��q�~��T�G}�B�&� S����֋I�W 4��N-Żi�O[�O��ή�Y������Fp��qJ|��V���w�m�j�5[��|��!Nv��� ����>�����,��*q��w)1�8�U��y�]mJ�8�bX��$��O%�����K�$�������9���FO�f|��̱XJ7j�M=5��o9h�����`�2r�bR��V�Y9��n�'e��)s$���>5�~�F��*rQJ`�@�d�9 s���;�I*:1;Y�}�8�@��~�d�i�Hط�)�����8=�Y7���!�c>�YT|��c��20r3�+���^�y��q�䞼�릯f�k6��.�����pxz괕���8�YFq�KmaukJ��?���V�yɀ� ��c��\pH=����'Z�^��U`@#~Cd��N�;���>��~9I0 ��'v8�$�����כj��`ge����rp0xۏ�q���q��{�z��s�[]ӓ��T��dӳv�}U���{8~ ���X������V��)FQk�����e�O��[k�����3�������5�Ť�q����Q���$Ԍ����>j���ʥC�v�f@;JF@Rs�A�y�KA`q�����|W�%e�#q���^>� ����ONģk$�7��i.���m�~���t�Ғ��<�����wvwm[僫�&�2�$��g�gh���ӷ`���R��:b�@�RX+)~FyNppæ �F?NY��C��@w`��2G^ �9��<�N���/Ԝ������8$��<�� �_9��̯u[N�j��M����w���{��$�҇���R�mG����V���[Kk�$��g�2�D���n#v N�nRޘ) ���<�1̖�|���dF�����A�a�}�xL��D/�w�)w(<B_rO���4��0�!l��9�9��H����f���ܝ�ݚZ���}l읬���s��\�u^*�7k5{Yr�]�[;�d���ic�գȡ��t�b0����4W��| �\8��TN�Q�|o�:gМ�E|��n7v�G������S��[y�|B�JXuk���ݾ�|��~W������eN��pI�2p�A�y8Ÿ��$����5<jM�袢�3i�Y��>Vm:��$y8�z�`{���7m5k�"���B1���1��x�������xV�l����nI�9����s�����\� ���q�В@�{�./�NΣJ���j�I�����|�g��W���UU��ۊ��i%u������_��|n��9�O�q��20���Ѵ�i�!6ʀ��<��lr�v�OB8[���� ���?־�o1�I$+G$���F '$� 0���֘�|�@BH*��� �a�6?H��L�P�S �8���d��+#Q�{�_���lp@�����GO�zc�'�r�/�pR����dՒz5���]U�}�WG�Q�tʳHԞ� �+�8��V|�N�_���H���>������y9 0�$,��F���.Y��U�I�#vOB}��{��~[�dx! ��( ��H#�s�pG`>Q�����F�sE�c�8����{�,q�+����� ��V��*KI���]7ItIj�Vg���s�S��N-6��<*Z��W��vmEݞ��x�O�Dt9#��������8�� ���ep�R[� dH�G98�prB�·����Љ�#d�� �8<����Cm��i,�h@@9�F <�r@��@�'���!�_�8��5eg'^�umY�Y�|���!�?�'/k��(A��)�OM�v�^��d�W�Gߥ,��)�������ッ���xr)�h����;�����3؃��z'Ư,�]�NH;�A��K:��kۼ;�oL�T t�w_�c�I ���Pk�ܫ��||aɊ�$���I_f����Y����q�?���ƥ)F\��yӳJ�RM'�z(�v3�z�����v��^:q�`t$� UY5{i�Pz�OA?78�3���w_�t���G;�猯�\����/c��~��2O�H�Br8� �������p��q����ee���OG��F�}���4� �E)^5h����%is-�ꬵj�S�4ψ:�ˉ� >z�����q�zz���=^٘��\��s�8 )$���������j�S�R~�`�L��~E]xg[��x��6rp ���r:>���-��)I�B��,8#���o�5�s<��y� �+I�k�N�2[�%n�a�iAr>WN+N��������c���Uӯv�x�89[+���'�x$��kO���9����^�b���Ɵ�K�r�r <�K�y�c�\ӼW��F�M�2�p'9��N�c95������R ��Q����kU}ԗe��r~����J,����u��Oe��}U�5]h��IE���ns�_��T�`@�*�>1���3L��K��z�mـ � ����G�a��#6#9��c�����C�ޓ�F�"��0>U9��;�

私はまたハードコード化されたイメージパスを追加しようとしました:

//$testing_img_src = ABSPATH.'wp-content/uploads/2015/06/colorful-background-31.jpg';

しかし、それは私に同じ結果を与えます。だから私がどうやってwp_get_image_editor()を使うことができるように私のイメージをリサイズしたりトリミングORするためにこれが他の方法であるかを助けてください。

NOTE:add_image_size()を使いたくない

2
deemi-D-nadeem

考えられる解決策:

目標: カスタムサイズの画像を表示するのにadd_image_size()を使わないでください。

保存せずに画像を計算すると、不要な処理時間が繰り返されるため、すべての要求が合計で非常に大きなページロードになります。そのため、結果をキャッシュまたは保存することが追加の目標となります。

Template/pluginに image-processor.php を追加してください。

//Load your WordPress enviroment
$path = dirname(__FILE__);
$path = substr($path, 0, stripos($path, "wp-content") );
require( $path . "wp-load.php");

//TODO: filter and handle your $_GET params
$post_id = absint($_GET['post_id']);

$testing_img_url = wp_get_attachment_image_url(
    get_post_thumbnail_id($post->ID), 'full'
);

if (!$testing_img_url)
    $testing_img_url = 'http://domain.tld/path/to/defaul-image.jpg';

$img = wp_get_image_editor( $testing_img_url );

if ( ! is_wp_error( $img ) ) {
    header('Content-type:'.finfo_file ($testing_img_url));
    $img->resize( 500, NULL, false );
    $img->set_quality( 100 );
    $img->stream();
}

このように画像をループで表示することができます。

テンプレート

<img src="<?= get_template_directory_uri()?>/image-processor.php?post_id=<?= get_the_ID()?>">

プラグイン

<img src="<?= plugin_dir_path(__FILE__)?>image-processor.php?post_id=<?= get_the_ID()?>">

考えられる改善点

  • 処理された画像をキャッシュ/保存します。
  • より良いエラー処理。
0
iantsch