Documentación de Magento

1. Creación de una base de datos

En primer lugar, es necesario preparar una nueva base de datos para su tienda de Magento. Puede crear la nueva base de datos utilizando la herramienta de gestión de base de datos desde el panel de control del hosting (normalmente PhpMyAdmin).

Los siguientes datos serán recibidos durante la creación de una base de datos: nombre de la base de datos, nombre de usuario, contraseña y nombre de servidor. Tendrá que guardar estos datos, ya que lo necesitará para su posterior instalación de Magento.

Con la herramienta phpMyAdmin usted será capaz de crear una nueva base de datos en 3 sencillos pasos (vea las siguientes diapositivas):

1. Haga clic en el botón Database en el menú de navegación superior para acceder a la lista de bases de datos.
2. Introduzca el nombre de la base de datos en el campo "Create new database".
3. Haga clic en el botón Create en el lado derecho.

Ahora, su base de datos puede verse en la lista de bases de datos. Haga clic en su nombre para acceder a la base de datos:

También puede ver el video tutorial detallado sobre Cómo crear una base de datos

2. Importar los datos de ejemplo

El paquete de la plantilla de Magento contiene el archivo de datos de ejemplo (dump.sql o dump.gz). Este archivo se encuentra en la carpeta de su plantilla /sources/sample_data. Le permitirá cargar los datos de ejemplo, por lo que su sitio web se verá exactamente igual que en nuestra plantilla de demostración.

Para instalar el archivo dump, siga los siguientes pasos:

1. Inicie sesión en phpMyAdmin y seleccione la base de datos que va a utilizar para Magento Commerce (Fue creada por usted con la ayuda de los pasos indicados anteriormente).
2. Vaya hasta la pestaña "Import" y haga click en el botón "Browse".
3. Busque la carpeta "/sources/sample_data" de la plantilla y seleccione el archivo dump.sql.gz.
4. Haga clic en "GO". El proceso de importación puede tardar unos minutos.

3. Subir y descomprimir

Para empezar a trabajar con Magento Usted necesita subir los ficheros a su servidor de hosting. Se puede hacerlo utilizando el administrador de ficheros de hosting o una aplicación FTP de terceros.

1. Seleccione los ficheros 'unzip.php' y 'fullpackage.zip' y súbalos a su servidor ( ¿Cómo se puede subir ficheros al servidor? )
2. Escriba la ruta de acceso al fichero 'unzip.php' en el servidor (http://su_dominio/unzip.php) en su navegador web.
3. Usted va a obtener la siguiente pantalla:

Img 1. Unzip.php initial screen.

5. En 'Choose your zip file/Elegir fichero zip' seleccione el fichero subido fullpackage.zip.
6. En el campo 'Unzip to/Descomprimir en' escriba el directorio para sus ficheros extraídos.
7. Haga clic en el botón 'Unzip/Descomprimir'.

4. Instalación del motor Magento

Cuando haya terminado con la carga de archivos, usted puede comenzar con la instalación del motor Magento. Abra su navegador y en la barra de direcciones escriba su 'nombre del dominio/ruta de acceso al directorio de Magento'. Usted debe ver la pantalla de bienvenida. Por favor, siga las siguientes instrucciones para instalar Magento.

Paso 1: Asistente de Instalación

Por favor, lea el contrato de licencia y haga clic en la casilla "Estoy de acuerdo con los términos y condiciones anteriores" si está de acuerdo con los términos.

Paso 2: Asistente de Instalación (Localización)

Seleccione la configuración regional, la zona horaria y la moneda por defecto. La opción de configuración regional define el idioma de su tienda de Magento. Si desea cambiar el idioma de la interfaz, es necesario descargar e instalar otras configuraciones regionales de Magento. Todas las opciones se pueden cambiar fácilmente más tarde utilizando el panel de administración de Magento.

Paso 3: Configuración

Aquí es necesario introducir los detalles de la base de datos de la tienda y algunos ajustes iniciales. Conexión con la base de datos – introduzca el nombre del host de la base de datos, el nombre de usuario y la contraseña. Póngase en contacto con su proveedor de alojamiento si usted no tiene los detalles necesarios.

Asegúrese de tener una base de datos creada para la instalación de Magento. Y también asegurarse de que está vacia, sin ninguna tabla. Opciones de acceso Web y Opciones de almacenamiento de sesiones – por favor deje las opciones sin ningún cambio si no está seguro. Los ajustes por defecto normalmente funcionan bien.

Si todo es correcto, por favor haga clic en el botón 'Continue'.

Paso 4: Crear una cuenta de administrador

Aquí es necesario introducir datos de carácter personal para el dueño de la tienda y el administrador.

Cuando haya terminado, haga clic en el botón 'Continue'.

Paso 5: Lo tiene todo configurado

Este es el paso final de la instalación. Copie la clave cifrada generada y guardela en un lugar seguro. Puede utilizar los botones en la esquina inferior derecha para ver la interfaz final de la tienda y el panel de administración.

En primer lugar, asegúrese de que su versión de instalación de Magento cumple con los requisitos de la plantilla. Si está utilizando una versión antigua de Magento, es necesario actualizarlo. No se olvide de hacer una copia de seguridad de los archivos y de la base de datos. Las instucciones de actualización de Magento están disponibles en la página Magento Wiki.

Si su motor de Magento cumple con los requisitos de la plantilla, puede iniciar la instalación de la plantilla.

1. Abra el paquete de la plantilla y vaya a la carpeta theme###.
2. Suba el contenido de la carpeta theme### al directorio de instalación de Magento (suba "app", "skin" y otras carpetas). Estas carpetas contienen los archivos del tema. No van a afectar sus archivos existentes.

1. Configuración de la plantilla

Vamos a revisar las opciones de configuración de la plantilla basadas en el ejemplo. Está configurado de la misma forma que nuestra plantilla de demostración, sin afectar a los datos de productos.

Active la nueva plantilla

1. Abra el panel de administración de Magento y vaya a System > Design en el menú superior.
2. Haga clic en el botón "Add Design Change".
3. En el campo "Custom Design", seleccione el nombre del tema (por ejemplo, theme###).
4. Haga clic en el botón "Save" para aplicar los cambios.

Reindexar los datos

1. Abra el panel de administración de Magento y en el menú superior, seleccione System > Index Management.
2. Marque la casilla "Select All" en la esquina superior izquierda.
3. En el campo "Actions" seleccione "Reindex Data".
4. Haga clic en el botón "Submit".
5. Por favor, sea paciente, esto puede tomar un tiempo.

Desactivar caché

Para hacer que los cambios aparezcan en su sitio web sin retraso deberá desactivar la caché. Puede activarlo cuando haya terminado con la edición de tienda.

1. Abra el panel de administración de Magento y vaya a System > Cache Management en el menú superior.
2. En la parte superior izquierda esquina haga clic en "Select All".
3. En el lado derecho, en el campo "Actions" seleccione "Disable".
4. Haga clic en el botón "Submit".

2. Configuración del logotipo.

Por favor, siga estos pasos cuando configure la imagen del logotipo incluido en el paquete del tema (puede verlo en la página de demostración).

1. Abra el panel de administración de Magento y seleccione System > Configuration en el menú superior .
2. Seleccione la pestaña "Design".
3. En la sección "Header", modifique el valor del campo "Logo Image Src". Cambie desde "gif" hasta "png".
4. Haga clic en el botón "Save Config".

Para instalar el logotipo de su empresa, usted necesita cargar el archivo de su logotipo a la carpeta /images del tema de Magento.

3. Configuración de páginas

Para que su plantilla se vea exactamente igual que nuestra página de demostración, necesita configurar las páginas de la tienda de una forma específica. Le brindamos todos los archivos de código fuente de las páginas. Es necesario añadirlos en el panel de administración de Magento siguiendo las instrucciones a continuación utilizando la tabla de ajustes. La tabla ajustes se encuentra en la página Detalles técnicos en la página de la plantilla de vista previa. El archivo de documentación contiene el enlace a esta página:

• documentation
  • documentation.html

La página principal de la plantilla será la más afectada. Por lo general, contiene los siguientes elementos: banners, elementos deslizantes, galerías, etc.

Le recomendamos que desactive el editor WYSIWYG. Para ello, desde el menú de administración superior, seleccione System > Configuration. Abra la sección "Content Management" y en la ventana WYSIWYG Options cambie la opcion "Enable WYSIWYG Editor" a "Disabled Completely".

1. En el menú superior, seleccione CMS > Pages. Aquí puedes encontrar todas las páginas de la tienda. Home page, About Us y Customer Service ya deberían estar disponibles, por lo que no es necesario añadirlas. Sólo tiene que actualizar las páginas HTML y el contenido XML. Abra cualquiera de ellos para acceder a los contenidos.
2. Abra la página y seleccione la pestaña Content. Contiene el código HTML de la página. Puede coger el código de la página HTML a partir del archivo fuente apropiado. Usted puede ver la lista de archivos de código fuente incluido en la sección "Template Settingsa" en la página de vista previa de la plantilla. Copie el código del archivo de origen y peguelo en el área content.
3. Cuando haya terminado con el código HTML, cambiar a la pestaña "Design". Contiene el código de la página XML. El código XML le permite añadir bloques estáticos y widgets a la página de Magento. El código XML debe ser copiado de la misma manera que el código HTML desde el archivo de origen. Copie el código XML en el área "Layout Update XML".
4. No olvide seleccionar la opción "Layout" correcta.
5. En caso de que necesite agregar una nueva página, haga clic en el botón "Add New Page" en la esquina superior derecha.

En caso de tener alguna dificultad, por favor revise el tutorial detallado sobre Cómo configurar las páginas de forma manual.

4. Configuración de bloques estáticos

Cuando haya terminado de configurar las páginas, es necesario configurar los bloques estáticos. El procedimiento es similar: hay que copiar el código de los archivos de origen y pegarlo en los campos correspondientes en el panel de administración de Magento. Es necesario utilizar una tabla similar pero para los bloques estáticos.

1. En el menú superior, seleccione CMS > Static Blocks.
2. Haga clic en el botón "Add New block" en la esquina derecha para añadir un nuevo bloque.
3. Introduzca el nombre del bloque y un identificador. Usted puede conseguir los detalles de los bloques en la tabla de la plantilla de demostración (consulte la parte de configuración de páginas).
4. Abra el archivo de origen del bloque y copie el código HTML en el área de contenido.

Cuando haya terminado de configurar páginas de la tienda y los bloques, su tienda estará lista para funcionar.

1. Módulo de divisas

1. Abra el panel de administración de Magento.
2. En el menú superior, seleccione System > Configuration.
3. A continuación, haga clic en General y seleccione la pestaña Currency Setup.
4. En las Currency Options, Presione la tecla CTRL y seleccione las monedas permitidas que se pueden usar para mostrar los precios en su tienda de Magento. Cuando haya terminado, haga clic en el botón Save Config para guardar los cambios.
5. Vaya a System > Manage Currency Rates en el menú superior.
6. Establezca los valores de tasa de divisas requeridos o utilice el servicio de importación. Haga clic en el botón Save Currency Rates para guardar los cambios.

2. Módulo de encuestas

En el menú superior, seleccione CMS > Polls.

1. Google Map

Este módulo le permite insertar un mapa de Google en su sitio web de Magento. Por defecto, el módulo viene con dos mapas: el mapa de la página de contacto y el mapa del pie de página para el resto de páginas.

Ambos mapas pueden configurarse en el Panel de Administración de Magento en la sección System > Configuration > Templatemonster > Google Map.

El módulo tiene las siguientes opciones:

2. Botón Me Gusta de Facebook

Este módulo le permite mostrar el botón Me Gusta de Facebook en su tienda Magento.

Se puede configurar en el Panel de Administración de Magento en la sección System > Configuration > Templatemonster > Facebook section.

El módulo tiene las siguientes opciones:

Por defecto, el módulo se muestra en la columna izquierda. Pero hay tres opciones de visualización: left, right y footer.
Para cambiar la posición del módulo, es necesario abrir el archivo tm_facebook.xml que se encuentra en la carpeta app/design/frontend/default/themeXXX/layout de su instalación.

<reference name="left">
	<block type="core/template" name="tm_facebook_like_left" as="tm_facebook_like_left" template="tm/facebook/facebook_like.phtml"/>
</reference>
<!-- <reference name="right">
	<block type="core/template" name="tm_facebook_like_right" as="tm_facebook_like_right" template="tm/facebook/facebook_like.phtml"/>
</reference> -->
<!-- <reference name="footer">
	<block type="core/template" name="tm_facebook_like_footer" as="tm_facebook_like_footer" template="tm/facebook/facebook_like.phtml"/>
</reference> -->

Dos bloques están comentados en este archivo. Y sólo un bloque con name="left" no esta comentado. Muestra el módulo en la columna de la izquierda.
Si usted necesita mostrar el módulo en el pie de página, siga estas instrucciones:

• 1. Descomente las líneas de código para el bloque name="footer" (el último en el ejemplo de código de arriba) y comente el bloque name="left" (el primero en el ejemplo del código de arriba).
• 2. Abra el archivo footer.phtml que se encuentra en la carpeta app/design/frontend/default/themeXXX/template/page/html.
• 3. Pegue el código siguiente en el lugar necesario:

  <?php echo $this->getChildHtml('tm_facebook_like_footer') ?>

Ahora el módulo de Facebook se mostrará en el pie de página.

3. Módulo de Instagram

El módulo de Instagram le permite mostrar la galería Instagram en su tienda.
Este módulo le permite mostrar dos tipos de galerías: galería de usuario y una galería de etiquetas.

Todas las opciones de configuración están disponibles en el Panel de Administración en la sección System > Configuration > Templatemonster > Instagram.

El módulo tiene las siguientes opciones:

4. Módulo de Twitter

El módulo de Twitter le permite mostrar los tweets que se muestran en su tienda.

Todas las opciones de configuración están disponibles en el Panel de Administración en la sección System > Configuration > Templatemonster > Twitter.

El módulo tiene las siguientes opciones:

Por defecto, el módulo se muestra en la columna izquierda. Pero hay tres opciones de visualización: left, right y footer.
Para cambiar la posición del módulo, es necesario abrir el archivo tm_twitter.xml que se encuentra en la carpeta /app/design/frontend/default/themeXXX/layout de su instalación.

<reference name="left">
	<block type="core/template" name="tm_twitter_timeline" as="tm_twitter_timeline" template="tm/twitter/twitter_timeline.phtml"/>
</reference>
<!-- <reference name="footer">
	<block type="core/template" name="tm_twitter_timeline" as="tm_twitter_timeline" template="tm/twitter/twitter_timeline.phtml"/>
</reference>
<reference name="right">
	<block type="core/template" name="tm_twitter_timeline" as="tm_twitter_timeline" template="tm/twitter/twitter_timeline.phtml"/>
</reference> -->

Dos bloques están comentados en este archivo. Y sólo un bloque con name="left" no esta comentado. Muestra el módulo en la columna de la izquierda.
Si usted necesita mostrar el módulo en el pie de página, siga estas instrucciones:

• 1. Descomente las líneas de código para el bloque name="footer" (el último en el ejemplo de código de arriba) y comente el bloque name="left" (el primero en el ejemplo del código de arriba).
• 2. Abra el archivo footer.phtml que se encuentra en la carpeta app/design/frontend/default/themeXXX/template/page/html.
• 3. Pegue el código siguiente en el lugar necesario:

  <?php echo $this->getChildHtml('tm_twitter_timeline') ?>

Ahora el módulo de Twitter se mostrará en el pie de página.

5. Ventana emergente de noticias

Este módulo le permite mostrar una ventana emergente con el formulario de suscripción al boletín de noticias.

Puede activar/desactivar el módulo en el Panel de Administración de Magento en la sección System > Configuration > Templatemonster > NewsletterPopup.

Para editar el aspecto de la ventana, tiene que editar el archivo del tema style.css. Si necesita añadir varios elementos de usuario a la ventana emergente, tiene que editar el archivo newsletterpopup.phtml que se encuentra en la carpeta app/design/frontend/default/themeXXX/template/tm/newsletterpopup.

6. Cuenta atrás de precios especiales

Este módulo le permite mostrar una cuenta atrás para saber cuanto tiempo queda antes de que expiren los descuentos especiales.

Puede activar/desactivar el módulo en el Panel de Administración de Magento, en la sección System > Configuration > Templatemonster > Special Price Countdown.

Para cambiar la apariencia de la cuenta atrás tiene que editar el archivo flipclock.css (flipclock.less) que se encuentra en la carpeta skin/frontend/default/themeXXX/css/tm/specialpricecountdown.

7. Product list gallery

El módulo le permite mostrar las imágenes del producto en miniatura junto con su imagen principal. En el tema por defecto, se visualizan las miniaturas de la imagen principal abajo, pero en nuestros temas se muestran miniaturas de acuerdo con el diseño PSD.

Este módulo puede ser activado / desactivado en la panel de administración de Magento, en System > Configuration > Templatemonster > Product List Gallery (Sistema > Configuración > Templatemonster > Product list gallery).

Módulo incluye 4 secciones de configuración: List View, Grid View, Homepage List View, y Homepage Grid View.

En Homepage List View y Homepage Grid View Puede configurar a mostrar la galería en la página principal de la tienda. Otras dos secciones ayudan a configurar la muestra de la galería en las páginas de categorías.

Todas las secciones incluyen los mismos ajustes:

Nota Bene! El ancho máximo de la imagen es igual a la anchura de la columna donde se coloca.

1. Chat en Vivo de Olark

Es necesario registrarse en el sitio web oficial para utilizar el chat en línea integrado en la plantilla, indique toda la información necesaria para recibir el código Olark Site-ID.

¡Ha Terminado! Ahora puede visitar su sitio web y ver el widget del chat.

También puedes echar un vistazo a las siguientes instrucciones:

• Empezar a trabajar con Olark
• Manual del Usuario de Olark

2. Cloud Zoom

Los ajustes de Cloud Image Zoom permiten cambiar las dimensiones de la imagen emergente (pop-up) y establecer el tamaño original de la imagen.

3. Compartir

Los ajustes de la herramienta Sharing le permite elegir cómo se muestran los iconos. Los valores recomendados se muestran en la imagen.

4. Blog

5. Mega menu

El módulo sustituye el menú estándar por el menú que permite configurar la visualización en dos niveles de subcategorías, añadir bloques estáticos para el menú desplegable, añadir etiquetas, visualización de productos, etc.

MegaMenu está incluido en la plantilla por defecto, se puede activar/desactivar en System > Configuration > CMSMART MEGAMENU > Mega Menu.

1. La visualización de cada menú desplegable se puede configurar en la página de configuración de las categorías, que se encuentra en Catalog > Manage Categories.

2. Para añadir un bloque estático a un menú desplegable, es necesario añadir el bloque estático en CMS > Static Blocks y una vez que se ha creado añadirlo al menú.

3. El módulo le permite añadir etiquetas a cualquier categoría.

Puede hacerlo en el menú de categorías Catalog > Manage Categories.

4. Para cambiar la cantidad de columnas en subcategorías necesita cambiar el valor del número de la columna de nivel en el menú Catalog > Manage Categories.

6. Parallax

Para añadir efecto parallax a cierto bloque de contenido necesita:

1. añadir alguna clase para el bloque de efecto parallax (por ejemplo, parallax) y añadir el atributo data-source-url="{{skin url='images/your_images.jpg'}}".

2. añadir la imagen dentro de la carpetas de imágenes skin\frontend\default\themeXXX\images\.

3. añadir los estilos dentro del archivo skin\frontend\default\themeXXX\css\style.css:

.parallax {
	background-image: url(../images/parallax-img.jpg);
	background-position: 50% 0%;
	background-repeat: no-repeat;
	background-size: cover;
	width: 3500px;
	left: 50%;
	margin-left: -1750px;
}
				

4. añadir el siguiente código dentro archivo skin\frontend\default\themeXXX\js\scripts.js:

jQuery(window).load(function(){
	var isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEmobile|Windows Phone|WPDesktop/i.test(navigator.userAgent);
	if(!isMobile) {  
	    if(jQuery(".parallax").length){  jQuery(".parallax").cherryFixedParallax({  invert: true, 
	    		offset: 300 
	    }); 
	  }; 		
	};	
});
				

La variable invert: true elige la dirección del efecto parallax, y offset: 300 es la densidad.

7. Background Video

El vídeo puede ser añadido por medio de un bloque estático, incluyendo el archivo de comandos jquery.mb.YTPlayer.js y configurando sus correspondientes atributos para el elemento que mostrará el vídeo.

8. Política de cookies

Las cookies son pequeños archivos de texto que los sitios web colocan en los ordenadores de los visitantes. Por lo general son utilizados para identificar a visitantes determinados y proporcionarles una mejor experiencia. Las cookies son una parte crucial de muchas funciones del sitio web que damos por sentado.

Por ejemplo, por lo general las cookies permiten a las tiendas en línea recordar que elementos tiene en su carrito de la compra. También se utilizan para guardar la información de registro en un sitio web o para proporcionar estadísticas de uso e información valiosa para los propietarios de sitios web.

Si ejecuta un sitio web, es casi seguro que utiliza cookies. Su función más probable es controlar el número de visitantes y comportamientos mediante herramientas como Google Analytics. También pueden usarse para mostrar anuncios relevantes a los visitantes. Las cookies también son partes fundamentales de su sistema de compras en línea.

El 26 de mayo 2012 - El ICO lanzó un cambio en la política de cookies. A partir de ese momento "el consentimiento implícito" está permitido, siempre y cuando quede claro dónde se encuentra su política de privacidad/cookies.

Siguiendo las condiciones de la Ley de cookies, debe añadir módulos adecuados a su sitio web que mostrarán un mensaje de advertencia acerca de las cookies utilizadas. Podemos recomendar los siguientes:

• Creare EU Cookie Law Banner
• EU Cookie Law Compliance - Consentimiento implícito