Este é um tutorial avançado, voltado para aqueles usuários que tenham algum conhecimento em HTML ou que ao menos tenham interesse em mexer com códigos.
Primeiramente, gostaria de ressaltar que NÃO é possível executar jQuery diretamente do Wix, pois o construtor não permite o manuseio dos códigos-fonte do site e nem dá suporte a transferências de arquivos via FTP.
Por outro lado, podemos rodar uma aplicação jQuery dentro de um site Wix, usando o app HTML do editor.
Pra quem não sabe, jQuery é uma linguagem de programação que tem como característica principal interagir com o HTML, criando aplicações com efeitos e animações visuais (veja exemplo).
Executar jQuery dentro de uma página Wix é mais fácil do que se imagina. O que mais dá trabalho é a edição do código jQuery, onde você precisará personalizá-lo conforme as informações do seu site, e o envio dos arquivos para uma hospedagem fora do Wix.
Usando outro servidor
Para que os arquivos jQuery possam ser executados, é necessário primeiro que eles sejam hospedados e um servidor que os leia e seja capaz de reproduzir seu comandos.
Você pode usar a hospedagem que quiser, seja paga ou grátis, o importante é que ela tenha suporte para arquivos jQuery.
Ucoz
Um servidor que achei conveniente foi o do construtor de sites Ucoz.com, ele permite a criação de uma conta GRÁTIS e oferece uma hospedagem com manuseio de arquivos por FTP.
Como fazer tudo, passo a passo
Agora vou mostrar todos os passos que você deve seguir para ter um arquivo jQuery rodando em seu site Wix.
Criando conta na Ucoz
1. Acesse a página de cadastro da Ucoz.
2. Insira um email e senha:
3. Insira seus dados:
4. Na outra página, ele exibirá uma mensagem de sucesso, pedindo apenas que você confirme seu email:
5. Após confirmar seu email, faça login na sua conta.
Depois, insira um nome para o site e clique no botão “Criar…“:
6. Na próxima tela, clique no botão “Continuar“:
Depois clique novamente em “Continuar” (não precisa selecionar mais nada).
7. Agora dentro do Painel, você verá uma tela como a seguinte:
8. Clique no link “Detalhes de FTP“:
9. Na pop-up que abrir, clique em “Senha não foi estabelecida“:
10. Informe uma senha, uma resposta para a pergunta secreta e clique em “Salvar“:
11. Feito isso, clique no link “Início” para voltar ao Painel:
12. Clique novamente em “Detalhes de FTP“:
13. Você verá os dados de FTP, com nome de Host, Usuário e a senha que você cadastrou:
14. Agora, usando um programa de gerenciamento de arquivos, como o FileZilla, insira os endereços do Host:
Segundo o exemplo:
- Host: meusitewx.ucoz.com.br
- Nome de usuário: pmeusitewx
- Senha: senha cadastrada.
Basta clicar em “Conexão Rápida” para entrar.
Obs: talvez seja necessário aguardar algumas horas (estima-se um prazo máximo de 24 horas) para que esse endereço FTP seja reconhecido.
Transferindo os arquivos jQuery para o Ucoz
Agora o que você precisa fazer é enviar os arquivos para o Ucoz pelo FTP, no Filezilla.
15. Baixe os arquivos jQuery. Os arquivos do exemplo deste tutorial, Galeria Portfólio, você pode baixar aqui, os quais já estão editados para um site Wix (ou pode fazer o download diretamente no site da Codrops).
16. Após isso, descompacte os arquivos.
17. Volte ao Filezilla e envie a pasta “GaleriaPortfólio” para a Ucoz:
Atenção: antes de enviar a pasta, edite os arquivos, adicionando links e imagens personalizados.
18. Quando a transferência terminar, volte ao Painel do Ucoz e clique no link “Gerenciador de arquivos“:
19. Ao entrar, você visualizará a pasta que enviou via FTP:
20. Clique sobre ela para abrir.
O Ucoz não aceita que arquivos .html sejam transferidos via FTP. Sendo assim, deveremos enviá-los manualmente.
Repare que os arquivos da Galeria Portfólio contém 3 pastas e 3 arquivos .html:
São esses “index” que deveremos enviar um por um, dentro do painel do ucoz.
21. Para isso, clique no botão “Escolher arquivo“:
22. Selecione um “index” (arquivo .html) e abra:
23. No Painel, clique na cruz verde para poder selecionar os outros dois arquivos. Ao terminar, clique em “Carregar“:
24. Veja que os arquivos .html foram todos enviados:
Copiando o link
25. Para ver a Galeria em funcionamento, clique sobre algum arquivo .html, surgirá uma janela, copie o link que aparecer (Ctrl+C) :
26. Dê ‘OK’ e cole este link em uma nova aba do navegador e observe se está funcionando corretamente.
Adicionando no Wix
27. Se tudo estiver OK, entre no seu site Wix, adicione um app HTML e escolha o modo ‘Endereço do Website‘ e COLE o link:
Basta redimensionar o app HTML para que não fique com barras laterais ou horizontais.
Conclusão
O tutorial faz parecer com que essa tarefa seja muito complicada e árdua, mas na prática a coisa é mais fácil. Depois que você descobre o caminho fica bem mais simples, pois sua conta no Ucoz já estará criada, seu FTP configurado e você estará familiarizado com o processo.
O que mais pesa é a edição dos arquivos jQuery, os quais não entrei em detalhes para não alongar ainda mais essa tuto, que tinha como objetivo tão somente ensinar como fazer para executar o jQuery no Wix.
Nos próximos tutoriais sobre jQuery, sempre que tiver novos códigos, irei dar mais detalhes para a edição dos mesmos.
É isso.
Se tiver alguma dúvida em qualquer parte do tutorial, comente abaixo. 😉