Я работаю в магазине Woocommerce, на странице продукта я хочу иметь возможность отображать несколько изображений, поместив шорткод в текстовом редакторе. изображения являются условными и отображаются только в том случае, если вызываемый атрибут содержит определенное значение. Мне удалось создать такую функцию с помощью оператора switch для поиска значения и отображения изображения, если оно существует.

Вот код - он помещен в functions.php в моей дочерней теме.

   function display_colors_pic_sp() {
        $product = wc_get_product();
        $terms = get_terms("pa_color");
        foreach($terms as $term)
            switch ($term->name) {
                case "Blue RAL 5003":
                    echo '<img src="https://example.dk/wp-content/uploads/2019/04/RAL_5003_1024x1024-1.jpg">';
                break;

                case "Blue RAL 5010":
                    echo '<img src="example.dk/wp-content/uploads/2019/04/RAL_5003_1024x1024-1.jpg">';
                break;

                case "Blue RAL 5013":
                    echo '<img src="https:example.dk/wp-content/uploads/2019/04/RAL_5013_e5005376-6410-479a-b526-f23ca5f13cb3_1024x1024.jpg">';
                break;

                case "Green RAL 6007":
                    echo '<img src="https://example.dk/wp-content/uploads/2019/04/RAL_6007_1024x1024.jpg">';
                break;

                case "Grey RAL 7021":
                    echo '<img src="https://example.dk/wp-content/uploads/2019/04/RAL_7032_1024x1024.jpg">';
                break;

                case "Grey RAL 7035":
                    echo '<img src="https://example.dk/wp-content/uploads/2019/04/RAL_7035_f0d32a8d-7aac-45a8-97ec-cd46c8e35daf_1024x1024.jpg">';
                break;

                case "Black RAL 9005":
                    echo '<img src="https://example.dk/wp-content/uploads/2019/04/RAL_9005_61462eeb-8b3d-4792-909b-fdb549d47e80_1024x1024.jpg">';
                break;

                case "White RAL 9010":
                    echo '<img src="https://example.dk/wp-content/uploads/2019/04/RAL_9010_f80b4432-ba58-4377-821a-8ee8832a8610_1024x1024.jpg">';
                break;

            }


        }

    add_shortcode('colorpic', 'display_colors_pic_sp');

Он работает в основном так, как он должен, и отображает все изображения в зависимости от значения, но по какой-то причине, независимо от того, где я размещаю шорт-код. он появляется в верхней части страницы, сразу после заголовка, независимо от того, где я размещаю шорткод. У меня есть другой короткий код, который делает что-то еще, и я могу выбрать позицию, по которой я ставлю короткий код.

ПРИМЕЧАНИЕ. Если я изменю эхо-сигнал на возврат, появится короткий код там, где я хочу, чтобы он появился. но тогда он показывает только первый случай по какой-то причине, но не другие, которые также содержат значение. Я также попытался удалить "разрыв"; после каждого случая.

Я был бы очень рад, если бы у кого-то было время и желание помочь мне и выяснить, почему короткий код размещается в верхней части страницы, а не там, где размещен короткий код.

2
barud 12 Апр 2019 в 10:40

2 ответа

Лучший ответ

С шорткодами все нужно всегда возвращать, но никогда не повторять (или печатать)

Кроме того, поскольку WordPress 4.5.0 с использованием get_terms(), таксономии должны быть всегда передается через аргумент 'taxonomy' в массиве $ args.

Так что вы можете включить буферизацию , используя php ob_start() работает следующим образом:

function display_colors_pic_sp() {
    ob_start(); // Start buffering

    $path = content_url('/uploads/2019/04/');

    foreach( get_terms( array('taxonomy' => 'pa_color') ) as $term) {
        switch ($term->name) {
            case "Blue RAL 5003":
                echo '<img src="'.$path.'RAL_5003_1024x1024-1.jpg">';
            break;

            case "Blue RAL 5010":
                echo '<img src="'.$path.'RAL_5003_1024x1024-1.jpg">';
            break;

            case "Blue RAL 5013":
                echo '<img src="'.$path.'RAL_5013_e5005376-6410-479a-b526-f23ca5f13cb3_1024x1024.jpg">';
            break;

            case "Green RAL 6007":
                echo '<img src="'.$path.'RAL_6007_1024x1024.jpg">';
            break;

            case "Grey RAL 7021":
                echo '<img src="'.$path.'RAL_7032_1024x1024.jpg">';
            break;

            case "Grey RAL 7035":
                echo '<img src="'.$path.'RAL_7035_f0d32a8d-7aac-45a8-97ec-cd46c8e35daf_1024x1024.jpg">';
            break;

            case "Black RAL 9005":
                echo '<img src="'.$path.'RAL_9005_61462eeb-8b3d-4792-909b-fdb549d47e80_1024x1024.jpg">';
            break;

            case "White RAL 9010":
                echo '<img src="'.$path.'RAL_9010_f80b4432-ba58-4377-821a-8ee8832a8610_1024x1024.jpg">';
            break;
        }
    }
    return ob_get_clean(); // Return buffered content
}
add_shortcode('colorpic', 'display_colors_pic_sp');

Код помещается в файл function.php вашей активной дочерней темы (или активной темы). проверено и работает.

0
LoicTheAztec 12 Апр 2019 в 08:36

Поскольку он работает при возврате, это означает, что фреймворк вызывает функцию там, где она хочет, и ожидает, что вы вернете значения для нее, чтобы разместить ее в нужном месте. Если вы позвоните echo, он сразу же отправит значение на выход, и это не сработает.

Вы можете добавить весь HTML-код в переменную и вернуть его, и это должно решить проблему. Так что-то вроде этого:

function display_colors_pic_sp() {
    $ret = "";
    $product = wc_get_product();
    $terms = get_terms("pa_color");
    foreach($terms as $term)
        switch ($term->name) {
          case "Blue RAL 5003":
             $ret .= '<img src="https://example.dk/wp-content/uploads/2019/04/RAL_5003_1024x1024-1.jpg">';
             break;
          case "Blue RAL 5010":
             $ret .= '<img src="example.dk/wp-content/uploads/2019/04/RAL_5003_1024x1024-1.jpg">';
             break;
      ...
    return $ret;
}
0
Sami Kuhmonen 12 Апр 2019 в 07:51