Students Save 30%! Learn & create with unlimited courses & creative assets Students Save 30%! Save Now
Advertisement
  1. Code
  2. OpenCart
Code

De principiante a avanzado en OpenCart: desarrollo de módulos

by
Difficulty:IntermediateLength:MediumLanguages:
This post is part of a series called From Beginner To Advanced in OpenCart.
From Beginner To Advanced in OpenCart: Understanding MVC
From Beginner to Advanced in OpenCart: More Module Development

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

En los artículos anteriores, examinamos la arquitectura MVC y creamos nuestro primer controlador, modelo y vista en la aplicación de OpenCart. Hicimos esto con el fin de ayudar a tener una mejor comprensión del núcleo de la aplicación.

Para dar un paso más, vamos a ver como crear un módulo personalizado para OpenCart.

¿Qué son los módulos de OpenCart?

Los modulos de OpenCart son análogos a los add-ons (Complementos), plugins o extensiones en otro CMS (Content Managment Systems) Sistema de Gestión de Contenidos. Es a través de módulos que OpenCart nos da la capacidad para extender su funcionalidad sin tener que editar archivos de la aplicación.

Al igual que con otros CMS, generalmente se considera que es una buena práctica para ampliar la funcionalidad de la aplicación principal a través de las API proporcionadas y OpenCart no es diferente. Los Módulos nos permiten introducir, quitar o modificar funcionalidad de la aplicación principal que se hace de una manera compartimentada y mantenible.

Adicionalmente, OpenCart tiene su propio Mercado de Extensiones donde un gran número de extensiones ya están disponibles.

Nuestro Primer Módulo

Con el fin de aclimatarse con sistema de módulos de OpenCart, podemos escribir el obligatorio módulo "Hello World" (Hola Mundo). Esto tomará entrada de datos del dashboard (Tablero) y lo mostrará en la interface de usuario del sitio.

Tenga en cuenta que OpenCart tiene un número de módulos preconstruidos. Como tal, vamos a tratar de aprovechar los que sea posible cuando trabajamos en el nuestro. Para comenzar, haga lo siguiente:

  1. Crear un Controlador para la ruta de Admin: admin/controller/module/helloworld.php .
  2. Crear un archivo de Idioma para la ruta de Admin: admin/language/english/module/helloworld.php .
  3. Crear una Vista para la ruta de Admin: admin/view/template/module/helloworld.tpl .

1. El archivo de Idioma

Como se discutió en nuestros artículos anteriores, el archivo de idioma contiene el texto estático que debe ser mostrado en nuestro archivo de la vista. Para helloworld.php archivo de idioma, las siguientes variables contienen los posibles campos de textos que requerimos mostrar en nuestro módulo:

1. El Controlador

Abre el archivo del controlador "Hello World" que acabamos de crear y agrega la clase class ControllerModuleHelloworld extends Controller {} sigue la Convention de Nobre de Clases. Después, coloca el código siguiente dentro de la clase.

Paso 1: La Función por Defecto

Paso 2: Método de Validación

Como hemos tratado de validar los datos a salvo en la función por defecto. Así que aquí viene el método de validación

Ahora guarda el archivo y habrás terminado con el Controlador de Admin de nuestro Módulo Hello World

3. Archivo de la Vista

Como se ha hecho previamente en el controlador, tiene que crear algo de HTML para la vista. Por eso, vamos a hacer lo siguiente:

Paso 1: Construir algunos controles básicos

Un form (Formulario) es un elemento que contendró elementos como input Elemento de Entrada de texto, un textarea (Area de Texto), y botones para guardar o cancelar las entradas de datos.

To create a form like this, review the code below:

Para crear un formulario así, revisa el siguiente código:

Paso 2: Agregando la Lista de Tablas

Bajo form, una lista de table aparecerá en el que podemos establecer la posición del módulo y la página donde el módulo será mostrado.

Paso 3: Agregar algo de JavaScript

Como puedes ver en el paso anterior, hay un botón "Add Module" (Agregar Módulo). Específico, tenemos: <a onclick="addModule();" class="button"><?php echo $button_add_module; ?></a> donde el usuario puede agregar múltiples filas para mostrar la salida del módulo en diferentes diseños sobre posiciones diferentes.

Por eso, tenemos que escribir algo de código JavaScript que se anexará una fila a la lista de la tabla. Esto mejorará la interfaz de usuario para los que utilicen nuestro módulo:

Paso 4: Agregando el Pie de Página

La última cosa, necesitamos un hijo del pie de página al final de la vista

A este punto, hemos terminado nuestro primer módulo Hello World (Hola Mundo). Ahora es tiempo de chequear si nuestro módulo trabaja o no.

Para esto, inicia sección y ve a la página Extensions > Modules (Extensiones y Módulos) donde verás una lista de los módulos del Sistema de OpenCart. Allí también estará "Hello World" listado con estado desintalado ("Unistalled"), clic en "Install" (Instalar) y trata de editar el módulo y verás una pantalla como esta:

Puedes entrar algún valor aleatoreo e intenta guardarlo. Ahora intenta editar el módulo de nuevo y verás tus datos entrados por defecto

Conclusión

En este artículo, hemos intentado construir un Módulo básico de OpenCart usando MVC. Es fácil manipular Módulos de OpenCart si estás familiarizado con los conceptos principales de MVC. Este artículo te da la idea básica de como desarrollar un módulo simple siguiendo algunos simples pasos.

En nuestro próximo artículo, vamos a trabajar con la interfaz de ususario y trataremos de extenderla para la tienda de la interfaz. Por favor déjenos sus comentarios en la sección de comentarios.

¡Sé el primero en conocer las nuevas traducciones–sigue @tutsplus_es en Twitter!

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.