1. Web Design
  2. WordPress
  3. WordPress Themes

Vendiendo temas de WordPress en ThemeForest: Qué incluir en el paquete de producción

Como autor de un tema de WordPress, hay numerosas formas en que puedes organizar tu paquete de producción, pero los revisores de ThemeForest observan rigurosamente los requisitos de los temas enviados y las recomendaciones no escritas. En este artículo, explicaré cómo preparar tu paquete demo de producción; qué debes incluir y qué debes evitar.
Scroll to top

Spanish (Español) translation by Carlos (you can also view the original English article)

Como autor de un tema de WordPress, hay numerosas  formas en que puedes organizar tu paquete de producción, pero los revisores de ThemeForest observan rigurosamente los requisitos de los temas enviados y las recomendaciones no escritas. En este artículo, explicaré cómo preparar tu paquete demo de producción; qué debes incluir y qué debes evitar.

Requisitos para enviar un tema de WordPress

Siéntete libre de navegar por los amplios requisitos para el envío de temas, pero no hallarás descripciones de lo que debes poner exactamente en el paquete de producción de tu tema. En cambio, vamos a obtener la información que necesitamos del panel de subida de elementos de ThemeForest.

ThemeForest item upload dashboardThemeForest item upload dashboardThemeForest item upload dashboard

Selecciona WordPress en el menú desplegable de categorías; serás llevado a una IU de subida. Omite el Nombre y Descripción por ahora, y dirije tu atención al panel Archivos.

En primer lugar, se te solicitará el archivo de miniatura de 80x80px. Puede ser PNG o JPG, depende ti, pero yo prefiero el formato PNG.

A continuación va la imagen de Vista previa del tema. Aquí debes tener mucho cuidado con el tamaño y el nombre de los archivos. Esta imagen será visible en la página del producto y en la página de resultados de búsqueda. Hazlo exactamente de 590x300 píxeles y nómbralo de la siguiente forma:  01_<nombredelarchivo>.jpg. Si quieres incluir más imágenes para vista previa, créalas con la misma relación de aspecto que la imagen de vista previa principal, asegúrate de que tus archivos tengan un máximo de 900px tanto en ancho como en alto. Y el nombre debe ser similar al primer archivo 02_<nombredelarchivo>.jpg,03_<monbredelarchivo>.jpg. Tus archivos de vista previa deben añadirse a un archivo comprimido zip separado, incluso si solo tienes un archivo de vista previa. Nombra al archivo de vista previa como preview.zip.

La sección siguiente es para el archivo principal(es). Aquí deberás incluir todos los archivos necesarios para el usuario final, excluyendo la miniatura y los archivos de vista previa.

Y por último el archivo zip del tema. Este es el archivo que los usuarios pueden subir a WordPress para comenzar a usar tu tema.

Mi enfoque personal

En términos generales, lo que hemos cubierto hasta el momento es todo lo que encontrarás en las fuentes oficiales sobre el empaquetado de archivos de producción de temas; el resto se reduce a las mejores prácticas y recomendaciones. Compartiré mi propio enfoque que puedes extender; aporta tus propias ideas en los comentarios.

Utilizo una carpeta de trabajo con todos mis proyectos. Primero creo una carpeta separada Uploads. Si creas varios tipos de productos para múltiples plataformas (por ejemplo, plugins y temas para WordPress, Joomla, Drupal, etc.) crea carpetas separadas en la carpeta Upload para cada plataforma y para cada tipo de proyecto, como por ejemplo:

1
Uploads
2
    ├── WordPress
3
        ├── Themes
4
        └── Plugins
5
    └── Drupal
6
        ├── Themes
7
        └── Plugins

Luego crea una carpeta en dentro de la carpeta Uploads/WordPress/Themes con el nombre del tema y el prefijo _pack, de esta forma: themename_pack. Dentro de esa carpeta crea varias subcarpetas:

1
Uploads
2
    └── WordPress
3
        └── Themes
4
            └── themename_pack
5
                ├── Demos
6
                ├── Snippets
7
                ├── Additional
8
                ├── Plugins
9
                └── Final-files

Hay un par de archivos y carpetas más que incluiremos en la carpeta themename_pack, pero por ahora veamos las carpetas enumeradas anteriormente.

Demostraciones

No importa si tu tema tiene múltiples demos o solo una demostración, necesitas incluir tus archivos de demostración en tu paquete de descarga, incluso si tienes una función de "importación de demostración con un solo clic", o bloques de plantillas listos para usar directamente desde tu tema. Habrá situaciones en las que los usuarios necesitarán una importación de demostración manual.

Si tu tema tiene múltiples Demos, crea cada carpeta de demostración dentro de la carpeta principal de Demos de forma separada. Incluye todos los archivos necesarios con cada demostración. Por ejemplo, yo incluyo:

  • archivos XML separados: all.xml, posts.xml, pages.xml, etc.
  • widgets.wie: el archivo de importación de widgets generado con el plugin Widget Importer & Exporter.
  • options.json: el archivo de importación de la configuración del panel de opciones del tema. Yo utilizo reduxframework para crear el panel de opciones de tema; si usas cualquier otro panel de opciones, debe tener algún tipo de funcionalidad de importación / exportación.
  • slider1/2/3.zip: el archivo ZIP del slider revolution. Yo uso el slider revolution para crear diapositivas para mis temas, por lo que incluyo todos los sliders que creé con el tema en las demostraciones.

Fragmentos

Todos los autores de temas tienen sus propios trucos y accesos directos para que sea más fácil y productivo para los clientes utilizar sus temas. Por ejemplo, a veces un usuario tendrá que habilitar el renderizado en el widget de texto, o habilitar la carga de SVG para usar una fuente de icono personalizada o un archivo de logotipo SVG, o necesitarán hacer compatibles los videos HTML5 entre navegadores, todas estas tareas se puede hacer con bloques de código pequeños listos para ser utilizados o acciones y filtros de WordPress. Incluí un archivo TXT para cada " truco útil" en la carpeta de snippets, con instrucciones en el archivo de ayuda.

Adicional

Aquí puedes adjuntar todos los recursos adicionales que quieras incluir con tu tema. Pueden ser fuentes de iconos específicos del tema, o fotos y videos que hayas comprado para la demostración del tema y que tengan la licencia adecuada para incluir en tu producto comercial. No estás limitado aquí, siempre que no incumplas los requisitos para el envío de temas relacionados con la licencia de archivos.

Plugins

Si tu tema incluye complementos premium y tienes lo que se conoce como "Licencia de utilización en stock", debes adjuntar aquí los archivos ZIP del plugin. Por ejemplo, habitualmente yo incorporo Slider Revolution y WPBakery Page Builder.

Archivos y carpetas adicionales

Habiendo cubierto los fundamentos, echemos un vistazo a qué más se necesita incluir. En la carpeta themename_pack añade lo siguiente:

  • Carpeta principal del tema con todos los archivos
  • Carpeta principla del child theme con todos los archivos
  • Manual en formato PDF o HTML
  • Registro de cambios (Changelog.txt)

Child Theme

Los requisitos de envío de ThemeForest no incluyen adjuntar un child theme, pero es muy recomendable. Si incluyes un child theme, debe ser codificado lógicamente con los estándares requeridos. Por ejemplo, debe nombrarse tutema-child, los archivos adjuntos deben incluir al menos un archivo functions.php, un screenshot.png y el archivo style.css. Aún si tu child theme está vacío, estos archivos son suficientes para ayudar a tus compradores a empezar.

Si tu chid theme extiende el tema principal, el archivo functions.php debería incluir al menos lo siguiente:

1
<?php
2
function yourthemeprefix_yourthemename_child_enqueue_styles() {
3
   $parent_style = 'yourthemeprefix-yourthemename-parent-style';
4
   wp_enqueue_style( $parent_style, get_parent_theme_file_uri('/style.css'));
5
}
6
7
add_action( 'wp_enqueue_scripts', 'yourthemeprefix_yourthemename_child_enqueue_styles' );
8
?>

Y el archivo style.css debe incluir al menos estos detalles en el encabezado:

1
/*

2
Theme Name:     Yourthemename Child

3
Theme URI:      https://yourtheme.com

4
Description:    Child theme description here

5
Author:         Author name here

6
Author URI:     https://authoruri.com

7
Version:        1.0

8
Template:       yourthemename

9
*/
10
11
/* =Theme customization starts here

12


13
-------------------------------------------------------------- */

Manual

A los autores de temas ya no se les obliga que incluyan documentación offline en el tema; se recomienda que ofrezcas tu propia documentación en línea, hazla de forma  accesible y coloca un enlace en la descripción del artículo, También puedes incluir documentación offline si lo prefieres. Esta es una cuestión de preferencia en lugar de una regla estricta, yo prefiero incluir un manual en PDF.

Changelog.txt

Los archivos con el registro de los cambios son una forma importante de hacer que el desarrollo de tu tema sea totalmente transparente. Haz una lista de todos tus cambios y correcciones de errores en este documento. Organízala con versiones y fechas, de esta manera:

1
08,07,2018 - Version 1.1.5
2
3
- Updated packed Visual Composer
4
- Corrected minor styling issues
5
- Fixed Sticky header jump on mobile devices

Descartado (no producción)

Esta es una carpeta más que incluyo en mi propio paquete de temas (aunque no en la versión de producción, porque es solamente para mis ojos). Recomiendo recopilar todos los problemas de rechazo que recibe tu tema después del envío. Recabar un historial de rechazo para cada tema es una buena práctica y te ayudará a mejorar todos los proyectos futuros.

La estructura final de carpetas

Echemos un vistazo final a los archivos y carpetas que hemos incluido en el themefolder_pack:

1
Uploads
2
    └── WordPress
3
        └── Themes
4
            └── themename_pack
5
                ├── Demos
6
                ├── Snippets
7
                ├── Additional
8
                ├── Plugins
9
                ├── Reject
10
                ├── Themefolder
11
                ├── Child themefolder
12
                ├── Manual pdf, html
13
                ├── Changelog.txt
14
                └── Final-files

Archivos finales

Es hora de crear los archivos finales para subir a ThemeForest.

  • Selecciona la carpeta de tu tema y crea un archivo ZIP con el mismo nombre.
  • Selecciona todas las carpetas y archivos, excepto Descartado y Archivos finales, y comprímelos en nombredeltema_pack.zip
  • Copia estos dos archivos zip y muévelos a la carpeta Final-files.
  • Abre la carpeta Final-files y añade una carpeta Preview en ella.
  • Agrega a esto todos los archivos de vista previa que discutimos anteriormente.
  • Crea el archivo preview.zip de esa carpeta.
  • Y también coloca el archivo thumbnail.png / jpg en la carpeta Final-files.
  • Ahora ya tienes todos los archivos necesarios para subir a ThemeForest: tutema.zip, tutema_pack.zip, preview.zip y thumbnail.png/jpg.

Conclusión

En este artículo, incluí una mezcla de recomendaciones y requisitos para enviar los archivos finales de un tema de WordPress a ThemeForest. Es posible que tu tema aún experimente rechazo de alguna manera, pero al incluir todos los archivos necesarios de la manera adecuada, harás que el proceso de revisión sea un poco más fluido.

Si tienes alguna sugerencia o pregunta, siéntete libre de aportar tu comentario. En la siguiente publicación, aprenderemos cómo aprovechar al máximo las demostraciones de tu tema de WordPress.

Y por último, ¡gracias a los revisores de ThemeForest Rich Tabor y Scott Parry por corroborar los datos!