Hi there I'm having troubles with some shortcode because it's result appears above the page content when it should appears instead the place where the shortcode is placed. This is the shortcode code...

<?php
if (!defined('ABSPATH')) exit;

/* creacion del shortcode [cotizador id=""] */

function cotizador_shortcode($atts)
{
    /* le pasamos los argumentos al shortcode dentro de un array */
    $args = array(
        'post_type' => 'vehiculos', /* se toma de post_type.php */
        'id' => $atts['id']
        // 'familia' => $atts['familia']
    );
    $cotizador = new WP_Query($args); /* sirve para imprimir el post_type en el shortcode */
    
    $single_car_query = cotizador_car_query($args['id']);
    // $title_query = cotizador_query_select($single_car_query['post_id']);
    $precio = $single_car_query['car_price'];
    $enganche = $single_car_query['car_price'] * 0.10;
    // echo "<pre>";
    //    var_dump($enganche);
    // echo "</pre>";
    
?>

<!-- THE CODE BELOW SHOULD APPEAR IN THE PAGE CONTENT AS A TABLE -->

    <form name="cotizador_enviar" id="cotizador_enviar">
        <div id="cotizador" class="cotizador">
            <table class="table table-hover">
                <thead>
                    <tr>
                        <th scope="col">Modelo</th>
                        <th scope="col">Precio</th>
                        <th scope="col">Enganche</th>
                        <th scope="col">Bono</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>Otto</td>
                        <td><?php echo esc_attr("$". $precio); ?></td>
                        <td><?php echo esc_attr("$". $enganche); ?></td>
                        <td>No</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </form>

<?php
}
add_shortcode('cotizador', 'cotizador_shortcode');

As you can see, the result is HTML, but when I place the shortcode in the page content it looks like this:

When the result should appear below the picture as you can see here in the wp-admin:

I know that if we use "echo" this happen and can be fixed using "return" but this only works for variables (I guess) but in my case the result is not a variable so I'm confused

THANKS!!

Hi there I'm having troubles with some shortcode because it's result appears above the page content when it should appears instead the place where the shortcode is placed. This is the shortcode code...

<?php
if (!defined('ABSPATH')) exit;

/* creacion del shortcode [cotizador id=""] */

function cotizador_shortcode($atts)
{
    /* le pasamos los argumentos al shortcode dentro de un array */
    $args = array(
        'post_type' => 'vehiculos', /* se toma de post_type.php */
        'id' => $atts['id']
        // 'familia' => $atts['familia']
    );
    $cotizador = new WP_Query($args); /* sirve para imprimir el post_type en el shortcode */
    
    $single_car_query = cotizador_car_query($args['id']);
    // $title_query = cotizador_query_select($single_car_query['post_id']);
    $precio = $single_car_query['car_price'];
    $enganche = $single_car_query['car_price'] * 0.10;
    // echo "<pre>";
    //    var_dump($enganche);
    // echo "</pre>";
    
?>

<!-- THE CODE BELOW SHOULD APPEAR IN THE PAGE CONTENT AS A TABLE -->

    <form name="cotizador_enviar" id="cotizador_enviar">
        <div id="cotizador" class="cotizador">
            <table class="table table-hover">
                <thead>
                    <tr>
                        <th scope="col">Modelo</th>
                        <th scope="col">Precio</th>
                        <th scope="col">Enganche</th>
                        <th scope="col">Bono</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>Otto</td>
                        <td><?php echo esc_attr("$". $precio); ?></td>
                        <td><?php echo esc_attr("$". $enganche); ?></td>
                        <td>No</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </form>

<?php
}
add_shortcode('cotizador', 'cotizador_shortcode');

As you can see, the result is HTML, but when I place the shortcode in the page content it looks like this:

When the result should appear below the picture as you can see here in the wp-admin:

I know that if we use "echo" this happen and can be fixed using "return" but this only works for variables (I guess) but in my case the result is not a variable so I'm confused

THANKS!!

• shortcode

1 Answer 1

You should use output control functions if you want to do it this way:

function cotizador_shortcode($atts)
{
    ... your code here ...
    ob_start();
?>

<!-- THE CODE BELOW SHOULD APPEAR IN THE PAGE CONTENT AS A TABLE -->

... HTML here ...

<?php
    $output = ob_get_contents();
    ob_end_clean();
    return $output;
}
add_shortcode('cotizador', 'cotizador_shortcode');