2.1 KiB
2.1 KiB
Simple Puffin Offset Calculator Setup
This guide provides a minimalist approach to run the Puffin Offset Calculator in a Docker container and embed it into WordPress.
Quick Start
1. Create a Directory and Required Files
Create a new directory and add these files:
docker-compose.yml- Configuration for Docker container.env- Environment variables for the application
2. Run with Docker Compose
docker-compose up -d
This will:
- Build the calculator image from the local Dockerfile
- Start the container
- Make the calculator available at http://localhost:8080
3. Embed in WordPress
Add this code to a page in your WordPress site:
<iframe
src="http://localhost:8080"
width="100%"
height="800px"
frameborder="0"
style="border:none;overflow:hidden"
title="Carbon Offset Calculator">
</iframe>
Adjust the URL if you're hosting the Docker container on a different server.
docker-compose.yml File Contents
version: '3.8'
services:
puffin-calculator:
build: .
container_name: puffin-calculator
ports:
- "8080:80"
restart: unless-stopped
environment:
- NODE_ENV=production
# Include any environment variables from .env file
- REACT_APP_API_KEY=${REACT_APP_API_KEY}
- REACT_APP_API_URL=${REACT_APP_API_URL}
volumes:
# Persist Nginx logs
- ./logs:/var/log/nginx
.env File Example
Create a .env file with any required environment variables:
REACT_APP_API_KEY=your_api_key_here
REACT_APP_API_URL=https://api.example.com
Gitea Registry Authentication
If you get authentication errors when Docker tries to pull the image:
docker login code.letsbe.solutions
# Enter your Gitea credentials when prompted
Then run docker-compose up -d again.
Troubleshooting
- Container not starting: Check the logs with
docker-compose logs puffin-calculator - Calculator not showing in WordPress: Ensure the server hosting Docker is accessible from your WordPress server
- CORS issues: Your WordPress site must be able to load content from the calculator URL