HelloTonic GO

Documentacion de los templates

Need Help?

Instalando el Tema

-Primero, ingresa a tu Panel de Administracion de Magento GO y ve a “Diseñar” > “Editor de Temas”

-Desde la opcion “Tema Actual”, abajo de “Your Starting Theme”, selecciona “Personalizar”. Si no tienes este Tema (Your Starting Theme) abajo de “Tema Actual”, selecciona el Tema “T-shop” abajo de “Temas Disponibles” (click en Personalizar).

-Desde el menu de “Personalizacion de Tema”, selecciona la pestaña “Editor de CSS”

-Dentro del menu “Editor de CSS”, selecciona “Gestionar” al lado de

-Haz click en “Examinar archivos…” y busca en la carpeta de tu Tema la carpeta “Css Editor Images”. Vas a ver que hay 2 carpetas y algunas imagenes fuera de estas carpetas. Tienes que crear esas carpetas abajo de la carpeta principal “Imagenes de Editor de CSS”, entonces haz click en “Crear carpeta…” y escribe el mismo nombre de la carpeta que ves en la carpeta del Tema: seria 1 carpeta para “background” y otra para “images” (asegurate de que estas carpetas que creaste esten bajo la carpeta principal Imagenes de Editor de CSS).

-Una vez que estas carpetas esten creadas, puedes empezar a subir las imagenes. Hecha un vistazo a la carpeta del Tema, y fijate como las imagenes estan distribuidas entre estas 3 carpetas: primero sube las imagenes que estan dentro de la carpeta “Css Editor Images”, luego haz click en la sub-carpeta “background” y sube las imagenes que estan dentro de esta carpeta, luego haz lo mismo para la carpeta “imagenes”.

-Ahora navega nuevamente al menu “Editor de CSS”, verás la pestañana  “CSS Personalizada”, haz click en “Browse…” al lado de “Cargar el archivo custom.css” y busca el archivo custom.css adentro de la carpeta “sources” en la carpeta del Tema. Luego haz click en “Guardar”.

-Una vez que haz terminado de subir el archivo custom.css, navega al menu de “Editor Java Script”. Dentro de las opciones de “Tema Java Script” haz click en “Examinar Archivos…”, busca los archivos .js del Tema adentro de la carpeta “source”, seleccionalos a todos y subelos. Para HelloTonic GO, el orden de los archivos .js debe ser: 1° jquery-1.6.2.min.js, 2° jquery.cycle.all.js, 3° custom.js .Luego haz click en “Guardar”.

 

Important!: Be sure to click in "Show/Hide Editor" in order to HIDE the HTML Editor (WYSIWYG Editor). If not, the code will be displayed wrong.

Configurando la HomePage

-Para configurar la HomePage, navega a CMS>Paginas>Administre Contenido>selecciona la HomePage con “Clave URL”= “home”.

-En el menu de “Informacion de la Pagina”, selecciona “Contenido”, asegúrate de ocultar el editor de texto, y copia/pega el contenido siguiente o el contenido del archivo “homepage.txt” de tu carpeta del Tema (es lo mismo).

-Luego ve a la pestaña “Diseño” y selecciona “1column” como opcion de “Diseño”. Ahora haz click en “Guardar Pagina”.

Content:
{{widget type="catalog/product_widget_new" show_paginator="0"  products_count="6" template="catalog/product/widget/new/content/new_grid.phtml"}}
<ul class="items_home">
<li><img title="helloTonic" src="http://lorempixum.com/g/106/106/technics/1" alt="" />
<h3>Tonic for iPhone</h3>
<span>Comes with a built in ready iPhone version to maximize the user experience.</span> </li>
<li><img title="helloTonic" src="http://lorempixum.com/g/106/106/technics/2" alt="" />
<h3>Tonic for iPhone</h3>
<span>Comes with a built in ready iPhone version to maximize the user experience.</span> </li>
<li style="margin: 0;"><img title="helloTonic" src="http://lorempixum.com/g/106/106/technics/3" alt="" />
<h3>Tonic for iPhone</h3>
<span>Comes with a built in ready iPhone version to maximize the user experience.</span> </li>
</ul>
<div class="featured-categories">
<div class="subcat-listing">
<ul class="subcat-products">
<li> <img style="border-radius: 3px 3px 3px 3px;" src="http://demo.hellothemes.com/media/catalog/category/1.jpg" alt="Furniture" width="auto" /> <a class="link-category" href="/furniture.html">
<h3 style="border-top-left-radius: 3px; border-top-right-radius: 3px;">Furniture</h3>
</a> <span>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour.</span> <a class="more" title="Furniture" href="/furniture.html">> View Category Range</a> </li>
<li> <img style="border-radius: 3px 3px 3px 3px;" src="http://demo.hellothemes.com/media/catalog/category/2.jpg" alt="Electronics" width="auto" /> <a class="link-category" href="/electronics.html">
<h3 style="border-top-left-radius: 3px; border-top-right-radius: 3px;">Electronics</h3>
</a> <span>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour.</span> <a class="more" title="Electronics" href="/electronics.html">> View Category Range</a> </li>
<li style="padding: 0px;"> <img style="border-radius: 3px 3px 3px 3px;" src="http://demo.hellothemes.com/media/catalog/category/3.jpg" alt="Apparel" width="auto" /> <a class="link-category" href="/apparel.html">
<h3 style="border-top-left-radius: 3px; border-top-right-radius: 3px;">Apparel</h3>
</a> <span>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour.</span> <a class="more" title="Apparel" href="/apparel.html">> View Category Range</a> </li>
</ul>
</div>
</div>

 

Static Blocks are extra HTML or Plain Text that can be integrated to your store. We set these up so you can customize links, images or text included in our themes. We are now going to install our static blocks for this theme, within your Admin-panel go to CMS → Static Blocks → Add New Block.
Important!: Be sure to click in "Show/Hide Editor" in order to HIDE the HTML Editor (WYSIWYG Editor). If not, the code will be displayed wrong.

Este tema no incluye Bloques Estaticos.

Block Title: Este tema no incluye Bloques Estaticos.
Identifier:
Satus: Enabled