La guía definitiva para descubrir qué tema y qué complementos usan un sitio de WordPress

IMitation Learning es una excelente manera de construir su propio sitio web de WordPress, ¡esta es la belleza de las comunidades de desarrollo, después de todo! Sin embargo, casi ningún sitio web viene con orientación sobre el tema y los complementos que los hacen funcionar. Después de encontrar un sitio de WordPress que desea emular, puede descubrir fácilmente qué tema y complementos están utilizando. Conocer esta información puede ayudarlo a reproducir cualquier elemento o características de diseño especiales que pueda tener dificultades para producir por su cuenta. Por supuesto, dependerá de usted dominar las herramientas que encuentre, pero saber dónde buscar es el primer paso.
En este artículo, descubrirá por qué es tan valioso descubrir el tema y los complementos que usa un sitio de WordPress, así como tres opciones para ejecutar una misión de espionaje completa. ¡Vamos a empezar! ¿Por qué le gustaría descubrir qué tema y complementos usan un sitio de WordPress que entiende cómo otro sitio de WordPress implementa cualquier característica puede ahorrarle tiempo y frustración? Por ejemplo, su cliente le envió un ejemplo de un sitio que ama, con una característica compleja que quiere en su propio sitio. Aunque confía en que se puede lograr, construir una función similar desde cero tomará muchas horas. Por supuesto, es difícil proporcionar una cita adecuada para un trabajo sobre el que no está seguro. Además, no es deseable trabajar desde cero.
En su lugar, puede descubrir cómo el sitio de ejemplo implementa la funcionalidad de “acumular” el tema y los complementos que usa un sitio. En resumen, puede evitar reinventar la rueda y puede ayudarlo a poner una base similar en el sitio web de su cliente. En general, poder hacer este tipo de investigación lo ayudará en su desarrollo diario. También lo ayudará a combatir la parálisis de la decisión, a medida que comienza a profundizar en las configuraciones de otros sitios, encontrará que muchos usan las mismas herramientas debajo del capó. Ayudará a fortalecer el viejo adagio: “No es lo que tienes, sino lo que haces con él”. Cómo descubrir qué tema y complementos usan un sitio de WordPress (con 3 métodos) ahora sabes por qué es posible que quieras investigar Los temas y complementos de otros sitios web de WordPress, ¡es hora de aprender cómo! Aquí hay tres opciones, comenzando con las más simples. Método 1: Detectar automáticamente temas y complementos utilizando herramientas en línea Esta es una de las formas más livianas de comenzar a buscar y no requiere ninguna configuración de su parte.
¿Qué tema de WordPress es este? Es una solución popular para acceder al tema y los complementos de un sitio. Este método detecta automáticamente la información básica sobre el tema y el complemento para usted y funciona verificando su sitio de destino para obtener archivos y scripts únicos de arados o temas populares, luego refiriéndose con sus hallazgos. Sin embargo, vale la pena señalar que hay limitaciones. Una herramienta automatizada puede perder algunas pistas que podría determinar fácilmente como hombre.

Sin embargo, para una búsqueda rápida para detectar complementos importantes, la solución automática es un buen lugar para comenzar. Estos son los mejores sitios que recomendamos: ¿Qué tema de WordPress es este?
WordPress Checker de complemento.
Detector de temas de WordPress.
Cada uno de estos funciona de manera similar, por lo que su elección se reducirá a la que prefiere usar: ¿usaremos qué tema de WordPress es este? para nuestro ejemplo. Para comenzar, primero ingrese la URL del sitio que desea inspeccionar y hacer clic en Buscar, enviar o icono equivalente …
… ¡Y eso es! Se le dará una lista de resultados, y luego puede explorar cada tema y complemento para averiguar si es adecuado para usted:
Este método está bien para búsquedas únicas, pero para aquellos que a menudo necesitan darse cuenta de la funcionalidad de otros sitios, hay una solución aún mejor. Opción 2: Instale una extensión de navegador dedicada Otra forma de detectar automáticamente complementos y los temas del sitio es el uso de una extensión del navegador. Son simples y rápidos, pero no necesita instalar el software adicional en el navegador:

Las extensiones del navegador son programas pequeños que agregan funciones adicionales a su navegador. En otras palabras, le permite recopilar información básica con un clic en un botón, mientras se ve el sitio de destino.

En resumen, si verifica con frecuencia los sitios sus complementos y temas, una extensión del navegador podría ser la opción correcta para usted. Aquí hay algunos de ustedes para elegir:

WordPress Theme Detective (Chrome) WP Sniffer (Chrome)
WordPress -Temtem Detector y complementos (Chrome)
Wapppalyzer (Mozilla)
Al igual que con las soluciones en línea, todas las extensiones del navegador funcionan de manera similar una vez que las haya instalado. Primero, visite el sitio que desea inspeccionar en su navegador. Luego, haga clic en el icono de extensión del navegador respectivo para ejecutar la inspección. Después de unos momentos, deberías ver los resultados:
Sin embargo, como probablemente comprenda, tanto las extensiones en línea como el navegador tienen un cierto grado de error. Para el mejor espionaje del sitio de WordPress, deberá investigar el código fuente. Opción 3: profundice en el código fuente del código fuente del sitio (en este contexto) es el script que hace que un sitio funcione en el navegador-HTML, CSS y JavaScript (en el último caso, cada vez más). Puede verlo en el navegador haciendo clic en la página web de destino y eligiendo la fuente de la página o inspeccionar el elemento. Esto abrirá una nueva pestaña que le muestra el código fuente de la página que ve:
Poder revisar el código fuente solo es a menudo útil, porque los sitios automáticos y las extensiones del navegador se limitan a situaciones para las que están programados. Además, casi siempre puede obtener información adicional dando un solo aspecto. Esto es especialmente útil cuando un sitio usa complementos menos conocidos, una solución autodevarrada o incluso usa scripts personalizados para lograr nuevos resultados con un complemento existente. Está claro que los desarrolladores ganarán más kilometraje de este paso que nadie, porque necesitará una comprensión básica del código del cliente, como HTML, CSS y JavaScript. Para seguir, tendrá que estar al menos familiarizado con estos idiomas. También usaremos las herramientas DevTools de Chrome como ejemplo aquí, pero otros navegadores a menudo tienen características similares, como páginas de Firefox o inspector web de Safari. Para comenzar, visite el sitio web objetivo en su navegador, haga clic derecho en cualquier lugar de la página y elija Inspeccionar:
Esto abrirá un código fuente y otra información y notará que es muy similar al código fuente que hemos visto anteriormente:


Hay tres técnicas que podemos usar para explorar la página y descubrir cómo se construyó el sitio. Lo primero que debe entender es cómo WordPress estructura temas y complementos. Por lo general, se almacenan en una carpeta llamada WP-Content, en los temas y carpetas de los complementos respectivos. Traducido al código fuente, esto significa que probablemente encontrará archivos y scripts con el siguiente tipo de estructura:

/wp-content/themes/theme-name/path/to/script.js para complementos, probablemente verá /wp-content/plugins/plogin-name/path/to/script.js.Por supuesto, la ruta/a/script.js desde el final variará según el tema o el complemento.Desde aquí, puede usar el nombre del tema respectivo o el nombre del complemento en esas formas de encontrar el tema o el complemento original.Por ejemplo, los temas de WordPress contienen datos de diseño en style.css y significa que puede cargar /wp-content/theme/theme-name/style.css en el navegador.Esto devolverá información valiosa sobre el tema para buscar que nuestro sitio se ejecute en un tema personalizado alimentado por Genesis Framework, por ejemplo.Para encontrar estos scripts en los sitios básicos, puede encontrarlos recopilados en la pestaña Fuentes (o similares): si el sitio que inspecciona está fuertemente personalizado (o usa un CDN), es posible que necesite usar la función de búsqueda de los elementos de pestaña :
Para una investigación más profunda de los complementos, comenzará a notar ciertos modelos y resultados de diferentes tipos de complementos. Si encuentra algo que parece interesante pero no está seguro, la búsqueda de Google de un script lo ayudará. Deberá buscar específicamente IDS y clases únicas en HTML y cualquier comentario insertado en el código. Para darle algunos ejemplos, las clases de Convertkit e ID a menudo comienzan o incluyen CK_, mientras que MailChimp utiliza MC_. Muchos complementos que crean sus propios elementos HTML siguen convenciones similares, lo que los hace fáciles de identificar. También tiene complementos que cambian la página completa, como WP Super Cache. Muchos de estos usan comentarios HTML como préstamos detrás de escena, una especie de firma que también le da pistas si algo no va bien. Por ejemplo, aquí hay un ejemplo de lo que WP Super Cache inserta <! Si necesita comprender cómo funciona realmente un complemento (en lugar de conocer su nombre), la capacidad de identificar su código lo ayudará a encontrar las piezas correctas para responder sus efectos en sus propios proyectos. La conclusión puede descubrir qué tema y qué complementos usan un sitio de WordPress puede ahorrarle tiempo y problemas cuando trabaja en sus propios proyectos. En otras palabras, puede proporcionar un punto de partida para crear características para desarrollar el sitio de su cliente en esta pieza, discutimos tres opciones para descubrir el tema y los complementos que usa un sitio de WordPress: herramientas automáticas que proporcionan datos superficiales.

Extensiones del navegador, para investigadores frecuentes. Métodos manuales que le permiten obtener información mucho más valiosa.

¿Cuáles son sus herramientas favoritas para encontrar complementos y temas instalados en sitios de WordPress?¡Comparta su conocimiento en la sección de comentarios a continuación!Créditos de imagen: Drew Hays.