¿Te has dado cuenta de que WooCommerce utiliza diferentes URLs que en realidad no existen como páginas para mostrar diferente contenido al usuario? ¿Te has vuelto alguna vez loco buscando el template de la página en la que el cliente puede editar sus datos o ver sus pedidos?
No busques más, esas páginas no existen. Se trata de los endpoints de WooCommerce, un sistema que muestra diferentes contenidos en una misma página. Vamos a ver cómo funciona.
Tabla de contenidos
Endpoints vs. shortcodes
Hasta la versión 2.0, WooCommerce mostraba al usuario el contenido en páginas mediante shortcodes. En la versión actual (2.6.14 en el momento de escribir esto) lo sigue haciendo: las páginas Carrito, Finalizar compra o Mi cuenta son páginas normales de WordPress que contienen estos shortcodes especiales. Puedes verlos todos en este artículo:
Pero antes eran muchos más. La página de gracias por su pedido, la de edición de los datos del cliente, la de seguimiento del pedido y algunas otras se implementaban también mediante shortcodes. Un engorro.
La llegada de los endpoints
Sin embargo todo eso cambió a partir de WooCommerce 2.1. Esta colección de shortcodes se agrupó en sólo cuatro, que son los que hay activos a día de hoy:
Tu carrito está vacío.Acceder
Pero entonces, ¿qué ha pasado con esos contenidos? ¿Dónde están en realidad la página de agradecimiento por el pedido, la de contraseña perdida o la de descargas, que hoy podemos ver en diferentes pestañas de la página Mi cuenta?
Pues, simplemente, esas páginas no existen.
Qué son los endpoints
Sin embargo, resulta que si accedes a www.tutiendachula.com/mi-cuenta/view-order/{ID_de_PEDIDO} puedes hacer el seguimiento de un pedido (si es tuyo, como cliente), o si entras en www.tutiendachula.com/mi-cuenta/edit-account/ puedes editar los detalles de la cuenta. ¿Qué clase de brujería es ésta? 🙂
Pues esto son precisamente los endpoints: en realidad la única página que existe como tal (refiriéndome a los ejemplos que acabo de poner) es la de Mi cuenta, www.tutiendachula.com/mi-cuenta/, y el resto de esos contenidos se generan de forma dinámica en función de la URL llamada.
¿Estás construyendo tu tienda online o eres implementador WordPress?
¿Necesitas plugins de calidad y con soporte para implementar funcionalidades concretas?
Consigue todos los plugins a la venta en la sección de plugins de esta web y todos los que siga añadiendo. Acceso a los 96 plugins (y subiendo) con soporte directo del desarrollador, actualizaciones y uso ilimitado: úsalos en tantas webs como lo necesites.
Qué endpoints existen
Como decía más arriba, en WooCommerce 2.1 se sustituyeron muchos shortcodes por endpoints, repartidos entre las páginas Mi cuenta y Finalizar compra (Checkout). Son los siguientes:
- Mi cuenta (tomando como base www.urldetutienda.com/mi-cuenta)
- Pedidos: /orders/
- Ver pedido: /view-order/{ID_de_PEDIDO}
- Descargas: /downloads/
- Detalles de la cuenta (nombre, email y contraseña): /edit-account/
- Direcciones: /edit-address/
- Editar la dirección de facturación: /edit-address/billing/
- Editar la dirección de envío: /edit-address/shipping/
- Formas de pago (las que tiene el usuario guardadas): /payment-methods/
- Añadir forma de pago (básicamente guardar datos de la tarjeta de crédito): /add-payment-method/
- Contraseña olvidada: /lost-password/
- Logout: /customer-logout/
- Finalizar compra (tomando como base www.urldetutienda.com/finalizar-comprar)
- Página de pago: /order-pay/{ID_de_PEDIDO}
- Añadir forma de pago (sí, está disponible desde ambas páginas): /add-payment-method/
- Eliminar forma de pago: /delete-payment-method/
- Establecer forma de pago por defecto: /set-default-payment-method/
- Order received («gracias por su pedido»): /order-received/
Es decir, si por ejemplo accedes a www.tutiendasuperchula.com/mi-cuenta/add-payment-method/ (y tienes habilitado el pago con tarjeta de crédito) tendrás ahí la pantalla para guardar los datos de la tarjeta y no tener que ponerlos en cada compra.
Sin embargo, esa página como tal no existe en realidad: si vas a Escritorio > Páginas verás que no está, y si pinchas en Editar página en el menú de administración te encontrarás editando la página Mi cuenta. Se trata de un endpoint.
Cómo modificar los endpoints
La lista de endpoints que te daba más arriba es la que viene con WooCommerce por defecto. Sí, están todos en inglés y la verdad no causa muy buena impresión algo como /mi-cuenta/edit-account/.
¿No quedaría mucho mejor (cara al cliente) algo como /mi-cuenta/editar-detalles/? ¿No puedo cambiar eso? Aún diría más: ¿no puedo desactivar las que no me interesen? La respuesta a ambas preguntas es, por supuesto, que sí.
Y seguro que has visto las opciones miles de veces, pero no las has tocado por no saber para qué servían y/o por miedo a romper algo. De hecho, están bien a la vista. Las opciones para cambiar los endpoints de Mi cuenta están en WooCommerce > Ajustes > Cuentas:
Mientras que los endpoints relativos al checkout están (a ver si lo adivinas) en WooCommerce > Ajustes > Finalizar compra:
No hay peligro en cambiarlos. Es más, si quieres que alguno de ellos no esté disponible para los clientes basta con borrarlo y dejar el campo en blanco. Eso sí, no borres los vitales, como el de pagar, si no quieres quedarte sin ventas. 🙂
Modificar el contenido de los endpoints
Y de esta forma llegamos al asunto escabroso que trae de cabeza a muchos usuarios e implementadores: ¿qué pasa si quiero modificar el contenido de un endpoint? No se trata de una página real así que ¿cómo lo hago?
¿Cómo puedo hacer para cambiar el mensaje de gracias por su pedido o para insertar el píxel de Facebook en la página de pedido recibido?
Bueno, siempre está la técnica «chapucera» y poco recomendable de modificar manualmente el template (en /wp-content/plugins/woocommerce/templates/, que tiene dos inconvenientes:
- O se pierden los cambios cada vez que actualices WooCommerce
- o pasas el template modificado a una ruta dentro de tu plantilla para que no se actualice, con lo que no te beneficias de los sucesivos cambios y mejoras en el código de WooCommerce
Afortunadamente WooCommerce (al igual que algunos otros plugins y WordPress) ponen a nuestra disposición los hooks para cambiar lo que necesitemos, una especie de «ganchos» en los que colgar nuestro propio código. Pero eso es ya un tema más técnico del que (quizá) hable otro día.
Hola amigo necesito modificar el siguiente texto que sale en el panel de mi cuenta, puedes ayudarme «Desde el escritorio de tu cuenta puedes ver tus pedidos recientes, gestionar tus direcciones de facturación y envío y editar tu contraseña y detalles de cuenta.» gracias,
Hola cadr
En este artículo explico cómo puedes cambiar cualquier texto de WordPress
Un saludo.
muchas gracias mi hermano !!!
Buenos dias, excelente toda la información que hay en tu página y muy agradecido por ello. Te quisiera hacer una consulta…en mi sitio tendre a la venta unos ebook (utilizo woocommerces y EditionGuard), cuando realizo la compra de los libros ya en la parte de finalizar compra (finalizar-compra/order-received/) me aparece el link de descarga del libro en la descripción del producto. Como hago para que no me aparezca el link ya que se deberia chequear el pago del mismo para poder terminar el proceso y que se le envie el mail al comprador con el link de descarga. Muchas gracias por la ayuda. Saludos
Hola José Manuel
Gracias por tu comentario. WooCommerce sólo mostrará el enlace de descarga si el pago se ha completado correctamente. En cualquier caso, puedes evitar que ese enlace se muestre en la thank you page editando el template correspondiente y eliminando esa parte. Tendrás que cuidar de traspasar el template al directorio de tu theme para que no se pierdan los cambios con las actualizaciones de WooCommerce.
Un saludo.
Muchas gracias Enrique por tu ayuda.
Saludos y abrazo
Yo lo que quiero cambiar es justamente ‘mi cuenta’ o ‘tienda’ y ponerlo en inglés. Y no lo traduce automáticamente al cambiar el idioma de wordpress, se traduce todo menos las cabeceras.
Hola Rodolfo
Échale un vistazo a este artículo, creo que puede serte útil.
Un saludo.
Tengo un problema con los enpoints, y es que cuando pincho en cualquiera de las opciones de la cuenta se cambia la url pero la página sigue siendo la misma. Por ejemplo si estoy en «my-acccount» y pincho en en editar la cuenta sigo en la misma cuenta aunque la url sea «my-account/edit-account». He intentado reinstalar Woocoomerce pero sigue persistiendo el problema.
¿Cómo puedo solucionar el problema? Espero su respuesta.
Muchas gracias.
Hola Felipe
Comienza desactivando todos los plugins excepto WooCommerce, quizá alguno de ellos «la esté liando» con los endpoints. Tras desactivarlos ve a Ajustes > Enlaces permanentes y pulsa en Guardar (no es necesario que hagas ningún cambio, sólo guardar) y prueba. Si entonces va bien tendrás que ir activando plugins uno a uno a ver cuál es el responsable.
Un saludo.
Buenas tardes,
A ver si me puedes ayudar, tengo que editar el boton de «PAGO CON TARJETA» en la pagina de ordey-pay. Ya que me queda muy diferente al de cancelar pedido. Como edito ese boton ?
Muchas gracias
Hola Lucas
Puedes cambiar el aspecto del botón con CSS.
Un saludo.
Hola Lucas, tengo el mismo problema que tú, puedes indicarme como lo hiciste, ando un poco pez, el lugar de CSS es en Apariencia/Personalizar/CSS personalizado??? y que código pusiste, gracias
Tema resuelto, si alguien más tiene este problema el código CSS en Apariencia/Personalizar/CSS personalizado es:
input#submit_redsys_payment_form {
background: #84BE38 !important;
margin-right: 2em;
}
Donde pone #84BE38 poner el color que cada uno quiera.
Un saludo
Hola Enrique, ante todo, muchas gracias por tu aportación. Tengo un problema en mi web con este tema desde siempre, y es que al intentar cambiar los endpoints (que siguen en inglés) al español o cualquier otro e ir a mi web y hacer clic en el enlace que corresponde a esa variable me salta un 404. Supongo que será algo referente al tema…¿qué crees que puede ser?
Hola Lidia
Tras cambiar los endpoints debes ir a Ajustes > Enlaces permanentes y pulsar en guardar (no es necesario ahí hacer ningún cambio de ajustes, sólo guardar).
Un saludo
Hola amigo como estas te comento estoy usando el plugin wcvendors para poder crear multiples vendedores podria hacer un api que me devuelva las distintas tiendas.? estoy haciendo una app movil que jala los datos de mi pagina y necesito mostrar las tiendas en la pagina de inicio como podria hacerlo
Muy buenas. Querría consultarte. ¿Se puede sustituir los nombres de MiCuenta, Pedidos,…por imágenes?
Saludos.
Hola Juan Carlos
Requiere programación a medida, pero se podría hacer. Aunque no es recomendable ya que podría afectar a la visualización en dispositivos móviles. Aparte, cualquier cambio que no vaya dirigido a aumentar ventas/conversiones o a una mejor experiencia de usuario se debería descartar.
Un saludo
hola buen día, estoy intentando modificar mi pagina finalizar-compra/order-received
Cuando cree mi tienda, lo logré hacer ( me interesaba solamente agregar texto con pasos a seguir como informacion apra el cliente) pero llevo horas encontrando donde modificarlo ( olvide como lo hice la primera vez) existe alguna ruta o algo así?
Hola ad
Esos templates los tienes wp-content/plugins/woocommerce/templates/checkout/, aunque cualquier cambio que realices en cualquiera de ellos se perderá al actualizar WooCommerce. La forma correcta de modificar eso, sin perder los cambios y permitiendo que estos templates se actualicen es mediante hooks (requiere programación). Alternativamente, replicar la ruta en tu tema hijo y copiar ahí el template modificado. No se perderán los cambios pero tampoco se aplicarán actualizaciones, por lo que podría quedar desactualizado.
Un saludo
Hola Enrique,
Muy interesante el artículo. En mi caso, el problema viene con que Woocomerce, en pedidos en ES, permite perfectamente completar el pago y salta la página /oder-received/ pero en el resto de idiomas no, como si la página no existiera, por lo que no se puede completar el pago en ningún otro idioma.
¿Cuál crees que podría ser el problema? La traducción de los endpoints?
Mil gracias.
Hola Aritz
Tiene pinta de ser por el plugin multilingüe que estés usando, solicita ayuda a su soporte.
Un saludo