Tru & Co
Documentation

TRU & CO WordPress Guide

Complete documentation for transferring the TRU & CO website to WordPress. Follow the step-by-step instructions below.

📦 Package Contents

This package contains the complete TRU & CO website ready to be transferred to WordPress.

File Structure

tru-co-wordpress-complete/
├── html-embeds/           # Páginas HTML standalone
│   ├── home.html          # Página inicial
│   ├── about.html         # Sobre a empresa
│   ├── peptides.html      # World of Peptides
│   ├── contact.html       # Formulário de contato
│   ├── terms.html         # Termos de Serviço
│   └── privacy.html       # Política de Privacidade
├── assets/
│   └── images/            # Todas as imagens do site
│       ├── logo.png
│       ├── background.png
│       ├── laboratorio_1.png
│       ├── laboratorio_2.png
│       ├── feature-quality.png
│       ├── feature-innovation.png
│       ├── feature-trust.png
│       ├── hero-background.png
│       └── cta-background.png
└── README.md              # Este arquivo

🚀 How to Use in WordPress

1HTML Embed Pages (Recommended)

Upload Images

  • • Access WordPress Admin → Media → Add New
  • • Upload all images from the assets/images/ folder
  • • Note the URLs of each image

Create Pages

  • • For each HTML file in html-embeds/:
  • → Go to Pages → Add New
  • → Add a "Custom HTML" block
  • → Paste the HTML content
  • → Replace image paths with WordPress URLs

Update Navigation Links

  • • Replace .html links with WordPress permalinks
  • • Example: home.html → https://yoursite.com/

2Direct Upload (Static Hosting)

If your WordPress allows static file hosting:

  • • Upload the entire folder via FTP to /wp-content/uploads/tru-co/
  • • Access directly: https://yoursite.com/wp-content/uploads/tru-co/html-embeds/home.html

3iFrame Method

Upload HTML files to your server and use in each WordPress page:

<iframe src="URL_DO_ARQUIVO.html" width="100%" height="2000px" frameborder="0" style="border:none;"></iframe>

⚙️ Required Settings

Contact Form (Web3Forms)

The contact form uses Web3Forms to send emails. To activate:

  1. 1Access web3forms.com
  2. 2Create a free account
  3. 3Generate an Access Key for [email protected]
  4. 4In contact.html, replace YOUR_ACCESS_KEY_HERE

reCAPTCHA

The form uses test reCAPTCHA. For production:

  1. 1Access Google reCAPTCHA
  2. 2Register your domain
  3. 3Replace the test key with your production key

📱 Included Pages

PageFileDescription
Homehome.htmlPágina inicial com hero, features, stats e CTA
Aboutabout.htmlVisão geral da empresa, qualidade, certificações
World of Peptidespeptides.htmlInformações educacionais sobre peptídeos
Contact uscontact.htmlFormulário de contato com Web3Forms
Terms of Serviceterms.htmlTermos de serviço legais
Privacy Policyprivacy.htmlPolĂ­tica de privacidade

🎨 Visual Identity

Main Colors

Cyan#4FC3F7
Purple#7B2CBF
Magenta#E91E8C
Text#1A365D

Typography & Style

  • Fonts: Sora (headings), DM Sans (body)
  • Style: Glassmorphism, gradients
  • Cards: Soft shadows, rounded corners
  • Effects: Backdrop blur, hover animations

đź“§ Need Help?

For questions about implementation, contact us:

[email protected]Orlando, FL, USA