slideshow en la home
Viendo esta tienda, he decidido hacerme mi propio slideshow.
En el foro americano he encontrado este hilo donde el trabajo ya estaba casi todo hecho, solo he cambiado la disposición de las divs, colocandolas encima una de otras gracias a la propiedad css z-index, y he añadido una pequeña función para que el slideshow se pare cuando el ratón pasa encima.
Gracias a script.aculo.us (que viene ya instalado con Magento) es realmente muy facil conseguir unos efectos muy chulos.
Entonces, para tener un slideshow en la home, primero vamos a crear un bloque estático: CMS->Bloques Estáticos->Agregar un nuevo bloque. Le damos un nombre y un identificador, lo habilitamos y en el campo Contenido de la pestaña Información general añadimos un poco de JavaScript:
<script type="text/javascript">start_slideshow(1, 3, 3000);
function start_slideshow(start_frame, end_frame, delay) {
id = setTimeout(switch_slides(start_frame,start_frame,end_frame, delay), delay);
}
function switch_slides(frame, start_frame, end_frame, delay) {
return (function() {
Effect.Fade('slide' + frame, { duration: 1.0 });
if (frame == end_frame) { frame = start_frame; } else { frame = frame + 1; }
Effect.Appear('slide' + frame, { duration: 1.0 });
if (delay == 1000) { delay = 3000; }
id = setTimeout(switch_slides(frame, start_frame, end_frame, delay), delay);
})
}
function stop_slideshow() {
clearTimeout(id);
}
</script>
y el contenido html con las divs y sus imagenes linkeadas:
<div id="introhomepage" style="height: 230px; position: relative;" onmouseover="stop_slideshow()" onmouseout="start_slideshow(1, 3, 1000)">
<div id="slide1" class="slide" style="position: absolute; top: 0pt; left: 0pt; display: block; z-index: 3; opacity: 1;"><a href='http://www.yourdomain.com/path/to/webpage1.html'><img border='0' src='{{skin url='path/to/image.jpg'}}' /></a></div>
<div id="slide2" class="slide" style="position: absolute; top: 0pt; left: 0pt; display: none; z-index: 2; opacity: 0;"><a href='http://www.yourdomain.com/path/to/webpage2.html'><img border='0' src='{{skin url='path/to/image.jpg'}}' /></a></div>
<div id="slide3" class="slide"style="position: absolute; top: 0pt; left: 0pt; display: none; z-index: 1; opacity: 0;"><a href='http://www.yourdomain.com/path/to/webpage3.html'><img border='0' src='{{skin url='path/to/image.jpg'}}' /></a></div>
</div>
Ahora solo queda incluir este bloque donde queramos, en este caso la homepage, vamos a editarla: CMS->Gestionar las páginas->HomePage y en el campo Contenido de la pestaña Información general añadimos:
{{block type="cms/block" block_id="el_identificador" template="cms/content.phtml"}} Esta claro que hay que adaptar los enlaces y las rutas a las imagenes (estas imagenes tienen que estar en /skin/frontend/default/tutema/images/).
mi primer modulo
15.12.08 20:20 , Categories: programación ¡Porfin pongo las manos dentro del código! Voy a repasar los pasos para conseguir el ejercicio del capitulo 6 del libro Guide to E-commerce Programming with MAGENTO. Este ejercicio consiste en reemplazar el cuadro de texto para introducir la cantidad que se quiere comprar de un articulo en su ficha por un desplegable con unos valores de tipo (x*1) - (x*2) - (x*3) - (x*4): pensar por ejemplo en cajas de huevos, se puede comprar una o más cajas de 6, por lo cual la cantidad pedida sera siempre un multiplo de 6. Pero no para todos los productos de la tienda (seria demasiado facil), sino solo los que elegimos.
Ademas del libro (que no tiene toda la información y parte de ella no es correcta) me he ayudado del tutorial de Fido para crear un modulo simple, que el sí esta muy bien hecho, completo y correcto.
- Ya sabemos que es mejor no tocar el código original de Magento. Lo que se recomienda es crear un directorio dentro de app/code/local/ que llamamos al nombre de la empresa (por ejemplo). La empresa para quien trabajo se llama amantis por lo cual he creado el directorio app/code/local/Amantis/ (primera letra en mayuscula, el resto en minuscula: es importante). Dentro de esta carpeta almacenaremos todos los modulos que desarollamos para esta empresa. Empezamos directamente con este: voy a trabajr con las cantidades, creo un directorio app/code/local/Amantis/Cantidades/.
Amantis es el namespace y Cantidades es el modulo. - Indicamos a Magento que hay que cargar este modulo, y como lo más probable es que haya más modulos despues, voy a reunirles todos en un fichero: app/etc/modules/Amantis_All.xml. Contiene:
<?xml version="1.0"?> <config> <modules> <Amantis_Cantidades> <active>true</active> <codePool>local</codePool> </Amantis_Cantidades> </modules> </config> - Creo app/code/local/Amantis/Cantidades/etc/config.xml para una configuración minima del modulo. Contiene:
<?xml version="1.0"?> <!-- more at http://www.magentocommerce.com/wiki/custom_module_with_custom_database_table#create_configuration_xml --> <config> <!--turn on our module, required for install support --> <modules> <Amantis_Cantidades> <version>1.0</version> </Amantis_Cantidades> </modules> <global> <blocks> <amantis_cantidades> <class>Amantis_Cantidades_Block</class> </amantis_cantidades> </blocks> </global> </config>Estos 2 pasos son fundamentales para que el modulo se active cuando se carga la pagina pero no tienen mucho misterio. Lo unico importante es respetar el UpperCamelCase. El resto habla por si solo: es la versión 1.0 del modulo, es activo, esta dentro del pool local y contiene ficheros de Block cuyas classes empezaran con Amantis_Cantidades_Block.
envio gratis por algunos productos
A raiz de este post me ha recordado que tengo que preparar algo así para mi tienda: algunos productos se pueden enviar sin gastos, a través de correos de España, sin certificado. Esta opción tiene que estar disponible unicamente si todos los productos presentes en la cesta disponen de esta opción.
La idea global es crear un atributo Envío gratis para los articulos y despues crear una regla de precios del carrito que ofrezca la opción de envío gratuito si todos los articulos comprados pueden enviarse con esta modalidad.
- Vamos a Catálogo->Atributos->Gestionar los atributos y le damos a Agregar un nuevo atributo y rellenamos la información:
Pestaña Propiedades:Propiedades del atributo
- Código del atributo: envio_gratis_correo
- Alcance: Global
- Tipo de entrada del catálogo...: Desplegable
- Valor único: No
- Valores requeridos: Sí
- Validación de entrada...: Ninguno
- Aplicar a: Todos los tipos de productos
- Usar para crear un productos configurable: Sí
plugin: WYSIWYG en el admin
Fontis acaba de publicar una extension para tener FCKeditor o TinyMCE en los campos de textos del admin.
Para instalarla, el código es:esta estable.
Para configurarla, vamos a Sistema->Configuración->(Avanzado)Admin y en la ultima pestaña, hay 2 desplegables para elegir cual de los 2 editores preferimos y en cuales textareas lo queremos.
Un plugin muy interesante para el TinyMCE es el Ajax File and Image Manager de www.phpletter.com que permite subir imagenes directamente desde nuestro ordenador. Descargamos la ultima versión (1.0 RC 4, de momento), la descomprimos y copiamos el directorio ajaxfilemanager (con su contenido) en /js/fontis/tiny_mce/plugins. Abrimos el archivo /js/fontis/tiny_mce/plugins/ajaxfilemanager/inc/config.base.php y editamos la ruta del directorio donde vamos a guardar las imagenes que se subiran a traves de este plugin. Por defecto viene:../../uploaded/.
Para Magento, para que las imagenes se guarden en el directorio media, cambiamos las lineas 43-44 de a
En este mismo fichero hay que modificar tambien, en la linea 112, reemplazar default por tinymce3.
Ahora tenemos que incluir este plugin en la declaracion del tinyMCE. Abrimos el archivo app/design/adminhtml/default/default/template/fontis/wysiwyg/wysiwyg.phtml y añadimos en la función tinyMCE.init la linea file_browser_callback : "ajaxfilemanager" y despues esta función. Al final, el fichero queda así:
completar la instalación
Acabo de reinstalar (ya no se cuantas instalaciones he hecho 
) magento y me ha dado algunos problemas.
Aqui viene lo que he hecho para proximas veces:
- Ver todo en el Magento Connect:
La primera vez que vas al connect no te aparece nada. Para remediar a esto, basta con pegar:magento-core/Mage_All_Latest
en la caja de llaves de instalacion de extensiones (Paste extension key to install:) y le das a Install. - Instalar el español:
Todavia en el Connect, primero necesitamos cambiar el estado de las extensiones que aceptamos a Beta, ya que de momento la extension española esta en Beta. Vamos en la pestaña Settings y seleccionamos Beta en el desplegable.
Volvemos a la pestaña extensions y pegamos:magento-community/Locale_Mage_community_es_ES
- Crear su propio tema:
Para evitar que desaparezcan los cambios de diseño que hacemos a cada actualización de Magento, vamos a trabajar con nuestro propio tema. Dentro de /app/design/frontend/default/ creamos un directorio que llamamos mi_tema, por ejemplo y pegamos el contenido de /app/design/frontend/default/default/ dentro. Hacemos lo mismo en el directorio skin/frontend/default/.
Ya podemos activar nuestro tema, en Sistema->Configuración->(General)Diseño la pestaña Temas en el campo Por defecto ponemos mi_tema (o como sea que hayamos llamado el directorio).
- Habilitar el SEO:
Me parece que no he checkeado el box para habilitar el Search Engine Optimization, o sea la reescritura de URL's, cuando debia.
Para solucionarlo:- en el admin, Sistema->Configuración->(General)Web, en la pestaña Optimización para motores de búsqueda seleccionamos Sí del desplegable Usar reescrituras del servidor web.
- en Sistema->Cache Management, le damos a Recargar a Catalog Rewrites (en la parte de abajo).
:: Next >>
XML Feeds
