J3.x

Desarrollo de un Componente MVC/Agregar un tipo de menú a la parte del sitio

From Joomla! Documentation

< J3.x:Developing an MVC Component
This page is a translated version of the page J3.x:Developing an MVC Component/Adding a menu type to the site part and the translation is 100% complete.

Other languages:
العربية • ‎English • ‎español • ‎français • ‎Nederlands
Joomla! 
3.x
Tutorial
Desarrollo de un Componente MVC


Esta es una serie multi-artículos de tutoriales sobre cómo desarrollar un Componente Modelo-Vista-Controlador para Joomla! VersiónJoomla 3.x.

Comenzar con la Introducción, y navegar por los artículos de esta serie usando el botón de navegación en la parte inferior o en el cuadro de la derecha (los "Artículos de esta serie").



Nota

  • Puedes seguir los pasos que hay a continuación para agregar un elemento del menú al componente Hello World! o puedes descargar directamente el archivo

Agregar un Elemento del Menú a Hello World

En este artículo vamos a cubrir cómo añadir un elemento del menú a un componente básico de Joomla!. Para este ejemplo vamos a continuar nuestro trabajo con el componente Hello World!.

Hay varias formas de actualizar un componente Joomla!. En este tutorial nos vamos a centrar en la opción 2.

1 Agregar manualmente los archivos en <path_to_joomla>/
2 Actualizar usando el Gestor de Extensiones de Joomla! y el directorio original, no comprimido, utilizado a la instalación de componentes
3 Actualizar usando el Gestor de Extensiones de Joomla! y un Servidor de Actualización

Para agregar un elemento del menú, tendrás que navegar a com_helloworld, que es el directorio original que hemos hecho para nuestro componente. Debes utilizar el directorio actualizado de la estructura del último tutorial. Utilizando tu administrador de archivos preferido, crea o actualiza los siguientes archivos; tanto en crear o actualizar los archivos, agrega el código fuente para cada archivo que se encuentra en Detalles de los Archivos.

1 Crear: default.xml <path_to_com_helloworld/site/views/helloworld/tmpl/default.xml
2 Actualizar: helloworld.xml <path_to_com_helloworld/helloworld.xml

Actualizar el Componente Hello World!

Para actualizar el Componente Hello World! en el sitio web Joomla!, por favor, sigue los mismos pasos que para la instalación original.

Después que el componente se ha actualizado, podremos agregarle un elemento del menú. Esto nos permitirá acceder a nuestro componente desde el menú, en lugar de tener que recordar qué escribir en la barra de direcciones. Lo haremos usando el Administrador de menús de Joomla!.

  • Usando tu navegador web preferido, ve al panel del Administrador de tu sitio Joomla!. La dirección sería <tusitio>/joomla/administrator/index.php. Para este ejemplo vamos a navegar a localhost/joomla/administrator/index.php.
  • Agrega un nuevo elemento del menú haciendo clic en Menú    <menú existente>    Agregar nuevo elemento del menú. Aparecerá una nueva pantalla.
  • En el campo "Título del elemento del menú"', ingresa "¡Hola, mundo!"
  • En el campo "Tipo del elemento del menú", haz clic en el botón "Seleccionar" y elige ¡Hola mundo!    Hola mundo en la pantalla de selección.
  • Has clic en Guardar y cerrar

Ahora deberías poder acceder al componente a través del menú que acaba de crear.

Detalle de los Archivos

site/views/helloworld/tmpl/default.xml

<?xml version="1.0" encoding="utf-8"?>
<metadata>
	<layout title="COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_TITLE">
		<message>COM_HELLOWORLD_HELLOWORLD_VIEW_DEFAULT_DESC</message>
	</layout>
</metadata>

helloworld.xml

<?xml version="1.0" encoding="utf-8"?>
<extension type="component" version="3.0" method="upgrade">

	<name>Hello World!</name>
	<!-- The following elements are optional and free of formatting constraints -->
	<creationDate>January 2018</creationDate>
	<author>John Doe</author>
	<authorEmail>john.doe@example.org</authorEmail>
	<authorUrl>http://www.example.org</authorUrl>
	<copyright>Copyright Info</copyright>
	<license>License Info</license>
	<!--  The version string is recorded in the components table -->
	<version>0.0.3</version>
	<!-- The description is optional and defaults to the name -->
	<description>Description of the Hello World component ...</description>

	<update> <!-- Runs on update; New since J2.5 -->
		<schemas>
			<schemapath type="mysql">sql/updates/mysql</schemapath>
		</schemas>
	</update>

	<!-- Site Main File Copy Section -->
	<!-- Note the folder attribute: This attribute describes the folder
		to copy FROM in the package to install therefore files copied
		in this section are copied from /site/ in the package -->
	<files folder="site">
		<filename>index.html</filename>
		<filename>helloworld.php</filename>
		<filename>controller.php</filename>
		<folder>views</folder>
	</files>

	<administration>
		<!-- Administration Menu Section -->
		<menu link='index.php?option=com_helloworld'>Hello World!</menu>
		<!-- Administration Main File Copy Section -->
		<!-- Note the folder attribute: This attribute describes the folder
			to copy FROM in the package to install therefore files copied
			in this section are copied from /admin/ in the package -->
		<files folder="admin">
			<!-- Admin Main File Copy Section -->
			<filename>index.html</filename>
			<filename>helloworld.php</filename>
			<!-- SQL files section -->
			<folder>sql</folder>
		</files>
	</administration>
</extension>

Explicación Del Código

En caso que seas curioso en cuanto a por qué esto funciona de la manera que lo hace.

default.xml

Nota - Por el momento las cadenas no se traduce en la interfaz del administrador. Veremos en un artículo posterior cómo se lleva a cabo la traducción.

helloworld.xml

<version>0.0.3</version>

Actualiza el número de versión.

Contenidos del componente

En este punto del tutorial, el componente debe contener los siguientes archivos:

1 helloworld.xml este es un archivo XML (manifiesto) que le indica a Joomla! cómo instalar nuestro componente.
2 site/helloworld.php este es el punto de entrada del componente Hello World! en el sitio
3 site/index.html evita que se liste el contenido del directorio del servidor web
4 site/controller.php archivo que representa al controlador
5 site/views/index.html evita que se liste el contenido del directorio del servidor web
6 site/views/helloworld/index.html evita que se liste el contenido del directorio del servidor web
7 site/views/helloworld/view.html.php archivo que representa la vista
8 site/views/helloworld/tmpl/index.html evita que se liste el contenido del directorio del servidor web
9 site/views/helloworld/tmpl/default.php la vista predeterminada
10 site/views/helloworld/tmpl/default.xml archivo que agrega el elemento del menú
11 admin/index.html evita que se liste el contenido del directorio del servidor web
12 admin/helloworld.php este es el punto de entrada del componente Hello World! en el administrador
13 admin/sql/index.html evita que se liste el contenido del directorio del servidor web
14 admin/sql/updates/index.html evita que se liste el contenido del directorio del servidor web
15 admin/sql/updates/mysql/index.html evita que se liste el contenido del directorio del servidor web
16 admin/sql/updates/mysql/0.0.1.sql es un archivo que permite inicializar el esquema de versiones del componente com_helloworld.