Scripts Organizer, de los desarrolladores detrás de dpPlugins, es un componente para WordPress que nos va a ayudar a programar, organizar y gestionar facilmente HTML, CSS, JS y PHP. En esta nota vamos a explorar sus bondades mencionando los avances que trae su última versión 3.3.
Ventajas
Scripts Organizer sale de fábrica con una colección de componentes que trabajan en conjunto para ayudarnos a ganar tiempo. Sus interruptores on/off típicos nos permiten activar y desactivar scipts a gusto. Si nos olvidamos por un momento de su capacidad de programar el entorno JS/PHP, el plugin es un excelente administrador de Code Snippets (léase fragmentos de código).
Para el ejemplo hemos creado un script que sólo se ejecutará los días sábados y domingos (“ofertas de fin de semana”). Si bien la programación lo activará y desactivará de acuerdo a días y horarios establecidos por nosotros, también podemos hacerlo manualmente.
Por supuesto, la ventaja más grande de este plugin es justamente la posibilidad que nos brinda de programar con precisión la ejecución de un JS o PHP según nuestro negocio/servicio/necesidad/eventualidad.
Como podemos ver en la captura lateral, el panel de creación de código es tan sencillo como poderoso. Podemos elegir condiciones para su activación, en dónde se incorporará el código (encabezado, pie de página, por shortcode), en qué tipo de contenido (Entradas, Páginas, Taxonomías, etc.), los días y horarios en que estará activo, etc.
Se nos permite establecer la visibilidad, insertar elementos dinámicamente, llamar a scripts de seguimiento de terceros durante varias campañas y aún más alternativas. Esto también cuida la velocidad de nuestra web dado que los scripts se llamarán únicamente cuando se los necesita. El resto del tiempo, sencillamente el código no estará en nuestra web.
También es posible insertar scripts PHP, útil cuando tenemos varios fragmentos. Al momento de escribir código PHP, se nos ofrece un “modo seguro” que impedirá que el script se ejecute si por algún conflicto o incompatibilidad rompe nuestro sitio web. Esto sin dudas tiene el poder de ahorrarnos muchísimo tiempo para cuando los problemas asoman y el sitio queda offline.
El editor de código es una interfaz familiar que facilita la visualización, edición y adición de código.
Administrador de Scripts
Se agradece la característica adicional llamada “Scripts Manager”. Mediante ésta es posible insertar código desde un servicio CDN (por ejemplo, CloudFlare) o subir nuestros propios archivos CSS y JavaScript. Esta funcionalidad interactúa directamente con el administrador de scripts estándar, implicando que podremos programar y aplicar reglas condicionales a archivos de terceros desde una CDN.
Para activar Scripts Manager debemos tildarlo aquí:
Tras guardar los cambios, podremos encontrar la funcionalidad “Scripts manager” dentro del menú de herramientas del componente:
Novedades de la última versión Scripts Organizer 3.3
Mapas de origen SCSS
Si usamos SCSS parciales, ahora podremos gozar de la nueva funcionalidad para crear mapas de origen SCSS. Recordemos que SCSS son los archivos CSS que contienen código pequeño y específico para un estilo particular. Estos fragmentos están separados de la hoja de estilos principal a fin de administrar mejor el código CSS. ¿Por qué? Porque estos archivos se pueden usar en otro archivo SCSS evitando tener que escribir los mismos estilos nuevamente (se emplea @use at-rule o @forward at-rule con ambos incluyendo la hoja de estilos con diferente visibilidad).
SASS Partials proporciona una excelente manera de organizar nuestro código CSS en diferentes archivos para usarlos sólo donde sea necesario.
La creación de mapas de origen nos permite visualizar de dónde proviene el código parcial. Antes obteníamos solamente un enlace a 4-header.css dentro de las herramientas de desarrollo. Pero al abrir el bloque de código con “ID 4” no teníamos certeza del origen del código parcial.
Ahora, una vez que la función esté habilitada (captura inferior: Scripts Organizer -> Features), nos mostrará el nombre parcial de SCSS en lugar del nombre del bloque de código.
Podemos reconocer fácilmente el nombre parcial de SCSS gracias a su prefijo “_”.
Nueva funcionalidad en la Previsualización
Al presionar el botón de inicio, la URL de la página de inicio de nuestra web se agregará automáticamente y se enviará una solicitud. Ya no es necesario que copiemos, peguemos y enviemos la URL.
HTML, CSS, SCSS y JS sólo dentro del área de administración
Significa que ahora podemos cargar HTML, CSS, SCSS y JS dentro del Escritorio de WP sin que estos scripts sean visibles para los usuarios front-end. Podemos personalizarlos y volverlos de “etiqueta blanca” sin necesidad de instalar ningún otro plugin de terceros.
Antes, esto podía lograrse sólo para PHP, por lo que debíamos codificar CSS o JS en línea. La experiencia era tediosa dado que carecíamos de la funcionalidad Autocompletar.
Conclusiones
Hemos mencionado todas las principales características de Scripts Organizer a la fecha. Como ocurre con todos los componentes que recomendamos en Duplika, éste también es desarrollado continuamente para mejorarlo, por lo que se actualiza a cada rato.
Es una herramienta que nos ayuda a agregar scripts de múltiples lenguajes a nuestro WordPress con facilidad, control, y hasta de manera programada. Las condiciones de esta programación son finas y flexibles, abarcando cualquier escenario o dificultad.
Su valor de USD59 nos permite emplearlo ilimitadamente en el tiempo y para un número infinito de sitios.
Scripts Organizer está incluido gratuitamente en nuestro servicio de WordPress Administrado.
Deja un comentario