FlashShop!
FlashShop!
Manual para FlashShop! v2.0© 2009 goTo Multimedia.
Tabla de Contenido
Introducción 4
Descripción 4
Compatibilidad 4
Características 4
Guía Rápida 6
La interfaz gráfica 6
Como se usa? 10
Referencia de ActionScript 11
Paquete. 11
Propiedades 11
Constantes 26
Eventos 26
XML 28
Etiquetas XML 30
Descripción de las Etiquetas 31
Paso a paso 41
PHP 45
Créditos 48
3
Introducción
DescripciónFlashShop V2 es un componente que permite visualizar de una forma atractiva y elegante un conjunto de productos. Además, tiene la capacidad de poder vender estos productos convirtiendose fácilmente en una tienda virtual que usa dos mé-todos de pago (vía Paypal o Formulario de pedido).
Esta diseñado para que todos los textos, apariencia y funcionalidad puedan ser personalizados de forma sencilla a través de XML.
CompatibilidadActionScript: Solo la versión 3.0.Flash IDE: CS3 o superior.Flash Player: Flash Player 9 o superior.
Características
• Forma de compra a través de PayPal.• Configuración a través de XML.• Soporta etiquetas HTML usando CDATA.• Textos personalizados.• Transiciones elegantes y fluidas con TweenLite. • No tiene limite en el numero de productos.• Puede ajustar el tamaño de los productos como se desee.• Colores personalizados.• Reescalable.• Contador de Productos opcional.• Opción de descuento para cada producto.• Motor de búsqueda a través de Etiquetas y Nombres.• Categorización de productos .
4
• Opción de características para los productos.• Características de productos ilimitadas.• Registro de Colores.• Opción costo de envío.• Opción de descuento para cada producto• Opción de IVA• Opcion de Términos y Condiciones• Formulario para Orden de compra.
5
Guía Rápida
La interfaz gráficaFlashShop cuenta con un diseño visual bastante agradable y que puede ser per-
sonalizado al gusto según las necesidades requeridas.
A continuación, se hace una descripción detallada de cada elemento que confor-ma FlashShop V2.
1. Lista de productos, muestra una lista de artículos agregados a través de XML.2. Cabecera, muestra los títulos del articulo señalado.3. Visualizador, muestra las imágenes de los productos.4. Reel, muestra varias imágenes del producto.5. Area de texto, es utilizada para mostrar las características y descripción.
6
6. Botones de compra, el botón Add permite añadir a la lista de compras el pro-ducto visualizado, y el botón Cart muestra la lista de compras.
FlashShop V2 cuenta con una vista donde se pueden mostrar varias imágenes de un producto especifico, con opción de ampliar y ver el producto mas detalla-damente.
1. Cabecera, muestra los títulos del articulo señalado.2. Reel, muestra varias imágenes del producto.3. Visualizador, muestra las imágenes de los productos y permite la imagen a una
vista mas detallada.4. Botón de Cerrar.
7
FlashShop cuenta con la posibilidad de mantener un listado de compras, que describimos a continuación:
1. Cabecera, muestra el titulo de la Lista de Compras.2. Lista de compras, muestra una lista de artículos añadidos al carro de compras.3. Total, muestra el valor total de la compra en la moneda especificada.4. Botón de Checkout.5. Botón de Cerrar.
Item de la lista de compras1. Titulo, nombre del articulo.2. Precio, indica el valor unitario.3. Cantidad, especifica el numero de copias de un producto especifico.4. Total, muestra el valor total de la compra para el producto especifico.
8
5. Features, especifica las características del item (color, tamaño, etc). 6. Eliminar, borra el producto de la lista de compras.
9
Como se usa?Instancia con ActionScript
Crea una instancia de FlashShop V2, especifica la URL del contenido XML y agre-gala en el objeto de visualización que desees, ya sea el stage o cualquier otro con-tenedor.
import gT.display.flashShop.FlashShop;var shop:FlashShop = new FlashShop();shop.xmlPath = "data/products.xml";addChild(shop);
En este punto esta listo, ahora compila la película y disfruta.
10
Referencia de ActionScript
Paquete.Siempre que se quiera crear una instancia de FlashShop V2 se debe importar la clase que se encuentra en el siguiente paquete:
gT.display.flashShop.FlashShop
Ejemplo:
import gT.display.flashShop.FlashShop;
var myFlashShop:FlashShop = new FlashShop();myFlashShop.xmlPath = "data/products.xml";addChild(myFlashShop);
Propiedadeswidth propiedad
DescripciónDefine la anchura del componente, expresada en pixeles.
TipoNumber
UsomyFlashShop.width = 860;
ImplementaciónEscritura y Lectura
11
height propiedad
DescripciónDefine la altura del componente, expresada en pixeles.
TipoNumber
UsomyFlashShop.height = 480;
ImplementaciónEscritura y Lectura
viewerWidth propiedad
DescripciónDefine la anchura del Visualizador (ver página 6) del componente, expresada en pixeles.
TipoNumber
UsomyFlashShop.viewerWidth = 277;
ImplementaciónEscritura
viewerHeight propiedad
DescripciónRecibe o define la altura del Visualizador (ver página 6) del componente, expresa-da en pixeles.
TipoNumber
12
UsomyFlashShop.viewerHeight = 277;
ImplementaciónSólo Escritura
thumbWidth propiedad
DescripciónDefine la anchura de todas las vistas previas del componente.
TipoNumber
UsomyFlashShop.thumbWidth = 50;
ImplementaciónSólo Escritura
thumbHeight propiedad
DescripciónDefine la altura de todas las vistas previas del componente.
TipoNumber
UsomyFlashShop.thumbHeight = 50;
ImplementaciónSólo Escritura
widthProductList propiedad
DescripciónRecibe la anchura de la Lista de productos (ver pagina 6) del componente.
13
TipoNumber
UsomyFlashShop.widthProductList = 190;
ImplementaciónEscritura
globalColor1 propiedad
DescripciónEl color primario del componente, expresado en formato hexadecimal. Por ejem-plo, el color negro es 0x000000; el color blanco es 0xFFFFFF. La propiedad glo-balColor1 tiene valor por defecto 0x82ae07.
Tipouint
UsomyFlashShop.globalColor1 = 0x82ae07;
ImplementaciónSólo Escritura
globalColor2 propiedad
DescripciónEl color secundario del componente, expresado en formato hexadecimal. Por ejemplo, el color negro es 0x000000; el color blanco es 0xFFFFFF. La propiedad globalColor2 tiene valor por defecto 0xFFFFFF.
Tipouint
UsomyFlashShop.globalColor2 = 0xFFFFFF;
14
ImplementaciónSólo EscriturareelBackgroundColor propiedad
DescripciónColor del reel del componente, expresado en formato hexadecimal. Por ejemplo, el color negro es 0x000000; el color blanco es 0xFFFFFF.
Tipouint
UsomyFlashShop.reelBackgroundColor = 0xFF0000;
ImplementaciónSólo Escritura
textColorHeader propiedad
DescripciónDefine el color de las Cabeceras (ver pagina 6) del componente, expresado en formato hexadecimal. Por ejemplo, el color negro es 0x000000; el color blanco es 0xFFFFFF. La propiedad textColorHeader tiene valor por defecto 0x000000.
Tipouint
UsomyFlashShop.textColorHeader = 0x000000;
ImplementaciónSólo Escritura
textColorList propiedad
DescripciónDefine el color de la Lista de productos (ver página 6) del componente, expresado en formato hexadecimal. Por ejemplo, el color negro es 0x000000; el color blanco es 0xFFFFFF. La propiedad textColorList tiene valor por defecto 0x2b3a01.
15
Tipouint
UsomyFlashShop.textColorList = 0x2b3a01;
ImplementaciónSólo Escritura
textColorDescription propiedad
DescripciónDefine el color del Area de Texto (ver pagina 6) que describe el producto en el componente, expresado en formato hexadecimal. Por ejemplo, el color negro es 0x000000; el color blanco es 0xFFFFFF. La propiedad textColorDescription tie-ne valor por defecto 0x909090.
Tipouint
UsomyFlashShop.textColorDescription = 0x909090;
ImplementaciónSólo Escritura
wasColor propiedad
DescripciónDefine el color de la etiqueta “wasLabel” del componente, expresado en formato hexadecimal. Por ejemplo, el color negro es 0x000000; el color blanco es 0xFFFFFF.
Tipouint
UsomyFlashShop.wasColor = 0x2b3a01;
16
ImplementaciónSólo Escritura
saveColor propiedad
DescripciónDefine el color de la etiqueta “saveLabel” del componente, expresado en formato hexadecimal. Por ejemplo, el color negro es 0x000000; el color blanco es 0xFFFFFF.
Tipouint
UsomyFlashShop.saveColor = 0x2b3a01;
ImplementaciónSólo Escritura
shippingColor propiedad
DescripciónDefine el color de la etiqueta “shippingLabel” del componente, expresado en for-mato hexadecimal. Por ejemplo, el color negro es 0x000000; el color blanco es 0xFFFFFF.
Tipouint
UsomyFlashShop.shippingColor = 0x2b3a01;
ImplementaciónSólo Escritura
VATColor propiedad
Descripción
17
Define el color de la etiqueta “VAT” del componente, expresado en formato hexa-decimal. Por ejemplo, el color negro es 0x000000; el color blanco es 0xFFFFFF.
Tipouint
UsomyFlashShop.VATColor = 0x2b3a01;
ImplementaciónSólo Escritura
roundCorners propiedad
DescripciónIndica el estilo de visualización del componente, si desea verlo con esquinas re-dondas o con esquinas cuadradas. La propiedad roundCorners tiene valor por defecto true.
TipoBoolean
UsomyFlashShop.roundCorners = true;
ImplementaciónSólo Escritura
shop propiedad
DescripciónPermite la activación del modo de venta de productos en el componente. La pro-piedad shop tiene valor por defecto true.
TipoBoolean
UsomyFlashShop.shop = true;
18
ImplementaciónSólo Escritura
maxReelItemsDisplayed propiedad
DescripciónDefine el numero máximo de Vistas previas que se visualizaran en el Reel (ver pa-gina 6) del componente. Esta propiedad tiene valor por defecto 3.
Tipouint
UsomyFlashShop.maxReelItemsDisplayed = 3;
ImplementaciónSólo Escritura
xmlPath propiedad
DescripciónDefine la ruta de ubicación del archivo xml que contiene los productos para ser visualizados por el componente.
TipoString
UsomyFlashShop.xmlPath = "data/products.xml";
ImplementaciónSólo Escritura
19
totalCounter propiedad
DescripciónMuestra el numero de la cantidad de items en el carro de compras.
TipoBoolean
UsomyFlashShop.totalCounter = false;
ImplementaciónSólo Escritura.
withSearch propiedad
Descripciónmuestra la opción de búsqueda de productos.
TipoBoolean
UsomyFlashShop.withSearch = true;
ImplementaciónSólo Escritura.
withVAT propiedad
Descripciónhabilita la opción de IVA para los productos.
TipoBoolean
UsomyFlashShop.withVAT = true;
20
ImplementaciónSólo Escritura.
withTerms propiedad
Descripciónhabilita la opción de Términos y Condiciones para los productos.
TipoBoolean
UsomyFlashShop.withTerms = true;
ImplementaciónSólo Escritura.
showCategoryByDefault propiedad
DescripciónEspecifica si se mantendrá abierta la lista de categorías por defecto. valor por de-fecto es false
TipoBoolean
UsomyFlashShop.showCategoryByDefault = true;
ImplementaciónSólo Escritura.
itemSelected propiedad
DescripciónDevuelve el producto seleccionado.
Usotrace(myFlashShop.itemSelected);
21
ImplementaciónSólo Lectura.
selectedIndex propiedad
Tipouint
DescripciónDevuelve el indice del producto seleccionado.
Usotrace(myFlashShop.selectedIndex);
ImplementaciónSólo Lectura.
categorySelected propiedad
DescripciónDevuelve la categoria seleccionada.
Usotrace(myFlashShop.categorySelected);
ImplementaciónSólo Lectura.
categorySelectedIndex propiedad
Tipouint
DescripciónDevuelve el indice de la categoría seleccionada.
Usotrace(myFlashShop.categorySelectedIndex);
22
ImplementaciónSólo Lectura.
withPayPal propiedad
TipoBoolean
DescripciónIndica si FlashShop tendrá la opción de pago por paypal.
UsomyFlashShop.withPayPal = true;
ImplementaciónSólo Escritura.
withOrderForm propiedad
TipoBoolean
DescripciónIndica si FlashShop tendrá la opción de pago por orden de compra.
UsomyFlashShop.withOrderForm = true;
ImplementaciónSólo Escritura.
VAT propiedad
TipoNumber
Descripción
23
Indica el valor del IVA en porcentaje.
UsomyFlashShop.VAT = 16;
ImplementaciónSólo Escritura.
labels propiedad
DescripciónDefine la configuración de los textos del Componente.
Currency CurrencySymbolTitleCartTitleListLabelTotalCartCartButtonAddButtonLabelCheckoutButtonPayPalIDSaveLabelWasLabelFreeShippingShippingSubTotalLabelPayPalButtonLabelOrderFormButtonWasLabelSaveLabelLabelPopUpButtonLabelPopUpTitleQuantityPopUpTitleLabelOrderFormNameLabelOrderFormEmailLabelOrderFormCompanyLabelOrderFormAddressLabelOrderForm
24
CityLabelOrderFormCountryLabelOrderFormZipLabelOrderFormPhoneLabelOrderFormMessageLabelOrderFormSendButtonOrderFormResetButtonOrderFormNameErrorOrderFormEmailErrorOrderFormAddressErrorOrderFormCityErrorOrderFormCountryErrorOrderFormCategoriesLabelProductsLabelNoProductFoundPHPOrderFormVATLabel
TipoObject
UsomyFlashShop.labels = { Paypal ID:[email protected], Currency:USD, CheckOut Button: CheckOut, Cart:Cart, Add:Add, Title Cart:Shopping Cart, Title List:Products};
ImplementaciónSólo Escritura.
25
Constantes
FlashShop.VERSION Constante publica
Descripciónsirve para saber la versión del producto.
TipoString
Usotrace(FlashShop.VERSION);
EventosFlashShopEvents.CATEGORY_CLICKED Constante
Descripciónsirve para detectar cuando se ha dado click sobre una categoria.
TipoString
Usoimport gT.display.flashShop.FlashShopEvents;
myFlashShop.addEventListener(FlashShopEvents.CATEGORY_CLICKED, clickHandler);
function clickHandler(e:Event){ trace(e.target); //Acciones}
26
FlashShopEvents.PRODUCT_CLICKED Constante
Descripciónsirve para detectar cuando se ha dado click sobre un item (producto).
TipoString
Usoimport gT.display.flashShop.FlashShopEvents;
myFlashShop.addEventListener(FlashShopEvents.PRODUCT_CLICKED, clickHandler);
function clickHandler(e:Event){ trace(e.currentTarget); //Acciones}
27
XMLEstructura:
28
1. Nodo principal FlashShop donde se configuran las propiedades globales2. Strings, nodo para configurar los títulos, etiquetas y nombres del FlashShop3. Swatches, nodo donde se establecen los colores para las variaciones4. Variations, aquí se configuran todas las posibles variaciones generales para los
productos5. categories, nodo principal donde se agrupan las categorías6. category, nodo que define una categoría de productos7. product, hace referencia a un producto del FlashShop
29
Etiquetas XMLLa siguiente tabla muestra las principales etiquetas que contiene el xml.
Etiqueta Descripción Hijos
flashShop Es la etiqueta principal de todo el XML Si
stringsContiene etiquetas que definen la configuración de los textos del Componente. Si
stringDefine algún tipo de configuración de los textos del Componente dependiendo del ID. No
swatches Contiene etiquetas que definen la configuración de los colores en las variaciones Si
color Define los tipos de colores No
variations Contiene etiquetas que definen la configuración de las variaciones de los productos. Si
variation Define los tipo de configuración en las variaciones de los productos. No
categories es la etiqueta principal donde se agrupan las catego-rías. Si
category Contiene un conjunto de etiquetas product que con-forman una lista de productos. Si
product Define el inicio de la estructura de la etiqueta para la creación de un producto. Si
title Define el Titulo del Producto. No
paragraph Define la descripción del Producto. No
images Contiene etiquetas que indican imágenes del producto. Si
image indica una imagen del producto. No
30
Descripción de las EtiquetasflashShop
Descripción
Es la Etiqueta principal de todo el XML.
Atributos
Nombre Tipo Descripción
width NumberDefine la anchura del componente, expresada en pixeles.
height NumberDefine la altura del componente, expresada en pi-xeles.
viewerWidth NumberDefine la anchura del Visualizador del componente, expresada en pixeles.
viewerHeight NumberDefine la altura del Visualizador del componente, expresada en pixeles.
thumbWidth NumberDefine la anchura de todas las Vistas Previas del componente.
ThumbHeight NumberDefine la altura de todas las Vistas Previas del componente.
widthProductList NumberDefine la anchura de la lista de productos del componente.
shop BooleanPermite la activación del modo de venta de pro-ductos en el componente. La propiedad shop tie-ne valor por defecto true.
globalColor1 uintDefine el color primario del componente, expresa-do en formato hexadecimal. La propiedad global-Color1 tiene valor por defecto 0x82ae07.
31
Nombre Tipo Descripción
globalColor2 uintDefine el color secundario del componente, expre-sado en formato hexadecimal. La propiedad glo-balColor2 tiene valor por defecto 0xFFFFFF.
reel-BackgroundCo-lor
uintColor del reel del componente, expresado en for-mato hexadecimal. Por ejemplo, el color negro es 0x000000; el color blanco es 0xFFFFFF.
textColorHeader uint
Recibe o define el color de las Cabeceras del componente, expresado en formato hexadecimal. La propiedad textColorHeader tiene valor por de-fecto 0x000000.
textColorList uint
Define el color de la Lista de productos del com-ponente, expresado en formato hexadecimal. La propiedad textColorList tiene un valor por defecto 0x2b3a01.
wasColor uintDefine el color del label “was” expresado en forma-to hexadecimal. Valor por defecto es 0x999999.
saveColor uintDefine el color del label “save” expresado en for-mato hexadecimal. Valor por defecto es 0xff0000.
shippingColor uintDefine el color del label “shipping” expresado en formato hexadecimal. Valor por defecto es 0x79B51C.
VATColor uintDefine el color del label “VAT” expresado en forma-to hexadecimal.
t e x t C o l o r D e s-cription
uint
Define el color del Area de Texto que describe el producto en el componente, expresado en formato hexadecimal. La propiedad textColorDescription tiene un valor por defecto 0x909090.
32
Nombre Tipo Descripción
roundCorners Boolean
Indica el estilo de visualización del componente, si desea verlo con esquinas redondas o con esqui-nas cuadradas. La propiedad roundCorners tiene valor por defecto true.
maxReel I tems-Displayed
uint
Define el numero máximo de Vistas Previas que se visualizarán en el Reel del componente. La pro-piedad maxReelItemsDisplayed tiene valor por defecto 3.
withShipping BooleanIndica si los productos tendrán opción de costo de envío
shippingCharge NumberDefine el monto del costo de envio general para todos los productos
withSearch BooleanIndica si FlashShop tendrá la opción de búsqueda para los productos
withPayPal BooleanIndica si FlashShop tendrá la opción de pago por paypal.
withOrderForm BooleanIndica si FlashShop tendrá la opción de pago por orden de compra
withVAT BooleanIndica si FlashShop tendrá la opción de IVA por los productos
VAT Number Establece el valor del IVA para los productos
withTerms BooleanIndica si FlashShop tendrá la opción de Términos y condiciones para los productos
showCate-goryByDefault Boolean
Especifica si se mantendrá abierta la lista de cate-gorías por defecto. valor por defecto es false
Ejemplo:
33
<flashShop shop="true" globalColor1="0x82ae07" globalColor2="0xFFFFFF" roundCorners="true">
strings
Descripción
Contiene etiquetas que definen la configuración de los textos del Componente
string
Descripción
Define la configuración de los textos del Componente dependiendo del id.
Listado admitidos para atributo id:
CURRENCYCURRENCY_SYMBOLLABEL_CHECKOUT_BUTTONLABEL_PAYPAL_BUTTONLABEL_ORDER_FORM_BUTTONSHIPPINGSUBTOTALLABEL_CART_LABELLABEL_ADD_CARTTITLE_CARTTITLE_HEADER_PRODUCT_LIST PAYPAL_IDWAS_LABELSAVE_LABELLABEL_POPUP_BUTTONLABEL_POPUP_TITLELABEL_ADD_CARTQUANTITY_POPUPNAME_LABEL_ORDER_FORMEMAIL_LABEL_ORDER_FORMCOMPANY_LABEL_ORDER_FORMADDRESS_LABEL_ORDER_FORMCITY_LABEL_ORDER_FORM
34
COUNTRY_LABEL_ORDER_FORMZIP_LABEL_ORDER_FORMPHONE_LABEL_ORDER_FORMMESSAGE_LABEL_ORDER_FORMSEND_BUTTON_ORDER_FORMRESET_BUTTON_ORDER_FORMNAME_ERROR_ORDER_FORMEMAIL_ERROR_ORDER_FORMADDRESS_ERROR_ORDER_FORMCITY_ERROR_ORDER_FORMCOUNTRY_ERROR_ORDER_FORMCATEGORIES_LABELPRODUCTS_LABELNO_PRODUCTS_FOUNDPHP_ORDER_FORMVATLABEL_AGREE_BUTTONLABEL_DISAGREE_BUTTON
Atributos
Nombre Tipo Descripción
id Stringindica la propiedad a la que se le va a modificar el texto
Ejemplo
<strings> <string id="LABEL_CHECKOUT_BUTTON">Checkout</string> <string id="LABEL_CART_LABEL">View Cart</string> <string id="LABEL_ADD_CART">Add</string> <string id="TITLE_CART">Shopping Cart</string> <string id="TITLE_HEADER_PRODUCT_LIST">Products</string> <string id="CURRENCY">USD</string> <string id="PAYPAL_ID">[email protected]</string> <string id="WAS_LABEL">Was</string>
35
<string id="SAVE_LABEL">Save</string> <string id="BUTTON_POPUP_LABEL">accept</string> <string id="TITLE_POPUP_LABEL">Product Variations</string></strings>
swatches
Descripción
Contiene etiquetas que definen la configuración de los colores en las variaciones.
color
Descripción
Define los tipos de colores.
Atributos
Nombre Tipo Descripción
name String hace referencia al nombre del color
code String hace referencia al valor hexadecimal del color
variations
Descripción
Contiene un conjunto de etiquetas variation que conforman una lista de variacio-nes para todos los productos.
variation
Descripción
Indica el inicio de la estructura de la etiqueta para la definición de una variación del los productos.
Atributos
36
Nombre Tipo Descripción
name String hace referencia al nombre de la variación
items String hace referencia a los valores de la variación
Ejemplo
<variations> <variation name="color" items="red, green, black, blue"/> <variation name="size" items="S, M, L, XL"/></variations>
categories
Descripción
Es la etiqueta principal donde se agrupan las categorías.
category
Descripción
Contiene un conjunto de etiquetas product que conforman una lista de productos.
product
Descripción
Define el inicio de la estructura de la etiqueta para la creación de un producto.
Atributos
Nombre Tipo Descripción
id String hace referencia a la identificación del producto
preview Stringdefine la ruta de ubicación de la imagen que repre-senta al producto ( vista previa ).
37
Nombre Tipo Descripción
label String hace referencia al titulo del producto
price Number hace referencia al precio del producto
discountPercent Numberhace referencia al descuento del producto sobre el precio expresado en porcentaje
zoom Boolean Habilita la opción de zoom para los productos
withVariation Boolean Define si el producto tendrá o no variaciones
shippingCharge NumberEspecifica el cargo de envio del productoSi el producto es free shipping debera colocar 0 o evite colocar esta propiedad en el producto
tags StringEspecifica palabras claves para que el producto sea encontrado fácilmente por el buscador
Ejemplo
<product id="0001" preview="01.jpg" label="Blue Marble Mug" price="10.99" discountPercent= "20" zoom= "false" >
title
Descripción
Define el titulo del producto.
Ejemplo
<title><![CDATA[Blue Marble Mug]]></title>
paragraph
Descripción
Define la descripción del producto.
38
Ejemplo
<paragraph><![CDATA[sed congue nunc laoreet vitae. ante orci dignissim enim, vel consequat]]></paragraph>
images
Descripción
Contiene etiquetas que indican las imágenes del producto. A partir de esta etique-ta se inicia la creación de la galería de imágenes para los productos del compo-nente.
Atributos
Nombre Tipo Descripción
tnPath Stringhace referencia a la ruta donde se encuentran las vistas previas.
lgPath Stringhace referencia a la ruta donde se encuentran las imágenes que pueden ser ampliadas (imágenes grandes).
Ejemplo
<images tnPath="images/tn/" lgPath="images/lg/">
image
Descripción
indica una imagen del producto.
Atributos
39
Nombre Tipo Descripción
url Stringhace referencia al nombre o ruta de la imagen, esta ruta se concatenará con los atributos tnPath y lgPath del nodo images.
externalLink Stringhace referencia a un link externo al presionar la imagen del producto
target StringEspecifica si el link abre en una nueva ventana o en la misma.
Ejemplo
<image url="01.jpg" externalLink=”http://flashden.net/user/goTo/portfolio” target=”_blank”/><image url="02.jpg"/>
40
Paso a pasoEn este tema se creará un archivo XML para FlashShop.
1. Configurar el nodo principal del XML: En el siguiente ejemplo se muestra como configurar los atributos del nodo principal.
<flashShop shop="true" roundCorners="true" globalColor1="0x82ae07"> <!-- Contenido --></flashShop>
2. Configurar las etiquetas de texto: Si desea puede personalizar las etiquetas de texto de esta forma (ver mas).
<flashShop shop="true" roundCorners="true" globalColor1="0x82ae07"> <strings> <string id="CURRENCY">USD</string> <string id="LABEL_CART_LABEL">Cart</string> <string id="LABEL_ADD_CART">Add</string> </string></flashShop>
3. Configurar los colores de las variaciones
<flashShop shop="true" roundCorners="true" globalColor1="0x82ae07">
<strings> <string id="CURRENCY">USD</string> <string id="LABEL_CART_LABEL">Cart</string> <string id="LABEL_ADD_CART">Add</string> </string> <swatches> <color name="green" code="0x79B51C" /> <color name="darkGreen"code="0x006600" /> <color name="red" code="0xff0000" /> </swatches></flashShop>
41
4. Definir las variaciones generales
<flashShop shop="true" roundCorners="true" globalColor1="0x82ae07"> <strings> <string id="CURRENCY">USD</string> <string id="LABEL_CART_LABEL">Cart</string> <string id="LABEL_ADD_CART">Add</string> </string> <swatches> <color name="green" code="0x79B51C" /> <color name="darkGreen"code="0x006600" /> <color name="red" code="0xff0000" /> </swatches> <variations> <variation name="color" items="red, green, blue, black" /> <variation name="size" items="S, M, L, XL"/> </variations>
</flashShop>
5. Definir una categoria
<flashShop shop="true" roundCorners="true" globalColor1="0x82ae07"> <strings> <string id="CURRENCY">USD</string> <string id="LABEL_CART_LABEL">Cart</string> <string id="LABEL_ADD_CART">Add</string> </string> <swatches> <color name="green" code="0x79B51C" /> <color name="darkGreen"code="0x006600" /> <color name="red" code="0xff0000" /> </swatches> <variations> <variation name="color" items="red, green, blue, black" /> <variation name="size" items="S, M, L, XL"/> </variations> <categories> <category name="Mugs" withVariation="false">
42
</category> </categories>
</flashShop>
6. Agregar productos: Los productos se agregan en el nodo <category> de la siguiente forma.
<flashShop shop="true" roundCorners="true" globalColor1="0x82ae07"> <strings> <string id="CURRENCY">USD</string> <string id="LABEL_CART_LABEL">Cart</string> <string id="LABEL_ADD_CART">Add</string> </string> <swatches> <color name="green" code="0x79B51C" /> <color name="darkGreen"code="0x006600" /> <color name="red" code="0xff0000" /> </swatches> <variations> <variation name="color" items="red, green, blue, black" /> <variation name="size" items="S, M, L, XL"/> </variations> <categories> <category name="Mugs" withVariation="false"> <product id="0001" preview="images/products/tn/02.jpg" label="0001" price="8.50" dis-countPercent="10" withVariation="true" shippingCharge="3" tags="green, mugs"> <title><![CDATA[Green Marble Mug]]></title> <paragraph><![CDATA[Lorem ipsum iat nulla pa-riatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.]]></paragraph> <images tnPath="images/products/mugs/green_marble_mug/tn/" lgPath="images/products/mugs/green_marble_mug/lg/"> <image url="01.jpg"/> <image url="03.jpg"/> </images> </product>
43
</category> </categories></flashShop>
44
PHP
FlashShop cuenta con un script php el cual permite el envío de los correos para la persona que compra y la que vende si se usa el formulario como opción de pago. Este también es el encargado de manejar el numero de la orden de compra.
Este script es totalmente personalizable, cuanta con una variable donde se guar-dan todos los STRINGS y datos necesarios para el correcto envío de los correos.
Aquí esta la lista detallada de los strings que se pueden modificar:
Nombre Descripción
store_name Es el nombre de la tienda.
subject Titulo del email que llegará al correo del vendedor.
mailBuyer Email del vendedor
mailSellerEmail del comprador (éste es modificado automaticamente cuando el cliente llena el formulario).
subjectForBuyer Titulo del email que llegará al correo del comprador.
order_number Etiqueta para el numero de la orden.
date Etiqueta para la fecha de envio de la orden.
to Etiqueta “para”.
zip Etiqueta “ZIP”
description Etiqueta “Descripción”
price_label Etiqueta que representa el precio unitario.
quantity Etiqueta que representa la cantidad de un producto.
amount_label Etiqueta que representa el valor total de los productos
45
Nombre Descripción
subtotalEtiqueta que representa la sumatoria del valor de los produc-tos.
shippingEtiqueta que representa la sumatoria del valor de envio de los productos.
total Etiqueta que representa el total de la compra.
notesEtiqueta que representa la sección de las observaciones del cliente.
Ejemplo:
//order_form.php
$strings = array(
'store_name' => 'Mi Tienda Virtual', 'subject' => 'Nueva compra en mystore.com', 'mailBuyer' => $_POST['email'], // no se debe tocar 'mailSeller' => '[email protected]', 'subjectForBuyer' => 'Tu orden realizada en mystore.com', 'order_number'=>'Numero de Orden', 'date'=>'Fecha:', 'to'=>'Para: ', 'zip'=>'Código ZIP:', 'description'=>'Descripción', 'price_label'=>'Precio Unit.', 'quantity'=>'Cant.', 'amount_label'=>'Importe', 'subtotal'=>'Subtotal', 'shipping'=>'Costo Envío', 'total'=>'Total', 'notes'=>'Observaciones: ');
46
Con este capitulo cerramos la ayuda para la utilización de este componente. Dis-frutalo y hasta la próxima.
47
Créditos
© 2009 Derechos reservados goTo! Multimedia.
Cartagena Colombia.Alpes Transversal 73 No. 31-A 46 Local 101.Teléfono: (+57) 5 653 2788, [email protected]
Sólo venta exclusiva en FlashDent.net.
48