Pages

Subscribe:

Ads 468x60px

Labels

24/10/2012

Mascara para formulários em JQuery


Publicado em 26 de maio de 2011 - No site: jquerymagazine.com.br
Olá Pessoal,
Neste  artigo vamos ver como colocar máscara em campos do seu formulário, usando jQuery, e o plugin maskedinput.
Vamos utilizar o jQuery na página e o plugin maskedinput.
Aproveito para agradecer as pessoas que estão dando força, seja por e-mail, twitter como nosso amigo Rodrigo Costa, e aqueles que seguem a @jqmagazine.

Importamos nossa biblioteca jQuery e o plugin


Script jQuery


Nosso formulário



 
Primeiramente é feita a inclusão dos arquivos javascript, coloquei o link para que vocês possam fazer o download.
Depois criarmos a função para criar a mascara, notem que passei a forma que o campo irá ser formatado, sempre com número máximo 9.
Depois criamos um simples formulário, mas em cada campo, precisamos referenciar a ID, para a nossa função saber qual campo ele está formatando.

Veja um exemplo aqui:
Espero que tenha sido útil e não esqueça de seguir este BLOG! :)

18/10/2012

Tutorial de Administração do VirtueMart 2.0 - Joomla 1.7 / 2.5

Este tutorial destina-se à  configurar o Virtuemart 2 em Joomla 1.7 e 2.5. Vamos ver como instalar e configurar a versão mais recente do Virtuemart no Joomla 1.7 / 2.5. Configurar as definições gerais para informações da loja, moedas, métodos de pagamento e frete, etc. Além disso, veja as ferramentas de migração, atualização e gerenciamento de banco de dados que tem o componente.
O primeiro passo é descarregar o componente do seu site oficial e instalá-lo da maneira normal.
Depois de instalar o componente irá acessar o painel de controle de "Componentes> Virtuemart."

A primeira coisa que devemos fazer é definir a extensão, acessando o "Configuração".

Se formos para a subseção de mesmo nome, vai encontrar vários separadores (abas):
·         Sobre o "Shop" (Loja) nós colocamos a nossa loja online e escrever uma mensagem informativa, permitindo seu uso apenas como um catálogo, mudar o formato da data, ativar a depuração, etc
·         Se vamos para a aba "Shopfront" (Vitrine) encontrar um grande número de parâmetros a configurar.
Aqui em “Shopfront” (Vitrine) vai ter a opção para habilitar o botão pdf, o link para" recomendar a um amigo ", que permitirá o uso de cupons e estabelecer a sua duração, selecione as unidades padrão de medição, etc.

A partir da "Sistema de Comentários/Avaliações dos Clientes" irá beneficiar as opções de revisão e avaliação de artigos. Decida que tipo de usuários pode avaliar nossos produtos, votar neles e dar sua opinião.

Ainda na aba “Vitrine”, temos as configurações de “Ação quando um Produto sesta sem estoque”.  Definimos como o sistema se comportará quando não temos produtos em estoque para ser vendido, se vamos permitir que eles sejam vendidos mesmo assim, se eles serão automaticamente ocultados da loja ou se haverá uma imagem de aviso substituta.

Clicando-se na aba “Tema” temos o item "Shopfront Settings" (Configurações da Vitrine), selecione as categorias padrão de modelo e loja, escolha o número de categorias e produtos a serem exibidos em cada linha, mostrar o fabricante do produto, número de categorias em uma linha, número de produtos em uma linha, e assim por diante.

Para definir a página inicial do componente temos o "VirtueMart Homepage Mart Settings" (Configurações da Pagina Inicial do VirtueMart), onde podemos decidir se vamos exibir os mais recentes produtos, o top dez dos produtos, o número de elementos que vão fazer essa lista, Layout para a pagina, mostrar produtos em destaque, mostrar os recentes cadastrados (exemplos em Inglês e Português):

O último dos elementos deste guia é "Media Files Settings” (Configurações de arquivos de mídia). Aqui escrevemos o caminho para as imagens dos fabricantes, produtos e categorias. Irá definir o tamanho das miniaturas, etc. (exemplos em Inglês e Português)


·         Como último quadro de configuração para esta aba de “Temas” temos o quadro “Ativar Estilos CSS e Javascripts”, um importante recurso para melhorar a aparência e usabilidade de sua loja.  Recomendado habilitar todos os itens:

  • Na guia (aba) "Product Order Settings" (Configurações Ordenação de Produto) temos o bloco “Configurações de Ordem de Classificação de Produtos” que vai definir a ordem em que os produtos são exibidos no front-end, selecione os campos que os usuários podem classificar os itens e campos a serem pesquisados.


  • As opções relacionadas com o preço dos produtos, configurar a partir de "Pricing” (Preços). Aqui vamos decidir se queremos ou não mostrar os preços, ou só serão visíveis a determinados usuários, etc. Vamos também estabelecer o número de casas decimais e escolher os diferentes preços que os utilizadores podem visualizar (preço base, o preço base e modificação de taxa de preço, preço final, etc).


  • Em “Checkout” (Finalizar) temos o quadro “Checkout Settings” (Configurações de Finalização)  decidirá se para mostrar aos usuários a política de devolução, se você verificar o estoque, adicionando um produto ao carrinho de compras, perguntar aos usuários registrar a colocação de pedidos, mostrar o carrinho de compras em uma janela modal, habilitar a seleção automática de envio (entrega), habilitar seleção automática de formas de pagamento, etc.

  • Em "SEO" pode ativar ou desativar a otimização de motor de pesquisa, tradução de URLs e uso de IDs de produtos e categorias.

A subseção "Campos Shopper (Campos do comprador)" nos permitirá gerenciar as informações que os usuários devem fornecer ao se registrar em nosso site. Nós publicamos e despublicar campos a serem exibidos, marcá-los como necessários e selecionar as formas em que eles aparecem (entrega de registo, ou de manutenção).
Teremos também a opção de adicionar campos clicando no botão "Novo" e preencher os dados solicitados, como o tipo de campo, comprimento, número de colunas, etc.


Se quisermos "status Ordem" vamos ver uma lista de status diferente em que uma ordem pode ser classificada.


Nós adicionamos novo status, clicando no botão "Novo" e preencher as informações necessárias (nome, código, descrição, etc)


Em "cartões de crédito" vai ver os usuários de cartão de crédito podem utilizar em suas compras.


Adicionar novos cartões, clicando em "New" e preencha


A subseção "Moedas" vai mostrar a lista de moedas nas quais eles podem exibir preços dos produtos.


Nós adicionamos novo ou modificar os existentes, clicando no preço. Aqui vamos definir o nome da moeda, o valor da mudança, o número de casas decimais, separador de decimal e milhares, e assim por diante.


Em "países" vai ver os países que os usuários podem selecionar ao se registrar em nossa loja.


Para adicionar um novo país vai pressionar novamente e escrever as informações solicitadas.


Se você clicar em "Estados" link link ao lado do nome do país, podemos adicionar as províncias ou estados que compõem este país.


Para continuar o processo de instalação, iremos para o "Shop". Isto irá definir algumas opções que irão afetar a nossa loja e outros que afetam apenas Virtuemart vendedor global criado no momento da instalação.


  • Dentro da subseção de mesmo nome na aba "Vendor" escrever o nome da loja, a empresa, URL, selecione a moeda padrão, etc.


Podemos também adicionar uma imagem para o varejista global.


Além disso, incluímos uma breve introdução, que será na primeira página da loja e as condições de serviço.


  • Em "Informações Adicionais" modificar as permissões de vendedor global e pode mudar as informações de perfil (nome, endereço ...)


  • Mais dados podemos mudar o fornecedor, como senha de e-mail, ou o grupo do "utilizador informações gerais".


Se quisermos "Os arquivos de mídia" vai ver a lista de imagens disponíveis para link para os nossos artigos.


Se temos acesso as propriedades do arquivo, podemos mudar o seu nome, url, despublicarlos, etc.


Em "Métodos Shiping" ver métodos de envio configurados na loja.


Ao clicar em "Novo" vai criar um novo método de envio. Escreva o nome, a descrição, o grupo de usuários que podem utilizá-lo, etc.


Na "configuração" estabelecer as condições para o método de envio pode ser usado pelos clientes.Vamos escolher os países para os quais eles podem aplicar, a faixa de CEPs e peso, etc.


Para definir os métodos de pagamento que os compradores estarão disponíveis, vá para "Pagamento".Após clicar em "Novo", escrever o nome e escolher o grupo de usuários que podem usar este tipo de pagamento eo sistema a ser usado (método de pagamento). Os itens disponíveis para esta última opção dependerá dos plugins que você instalou.


Na "configuração" pode incluir as informações relativas ao pagamento.



Virtuemart 2 foi utilizado um conjunto de ferramentas que nos permitem realizar várias operações no banco de dados e tabelas para o componente.
Para utilizar essas ferramentas, temos que ir para "Configuração> Loja> Loja Configurações" e marque "Ativar ferramentas de banco de dados de atualização."


Se formos para "Ferramentas e Migração" guia "Ferramentas de DB" encontrar as ferramentas mencionadas.
O "Sincronizar metade para VirtueMart" vamos atualizar as imagens de nossa loja, sincronizando com os encontrados nos diretórios definidos em "Configuração / templates / arquivos de mídia configurações"


Se você clicar em "Renovar por arquivo de configuração", as configurações são alteradas em conformidade com o "administrador / / components / com_virtuemart / virtuemart.cfg".

Além dessas duas opções, temos um outro conjunto de ferramentas que irão atuar no banco de dados.Podemos restaurar as configurações iniciais do componente, apagar os dados e tabelas da loja, reinstalar os dados da amostra, etc.

Na guia "Migração" pode migrar da versão 1.1 para a versão 2 Virtuemart. Para realizar este processo, deverá clicar em "Iniciar Migração", embora seja necessário rever a seção de pré-migração na documentação do componente.

Finalmente, na barra lateral vai ver um componente de botão a partir do qual podemos instalar Virtuemart 2 atualizações assim que forem publicadas. Se não temos as atualizações serão instaladas, uma mensagem irá avisá-nos que devemos instalá-los.


Para atualizar, vamos pressionar o botão e acessar uma nova tela na qual você pode instalar a atualização direta ou baixar para instalar mais tarde a partir do gerenciador de extensões Joomla.


Após a atualização do componente, podemos ver que o botão na barra lateral mudou, agora nos dizendo que tudo está correto.


Recursos e extensões para VirtueMart - <http://extensions.joomla.org/search?q=virtuemart>
Diretório de instalação do VirtueMart - <http://dev.virtuemart.net/projects/virtuemart/files>