WP Manifestindependent plugin directory
manifest / integrations / simulator-widget

Simulator Widget

[WIP] Widget de simulador externo para WordPress

★ 3stars

Install

Download source zip No release zip yet

This is the repository archive. It installs, but the folder name will carry the branch suffix and updates will not flow.

Install straight from GitHub with WP-CLI:

wp plugin install https://github.com/frente-corretora/simulator-widget/archive/refs/heads/master.zip
No built-in updater. New versions won't appear under Dashboard → Updates. Install new releases yourself, or let Git Updater track the repository.

[WIP] Widget de simulador externo para WordPress

Este é um trabalho em progresso para a criação de um Widget de simulador de moedas externo da plataforma Simple, para CMS WordPress.

Change log

Clique aqui para acessar o histórico de correções.

Sobre o widget

O objetivo desse widget é proporcionar implementação agilizada de um simulador de moedas externo para os parceiros da plataforma Simple que possuem um website em WordPress.
O simulador conta com a funcionalidade de compra de papel moeda, envio e recebimento de remessas internacionais e redirecionamento para a Simple do próprio parceiro.

Com este repositório e apenas alguns ajustes no código você terá um simulador completo. Mas se preferir, pode criar e integrar seu próprio simulador externo, seguindo a documentação da nossa API, clicando aqui e aqui.

Tecnologias

O Widget foi desenvolvido utilizando PHP, HTML5, CSS3 e JavaScript, sendo:

  • PHP: Linguagem base do CMS WordPress, necessária para o funcionamento do widget;
  • HTML5: Criação da estrutura do simulador;
  • CSS3: Estilização do layout geral do simulador, com apoio da biblioteca Materialize;
  • JavaScript: Linguagem utilizada para a integração com a API, utilizando a biblioteca jQuery.

Instalação

  1. Clone esse repositório em algum local do seu explorador de arquivos. Se preferir, pode clonar diretamente no seu website, dentro do diretório wp-content/plugins.
  2. Abra seu editor de códigos preferido, pois vamos codar! \o

Primeiros passos

Este projeto ainda necessita de um pouco de mão na massa para a sua utilização, pois é necessário definir ID de correspondente e identificador no arquivo de configuração.

Cada parceiro Simple possui um ID único do tipo integer e um identificador do tipo string requisitados na API. Esses dados podem ser solicitados com a nossa equipe técnica, caso você não saiba o seu.

correspondent_identifier (String) é um nome, um identificador único para cada correspondente associado ao SIMPLE.

Exemplo: 'frente'

correspondentId (Integer) é o ID associado ao correspondente.

Exemplo: 1

  1. Abra o arquivo js/config.js e altere os valores das variaveis correspondent_id e correspondent_identifier nas linhas 1 e 3, respectivamente, para seus valores correspondentes:
    
    const correspondent_id = 1;

const correspondent_identifier = 'frente';



Com isso você já terá seu simulador externo funcionando corretamente e integrado com o seu próprio Simple! Basta inserir o widget no seu site onde preferir.

<p align="center">
<img width="379" height="372" src="https://cdn.cambioonline.com.br/2020/04/06145428/screenshot_61.png">
</p>

### Personalização
O simulador vem com cores e um layout pronto pra você só instalar seu widget e usar, mas é claro que com algumas alterações no CSS você pode adaptar as cores para o padrão do seu site. Basta realizar as alterações desejadas, salvar e subir a pasta para o diretório de plugins **wp-content/plugins**. 

As principais classes estão detalhadas com comentários e você pode trocar pelas cores que quiser, ou até mesmo alterar o formato e ordem dos elementos HTML.  
Exemplos:
<p align="center">
<img src="https://cdn.cambioonline.com.br/2020/04/06152720/colagem_simuladores.jpg">
</p>

O arquivo principal de CSS se encontra no diretório **css/main.css**, e também há uma folha de estilos em **materialize/css/materialize.css**

Dúvidas e sugestões? Manda uma mensagem para o nosso setor de relacionamento com o Correspondente: [support@frentecorretora.com.br](mailto:support@frentecorretora.com.br)