Obtener el ID de la entrada actual como una variable en Javascript

15 dic 2015, 02:51:53
Vistas: 43.9K
Votos: 4

Estoy tratando de mostrar el ID de la entrada en Javascript y no lo consigo.

var post_id = '123';  // funciona bien

var post_id = '<?php global $post; echo $post->ID; ?>';  // muestra 'ID; ?>'

var post_id = '<?php echo $post->ID;?>';  // muestra 'ID; ?>'

¿Hay una forma correcta de mostrar el ID de la entrada?

2
Comentarios

¿Lo estás haciendo fuera del bucle o dentro? También puedes usar el segundo método para mostrarlo. Pero recuerda que si lo pones entre comillas simples, se considerará como una cadena de texto. Necesitas analizarlo antes de usarlo.

Kvvaradha Kvvaradha
15 dic 2015 03:00:14

¿Has comprobado get_queried_object_id() o get_the_ID()?

jgraup jgraup
15 dic 2015 03:02:48
Todas las respuestas a la pregunta 11
0
13

Puedes pasar variables a JavaScript usando la función wp_localize_script: https://codex.wordpress.org/Function_Reference/wp_localize_script

Añade lo siguiente a functions.php

if(!function_exists('load_my_script')){
    function load_my_script() {
        global $post;
        $deps = array('jquery');
        $version= '1.0'; 
        $in_footer = true;
        wp_enqueue_script('my-script', get_stylesheet_directory_uri() . '/js/my-script.js', $deps, $version, $in_footer);
        wp_localize_script('my-script', 'my_script_vars', array(
                'postID' => $post->ID
            )
        );
    }
}
add_action('wp_enqueue_scripts', 'load_my_script');

Y tu archivo js (theme-name/js/my-script.js):

jQuery(document).ready(function($) {
        alert( my_script_vars.postID );
});

Nota:

Si estás intentando pasar números enteros necesitarás llamar a la función JavaScript parseInt().

15 dic 2015 06:12:06
1

Está disponible en el campo oculto post_ID tanto para entradas publicadas como nuevas. Puedes obtenerlo usando este simple código jQuery.

jQuery("#post_ID").val()
14 jun 2017 21:12:20
Comentarios

Esto no siempre está disponible y no se puede confiar en ello. El campo oculto con post_ID se agrega en el editor y no en la parte frontal, por lo que no está disponible para usar en un tema. Siempre y cuando conozcas las limitaciones, esto puede estar perfectamente bien.

Morgan Estes Morgan Estes
7 mar 2018 19:50:23
1

Yo uso esto -

document.querySelector('.status-publish').getAttribute('id');

Esto te da post-xxx donde xxx es el número del post. Luego puedes reemplazar post- con una cadena vacía.

var id = document.querySelector('.status-publish').getAttribute('id').replace("post-", "");
4 sept 2019 22:14:21
Comentarios

Esto es brillante. ¡Gracias!

ronnefeldt ronnefeldt
22 feb 2023 16:23:12
2

Vale, lo tengo. Quizás esto le ayude a alguien. En el archivo functions.php del tema:

function pid() {

global $current_screen;
$type = $current_screen->post_type;

    ?>
    <script type="text/javascript">
    var post_id = '<?php global $post; echo $post->ID; ?>';
    </script>
    <?php

} 
add_action('wp_head','pid');
15 dic 2015 02:59:03
Comentarios

Yo eliminaría el $type = $current_screen->post_type;

talsibony talsibony
9 ene 2018 19:11:42

Generalmente evitaría este método. Escribir JS dentro de PHP es generalmente una mala práctica y este método en particular crea un script que bloquea el renderizado.

Sugiero una solución intermedia entre las sugerencias. Asumiendo que estás usando un tema como el mencionado, puedes fácilmente añadir un input oculto en HTML y pasar el ID del post usando get_the_ID(). (Dentro de tus archivos de plantilla, o podría agregarse a header.php)

Una vez que tienes el input oculto (aunque honestamente podría ser cualquier elemento DOM), es fácilmente accesible desde JQuery.

Este método permite verificar permisos de forma segura y evita el bloqueo de renderizado.

JRad the Bad JRad the Bad
4 may 2019 21:49:51
0

Quizás lo necesites en PHP pero aquí tienes una solución en JavaScript puro... aunque dependes de que WordPress mantenga la clase "post-XXX" en el body.

function getWordPressPostId() {
    let postID = null;
    try {
        document.getElementsByTagName("body")[0].classList.forEach((cls) => {
            if(cls.startsWith("postid-")) {
                postID = cls.split("-")[1];
            }
        });
    } catch(exc) {
        // ... manejar excepción
    }
    return postID;
}
7 mar 2024 22:46:18
1

al frontend postID = jQuery('article').attr('id').slice(5);

al backend post_ID = jQuery('#post_ID').val();

21 feb 2020 15:20:41
Comentarios

La solución front-end es un enfoque muy dependiente del tema.

Oksana Romaniv Oksana Romaniv
15 jun 2020 13:11:21
0

En las pantallas de edición de entradas cuando Gutenberg está activado, puedes usar una variable JS definida por el objeto wp.media.

wp.media.view.settings.post.id,

En el front-end, el mejor enfoque ya fue descrito anteriormente.

18 feb 2021 22:39:33
0

Nota: A partir de WordPress 4.5 se recomienda usar wp_add_inline_script(), en lugar de wp_localize_script() - este último está destinado para la localización.

Ver: wp_localize_script() > Más información

wp_add_inline_script()

6 may 2021 10:33:55
1

Estoy usando document.getElementById('cdp-current-post-id').value en WordPress 6.4

27 feb 2024 20:09:57
Comentarios

Error no capturado: document.getElementById(...) es nulo

Fanky Fanky
25 mar 2024 14:26:44
0

Para obtener el ID de la publicación actual en JS dentro de un entorno de WordPress, normalmente necesitas pasar el ID de la publicación desde PHP a JS usando wp_localize_script() o incrustarlo directamente en el marcado HTML.

Primero, encola tu archivo JS en el archivo functions.php de tu tema:

function enqueue_custom_script() {
    // Encuela tu archivo JavaScript
    wp_enqueue_script('custom-script', get_template_directory_uri() . '/js/custom-script.js', array('jquery'), '', true);
    
    // Pasa el ID de la publicación al archivo JavaScript
    global $post;
    wp_localize_script('custom-script', 'post_id_object', array('post_id' => $post->ID));
}
add_action('wp_enqueue_scripts', 'enqueue_custom_script');

En el archivo custom-script.js, puedes acceder a la variable del ID de la publicación así:

// Accede a la variable del ID de la publicación pasada desde PHP
var post_id = post_id_object.post_id;
console.log(post_id); // Muestra el ID de la publicación en la consola del navegador
28 feb 2024 13:25:50
0

Si te refieres al frontend, aquí está mi línea de código para extraer el ID de la clase del body:

var postid = $("body")[0].className.match(/postid-\d+/)[0].split("-")[1];

No es necesario usar PHP, así puedes mantener tus scripts JavaScript separados.

25 mar 2024 14:24:05