Requisitos
- Pluguin ImputMask (http://cckjoomla.org/downloads/viewdownload/5-plugins/14-input-mask-para-joomla-3-x-e-seblod-3-x)
- funcao Js para busca de CEP - cepw.js
- Lib do google Maps - gmaps.js
Procedimentos
- Usaremos o cadastro de usuários para fazermos o Override.
- Como sabemos, em “Form & Content Type” , temos as opcoes Admin Form, Site Form, Intro e Content. Usaremos o Site Form para fazer nossas inclusoes de campo.
- Antes de comecarmos , devemos instalar o InputMask citado acima, pois usaremos os campos do tipo CEP e telefone , com o facilitador da mascara deste controle.
- Feito isso, abrimos nosso “Form & Content Type”, e clicamos em Site Form e criamos os campos conforme a figura.
- Feito isso, vamos criar nosso Override. Criamos um arquivo Mainbody.php dentro do caminho nome_do_sitetemplatesseb_onepositionsusersite.
- Usamos a pasta “user” pq ela e o nome do alias. Caso o seu seja diferente ou vc esteja criando em um outro Form & Content Type, e so mudar o caminho.
- A segunda pasta “site”, e devido a termos incluido os campos no “Site Form”, dentre as opcoes da View do “Form & Content Type”.
- Fazendo o Override dos campos.
- Inlusao das “libs” js no seu override (copiar os arquivos mencionados no “REQUISITOS” para o caminho abaixo)
<script type="text/javascript" src="/https://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="/templates/nome_do_seu_template/js/gmaps.js"></script>
<script type="text/javascript" src="/templates/nome_do_seu_template/js/cepw.js"></script>
- Inclusao da funcao que vai executar o CEP
<script>
jQuery(function() {
wscep({auto:false,'map':'map1'})
})
</script>
- Montagem do “Esqueleto” do seu Override
</head>
<body>
<div class="container_12">
<div class="grid_12 form-cep">
<form onsubmit="return false">
<div class="grid_4">
<div>
<?php echo $cck->renderfield('user_name'); ?>
</div>
<div>
<?php echo $cck->renderfield('user_username'); ?>
</div>
<div>
<?php echo $cck->renderfield('cep'); ?>
</div>
<div class="input-prepend cep-label">
</div>
<div>
<?php echo $cck->renderfield('endereco'); ?>
</div>
<div>
<?php echo $cck->renderfield('numero'); ?>
</div>
<div>
<?php echo $cck->renderfield('bairro'); ?>
</div>
<div>
<?php echo $cck->renderfield('cidade'); ?>
</div>
<?php echo $cck->renderfield('sub'); ?>
</div>
</div>
<div class="grid_7 map" id="map1"></div>
</div>
</form>
<div class="grid_12">
- Explicacao do Esqueleto
- <div class="container_12"> Container principal para “abrigar” todos seus controles
- <div>
<?php echo $cck->renderfield('cep'); ?>
</div>
<div class="input-prepend cep-label">
</div> /// Controles de entrada de dados e o botao de busca . O campo cep, devera ser o nome que vc atribuiu ao seu campo Seblod para armazenar esta informacao.
- </div>
<div class="grid_7 map" id="map1"></div>
</div> ///// Controle para Exibir o mapa no seu Mainbody.php
Segue link do projeto pronto com os arquivos