Shopping Cart Extension: Configurando a Página do Carrinho de Compras

Configurando a Página do Carrinho de Compras

A página do carrinho de compras é aquela que simplesmente contém a tabela que mostra o conteúdo do carrinho de compras e calcula um total dos itens. Ela pode incluir outros recursos opcionais para a interação dos consumidores, tais como botões de atualização ou esvaziar o carrinho, ou ainda, um formulário para coletar informações do consumidor.

Para configurar a página do carrinho de compras, siga estes passos:

Copiar o carrinho de compras para a página

Incluindo a tabela HTML para mostrar o conteúdo do carrinho

Incluindo interações costumizadas

Copiar o carrinho de compras para a página
Você pode seguir os mesmos passos como abordados em Configurando a Página de Produto para adicionar o carrinho de compras na página ou pode simplesmente copiar e colar o carrinho de compras que configurou na Página de Produto para a Página de Visualização do Carrinho de Compras.

Nota: O carrinho de compras precisa ser idêntico (ou seja, ele precisa conter as mesmas colunas) nas duas páginas. Se você alterar o carrinho de compras em uma das páginas, lembre de alterar em todas as outras nas quais ele aparece.

Para copiar e colar o carrinho de compras:

1 Abra a Página de Produto (ou a página na qual configurou o carrinho), e abra o painel de Ligações de dados, se não estiver aberto ainda.

2 Selecione a fonte de dados do Shopping Cart.

3 Clique no botão com uma seta no canto superior direito do painel e selecione Copiar no menu pop-up.

4 Abra a página de Visualização do Carrinho (ou a página a qual você quer colar o código do carrinho de compras).

5 Clique no botão com a seta no canto superior direito do painel e selecione Colar no menu pop-up.

Incluindo a tabela HTML para mostrar o conteúdo do carrinho
Para mostrar o conteúdo do carrinho de compras, você pode usar uma simples tabela HTML. Você liga as colunas da tabela às colunas do carrinho de compras, e finalmente, adiciona o comportamento Cart Repeat Region na tabela.

Para mostrar o conteúdo do carrinho :

1 Selecione Inserir> Tabela, ou arraste o objeto tabela, da paleta de objetos, para a janela do documento.

2 Na caixa de diálogo Inserir Tabela, para opção Linhas, selecione 2 se deseja mostrar o cabeçalhos da tabela, ou 1 se não desejar cabeçalho na tabela.

3 Entre e formate os cabeçalhos na primeira linha, se desejar.

4 Abra o painel de Ligações de dados (Janelas > Ligações de dados) se não estiver aberto. Abra a fonte de dados Shopping Cart.

5 Clique dentro da célula da tabela e, no painel de Ligações de dados, selecione a coluna que deseja que apareça no carrinho de compras; então clique Inserir. Repita a ligação para cada célula da tabela com a coluna do carrinho as quais você quer mostrar.

Se desejar que os consumidores sejam capazes de alterar as quantidades e atualizar o carrinho, use o campo de texto (edit box) como elemento de formulário, em quantidade e ligue este à coluna Quantity do carrinho de compras. Não insira um campo de formulário na célula; Primeiro você deve colocar um campo de formulário na página e depois inserir a tabela do carrinho de compras dentro do formulário, sendo assim toda a tabela estará dentro do formulário. (Veja: Alterando a quantidade e atualizando o carrinho de compras.)

6 Finalmente, inclua o comportamento Cart Repeat Region. Selecione a linha da tabela dinâmica que está ligada ao carrinho de compras. No painel de Comportamentos de servidor, clique (+) e selecione Shopping Cart > Cart Repeat Region Region.

Nota: O comportamento Cart Repeat Region é específico ao carrinho de compras. Ele é semelhante ao comportamento do servidor Repeat Region usado nas tabelas dinâmicas, mas você precisa estar certo de estar usando a versão do Shopping Cart neste momento.

Depois de ter configurado as ligações, você poderá testar seu carrinho de compras visualizando o resultado na página de Visualização do Conteúdo do Carrinho de Compras.

Incluindo interações costumizadas
Interações costumizadas podem ser incluídas:

Alterando a quantidade e atualizando o carrinho de compras

Esvaziando o carrinho

Redirecionar se estiver vazio

Para diponibilizar estas interações, use os comportamentos de servidor do Shopping Cart.

Alterando a quantidade e atualizando o carrinho
Você pode incluir um recurso ao carrinho de compras que permite ao usuário alterar a quantidade de itens em seu carrinho e atualizar o conteúdo do mesmo, mostrando as alterações solicitadas.

Para permitir aos usuários alterar a quantidade e atualizar o carrrinho:

1 Insira um campo de formulário na página e araste a tabela que mostra o carrinho para dentro do formulário.

2 Use um campo de texto (edit box) para a coluna que mostra a quantidade no carrinho. (Ver: Incluindo uma tabela HTML para mostrar o conteúdo do carrinho .) Se você ainda não fez isto, você pode editar o campo que mostra a quantidade, para que ele contenha um campo de texto - Inserir > Objeto de Formulário > Campo de Texto.

Se você não inseriu o objeto de formulário ainda, será perguntado se deseja fazê-lo, responda NÃO, pois se responder sim, o objeto de formulário será inserido dentro da célula da tabela, ao invéz de incluir a tabela inteira dentro dele.

3 Adicione um botão de formulário na página (mas não dentro da tabela). No painel de Propriedade, dê ao botão um nome e etiqueta apropriados, tal como "Atualizar o carrinho" ou "Recalcular".

O tipo de botão precisa ser Enviar (Action = submit form).

4 Selecione a caixa de edição da quantidade. No painel de Comportamentos de servidor, clique (+) e selecione Shopping Cart > Update Cart.

Note que você aplicou o comportamento de servidor à caixa de edição da quantidade e não no botão. O botão irá enviar o formulário e automaticamente realizar a ação de atualizar o carrinho.

5 Na caixa de diálogo, escolha o nome do formulário e do objeto do formulário (o nome que você deu para a caixa de edição da quantidade).

6 Se desejar redirecionar o usuário após atualizar o carrinho, entre com o URL ou procure a página e selecione-a. Se desejar que a página apenas seja recarregada e atualizada (refresh) com os novos valores do carrinho de compras, deixe este campo em branco e dê OK.

Teste este recurso incluindo alguns itens no carrinho e então, altere a quantidade no campo correspondente e clique no botão "Recalcular". Para apagar o item do carrinho, entre com quantidade = 0.

Esvaziar o carrinho
Você pode permitir aos consumidores a possibilidade de apagar todo o conteúdo do carrinho. O link pode ser através de texto ou imagem.

Incluir um link para esvaziar o carrinho:

1 Na página que mostra o carrinho de compras, selecione o texto ou a imagem que servirá de link. Se não for selecionado nenhum item, um texto padrão "Empty cart" será criado na página.

2 No painel de Comportamentos de servidor, clique (+) e selecione Shopping cart > Empty cart.

Na caixa de diálogo que aparecer, o link de texto será mostrado. Você pode escolher um link de texto diferente, se assim desejar.

3 Se quiser redirecionar o usuário, após apagar e atualizar o conteúdo do carrinho, entre com o URL ou procure uma página, selecionando browse. Se desejar que a página apenas seja recarregada e atualizada (refresh) com os novos valores do carrinho de compras, deixe este campo em branco e dê OK.

Redirecionar se estiver vazio
Quando o carrinho estiver vazio, você pode redirecionar os consumidores para uma página que apresentará uma mensagem costumizada, ao invez de simplesmente, mostrar o carrinho vazio.

Redirecionamento costumizado quando o carrinho estiver vazio:

1 Crie uma página com a mensagem desejada ( exemplo: "Não existem itens em seu carrinho de compras").

2 Abra a página de visualização do conteúdo do carrinho. No painel de Comportamentos de servidor, clique (+) e selecione Shopping Cart > Redirect if empty.

3 Entre com o URL para direcionar ou clique no botão Browse, para selecionar a página desejada.

tradução: Geraldo A. Pagliarini

	Copiar o carrinho de compras para a página
	Incluindo a tabela HTML para mostrar o conteúdo do carrinho
	Incluindo interações costumizadas

1	Abra a Página de Produto (ou a página na qual configurou o carrinho), e abra o painel de Ligações de dados, se não estiver aberto ainda.
2	Selecione a fonte de dados do Shopping Cart.
3	Clique no botão com uma seta no canto superior direito do painel e selecione Copiar no menu pop-up.
4	Abra a página de Visualização do Carrinho (ou a página a qual você quer colar o código do carrinho de compras).
5	Clique no botão com a seta no canto superior direito do painel e selecione Colar no menu pop-up.

1	Selecione Inserir> Tabela, ou arraste o objeto tabela, da paleta de objetos, para a janela do documento.
2	Na caixa de diálogo Inserir Tabela, para opção Linhas, selecione 2 se deseja mostrar o cabeçalhos da tabela, ou 1 se não desejar cabeçalho na tabela.
3	Entre e formate os cabeçalhos na primeira linha, se desejar.
4	Abra o painel de Ligações de dados (Janelas > Ligações de dados) se não estiver aberto. Abra a fonte de dados Shopping Cart.
5	Clique dentro da célula da tabela e, no painel de Ligações de dados, selecione a coluna que deseja que apareça no carrinho de compras; então clique Inserir. Repita a ligação para cada célula da tabela com a coluna do carrinho as quais você quer mostrar.
	Se desejar que os consumidores sejam capazes de alterar as quantidades e atualizar o carrinho, use o campo de texto (edit box) como elemento de formulário, em quantidade e ligue este à coluna Quantity do carrinho de compras. Não insira um campo de formulário na célula; Primeiro você deve colocar um campo de formulário na página e depois inserir a tabela do carrinho de compras dentro do formulário, sendo assim toda a tabela estará dentro do formulário. (Veja: Alterando a quantidade e atualizando o carrinho de compras.)
6	Finalmente, inclua o comportamento Cart Repeat Region. Selecione a linha da tabela dinâmica que está ligada ao carrinho de compras. No painel de Comportamentos de servidor, clique (+) e selecione Shopping Cart > Cart Repeat Region Region.

	Alterando a quantidade e atualizando o carrinho de compras
	Esvaziando o carrinho
	Redirecionar se estiver vazio

1	Insira um campo de formulário na página e araste a tabela que mostra o carrinho para dentro do formulário.
2	Use um campo de texto (edit box) para a coluna que mostra a quantidade no carrinho. (Ver: Incluindo uma tabela HTML para mostrar o conteúdo do carrinho .) Se você ainda não fez isto, você pode editar o campo que mostra a quantidade, para que ele contenha um campo de texto - Inserir > Objeto de Formulário > Campo de Texto.
	Se você não inseriu o objeto de formulário ainda, será perguntado se deseja fazê-lo, responda NÃO, pois se responder sim, o objeto de formulário será inserido dentro da célula da tabela, ao invéz de incluir a tabela inteira dentro dele.
3	Adicione um botão de formulário na página (mas não dentro da tabela). No painel de Propriedade, dê ao botão um nome e etiqueta apropriados, tal como "Atualizar o carrinho" ou "Recalcular".
	O tipo de botão precisa ser Enviar (Action = submit form).
4	Selecione a caixa de edição da quantidade. No painel de Comportamentos de servidor, clique (+) e selecione Shopping Cart > Update Cart.
	Note que você aplicou o comportamento de servidor à caixa de edição da quantidade e não no botão. O botão irá enviar o formulário e automaticamente realizar a ação de atualizar o carrinho.
5	Na caixa de diálogo, escolha o nome do formulário e do objeto do formulário (o nome que você deu para a caixa de edição da quantidade).
6	Se desejar redirecionar o usuário após atualizar o carrinho, entre com o URL ou procure a página e selecione-a. Se desejar que a página apenas seja recarregada e atualizada (refresh) com os novos valores do carrinho de compras, deixe este campo em branco e dê OK.

1	Na página que mostra o carrinho de compras, selecione o texto ou a imagem que servirá de link. Se não for selecionado nenhum item, um texto padrão "Empty cart" será criado na página.
2	No painel de Comportamentos de servidor, clique (+) e selecione Shopping cart > Empty cart.
	Na caixa de diálogo que aparecer, o link de texto será mostrado. Você pode escolher um link de texto diferente, se assim desejar.
3	Se quiser redirecionar o usuário, após apagar e atualizar o conteúdo do carrinho, entre com o URL ou procure uma página, selecionando browse. Se desejar que a página apenas seja recarregada e atualizada (refresh) com os novos valores do carrinho de compras, deixe este campo em branco e dê OK.

1	Crie uma página com a mensagem desejada ( exemplo: "Não existem itens em seu carrinho de compras").
2	Abra a página de visualização do conteúdo do carrinho. No painel de Comportamentos de servidor, clique (+) e selecione Shopping Cart > Redirect if empty.
3	Entre com o URL para direcionar ou clique no botão Browse, para selecionar a página desejada.