49 lines
2.4 KiB
Markdown
49 lines
2.4 KiB
Markdown
# Helena Fontes - Template Premium para Corretores de Alto Padrão
|
|
|
|
Este é um template React VIP, projetado para corretores de imóveis, butiques imobiliárias e assessorias que focam no mercado de alto padrão e luxo.
|
|
|
|
## 🚀 Como Iniciar
|
|
|
|
1. **Instale as dependências:**
|
|
```bash
|
|
npm install
|
|
```
|
|
|
|
2. **Rode o servidor de desenvolvimento:**
|
|
```bash
|
|
npm run dev
|
|
```
|
|
Acesse em `http://localhost:5173/` (ou a porta informada pelo Vite).
|
|
|
|
3. **Crie a build para produção:**
|
|
```bash
|
|
npm run build
|
|
```
|
|
|
|
## 🎨 Customização
|
|
|
|
### 1. Identidade Visual (Cores e Fontes)
|
|
Para alterar a paleta de cores (ex: o tom dourado ou o tom escuro), edite o arquivo `src/index.css`.
|
|
As fontes são o **Montserrat** (sem serifa) e **Cormorant Garamond** (serifada) aplicadas via Tailwind. Se desejar alterar as fontes globais, modifique os imports no início do `src/index.css` e as definições variáveis.
|
|
|
|
### 2. Edição de Dados (Portfólio e Blog)
|
|
O template é preenchido através do arquivo **`src/data/articles.ts`**.
|
|
Para adicionar ou remover propriedades e artigos de mercado, basta alterar este arquivo. As imagens devem preferencialmente seguir o aspect ratio das fotos atuais (ou utilizar o Unsplash para placeholder).
|
|
|
|
### 3. Integração de Analytics (Tráfego Pago)
|
|
Configure suas tags no arquivo `.env` baseado no `.env.example`:
|
|
- `VITE_GTM_ID`: Google Tag Manager
|
|
- `VITE_GA_MEASUREMENT_ID`: Google Analytics (G-XXXXXX)
|
|
- `VITE_FB_PIXEL_ID`: Pixel do Facebook/Meta
|
|
- `VITE_GOOGLE_ADS_ID`: Tag de Conversão Google Ads (AW-XXXXXX)
|
|
|
|
### 4. Formulário de Contato
|
|
A página de contato (`src/pages/ContatoPage.tsx`) possui um design funcional. Para receber os leads diretamente e de forma gratuita em templates estáticos (sem backend), recomendamos trocar o evento onSubmit padrão e integrar plataformas simples como o [Formspree](https://formspree.io/) ou [Netlify Forms](https://docs.netlify.com/forms/setup/).
|
|
|
|
### 5. Links e Redes Sociais
|
|
Lembre-se de atualizar os `href` dos ícones no arquivo `src/App.tsx` (Footer) com os links reais de seu Instagram e LinkedIn.
|
|
|
|
## 🌐 Deploy
|
|
Sendo um aplicativo Vite React App Single Page Application (SPA), o projeto é totalmente otimizado para deploy em plataformas de hospedagem estática gratuitas ou profissionais como **Vercel**, **Netlify**, ou **Cloudflare Pages**.
|
|
|
|
*Desenvolvido com sofisticação em React, Vite, Framer Motion e Tailwind CSS.*
|