Debajo del código HTML fácil, tomado de un ejemplo de tensorflow. He creado en mi propia PC un sitio de wordpress, solo para probar, y me gustaría agregar la página o el contenido de la página al sitio web. Dos formas: la primera, la preferida, intenta integrar el código HTML y el archivo js (que mantienen comandos de tensorflow, no relacionados con temas) en una página de wordpress. No hay problema para el HTML, pero no puedo encontrar la forma de vincular el archivo js. Intenté modificar function.php, usando wp_enqueue_script, pero no entiendo dónde almacenar el archivo js según, y la ruta para especificar. Si funciona en vista previa, no funciona cuando publico la página. También algunos otros métodos sin éxito. La segunda forma es vincular la página html anterior, pero ¿dónde debo insertar el archivo html y el archivo js?
Gracias por tu ayuda, estoy muy atascado.
<html> <head> <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@latest"> </script> <script src="webcam.js"></script> <script src="rps-dataset.js"></script> </head> <body> <div> <div> <video autoplay playsinline muted id="wc" width="224" height="224"></video> </div> </div> <button type="button" id="0" onclick="handleButton(this)" >Rock</button> <button type="button" id="1" onclick="handleButton(this)" >Paper</button> <button type="button" id="2" onclick="handleButton(this)" >Scissors</button> <div id="rocksamples">Rock Samples:</div> <div id="papersamples">Paper Samples:</div> <div id="scissorssamples">Scissors Samples:</div> <button type="button" id="train" onclick="doTraining()" >Train Network</button> <div id="dummy">Once training is complete, click 'Start Predicting' to see predictions, and 'Stop Predicting' to end</div> <button type="button" id="startPredicting" onclick="startPredicting()" >Start Predicting</button> <button type="button" id="stopPredicting" onclick="stopPredicting()" >Stop Predicting</button> <div id="prediction"></div> </body> <script src="index.js"></script> </html>Supongo que el mejor enfoque sería crear una plantilla de página personalizada.
¿Está utilizando un tema personalizado o un tema del repositorio de temas de wordpress? Lo pregunto porque este último se actualizará con frecuencia y anulará la opción personalizada como las de su functions.php. En este caso, puede crear un tema secundario.
Ver esta descripción: Crear temas secundarios
Luego puede crear una plantilla de página personalizada creando un nuevo archivo como
"page-tmpl-tensor.php" en su carpeta de tema/tema secundario.
Su contenido es bastante parecido a su código html, pero necesita algunas funciones/variables específicas de wordpress para funcionar.
<?php /* Template name: tensorflow Template Post Type: post, page */ $theme_url = get_template_directory_uri(); ?> <html> <head> <link rel="stylesheet" href="<?php echo $theme_url; ?>/tensor.css"> <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@latest"> </script> <script src="<?php echo $theme_url; ?>/webcam.js"></script> <script src="<?php echo $theme_url; ?>/rps-dataset.js"></script> </head> <body> <div> <div> <video autoplay playsinline muted id="wc" width="224" height="224"></video> </div> </div> <button type="button" id="0" onclick="handleButton(this)" >Rock</button> <button type="button" id="1" onclick="handleButton(this)" >Paper</button> <button type="button" id="2" onclick="handleButton(this)" >Scissors</button> <div id="rocksamples">Rock Samples:</div> <div id="papersamples">Paper Samples:</div> <div id="scissorssamples">Scissors Samples:</div> <button type="button" id="train" onclick="doTraining()" >Train Network</button> <div id="dummy">Once training is complete, click 'Start Predicting' to see predictions, and 'Stop Predicting' to end</div> <button type="button" id="startPredicting" onclick="startPredicting()" >Start Predicting</button> <button type="button" id="stopPredicting" onclick="stopPredicting()" >Stop Predicting</button> <div id="prediction"></div> </body> <?php wp_footer(); ?> <script src="<?php echo $theme_url; ?>/index.js"></script> </html> <!-- tensorflow -->Ahora puede crear una nueva página en el área de administración de wordpress y debería ver su plantilla "tensorflow" en el menú desplegable de plantillas de página.
También puede reemplazar el contenido del cuerpo con estas líneas para recuperar el contenido de forma dinámica:
<?php setup_postdata($post->ID); echo get_the_content(); ?>Ahora puede pegar y editar su cuerpo html en el campo de contenido de la página. En este caso, asegúrese de pegar el html en modo html/texto.