{"id":50866457,"url":"https://github.com/tolgee/tolgee-php-demo","last_synced_at":"2026-06-15T01:40:19.909Z","repository":{"id":333869183,"uuid":"1139060801","full_name":"tolgee/tolgee-php-demo","owner":"tolgee","description":"PHP demo application showcasing Tolgee integration","archived":false,"fork":false,"pushed_at":"2026-01-21T15:03:27.000Z","size":33,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-06-15T01:39:05.316Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/tolgee.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null},"funding":{"github":["tolgee"]}},"created_at":"2026-01-21T13:23:58.000Z","updated_at":"2026-01-21T15:13:40.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/tolgee/tolgee-php-demo","commit_stats":null,"previous_names":["tolgee/tolgee-php-demo"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/tolgee/tolgee-php-demo","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tolgee%2Ftolgee-php-demo","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tolgee%2Ftolgee-php-demo/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tolgee%2Ftolgee-php-demo/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tolgee%2Ftolgee-php-demo/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tolgee","download_url":"https://codeload.github.com/tolgee/tolgee-php-demo/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tolgee%2Ftolgee-php-demo/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34344440,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-14T02:00:07.365Z","response_time":62,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2026-06-15T01:40:19.126Z","updated_at":"2026-06-15T01:40:19.903Z","avatar_url":"https://github.com/tolgee.png","language":"PHP","funding_links":["https://github.com/sponsors/tolgee"],"categories":[],"sub_categories":[],"readme":"# PHP Localization with In-Context Editing | Tolgee Integration Example\n\n\u003cp align=\"center\"\u003e\n  \u003cb\u003eAdd visual in-context translation editing to PHP, Rails, Django, and other server-rendered applications\u003c/b\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://github.com/tolgee/tolgee-platform/stargazers\"\u003e\n    \u003cimg src=\"https://img.shields.io/github/stars/tolgee/tolgee-platform?style=social\" alt=\"Tolgee Localization Platform GitHub Stars\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://github.com/tolgee/tolgee-js/stargazers\"\u003e\n    \u003cimg src=\"https://img.shields.io/github/stars/tolgee/tolgee-js?style=social\u0026label=Tolgee%20JS\" alt=\"Tolgee JavaScript SDK Stars\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://tolgee.io/slack\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/Slack-Tolgee Community-blue?logo=slack\" alt=\"Tolgee Slack Community\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://docs.tolgee.io\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/Docs-docs.tolgee.io-blue\" alt=\"Tolgee Documentation\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n---\n\n## PHP Translation Management with Visual Editing\n\nThis repository demonstrates how to integrate **[Tolgee](https://tolgee.io)** in-context translation editing into **server-side rendered PHP applications**. Enable translators and developers to edit translations directly in the browser - no code changes required.\n\n### Why In-Context Editing for PHP?\n\nTraditional PHP localization workflows require developers to:\n1. Find the translation key in code\n2. Look up the key in JSON/PO files\n3. Make changes\n4. Refresh to see results\n\nWith Tolgee's in-context editing, translators simply **click on any text** to edit it instantly.\n\n## Key Features\n\n| Feature | Description |\n|---------|-------------|\n| ✏️ **In-Context Editor** | Click any text to translate - Alt+Click to edit |\n| 🔄 **Real-time Sync** | Tolgee CLI watches and pulls translation changes automatically |\n| 🐳 **Docker Ready** | One command setup with Docker Compose |\n| 🌍 **Multi-language** | Built-in support for English, Czech, French, German |\n\n## How PHP In-Context Translation Works\n\nThis integration uses **invisible Unicode markers** to connect rendered text with translation keys:\n\n```\nRendered HTML:  \"What To Pack\" + invisible characters\n                      ↓\nTolgee JS decodes:  {\"key\": \"app-title\", \"namespace\": \"\"}\n                      ↓\nResult:  Clickable, editable translation\n```\n\n### The Translation Flow\n\n1. **PHP renders translations** with invisible key markers appended\n2. **Tolgee Observer** scans the DOM and detects marked strings\n3. **User holds Alt/Option** and clicks to open the translation editor\n4. **Changes sync** via Tolgee API to your translation management platform\n5. **CLI pulls updates** to your local JSON translation files\n\n## Quick Start Guide\n\n### Prerequisites\n\n- [Docker](https://docs.docker.com/get-docker/) and Docker Compose\n- [Tolgee account](https://app.tolgee.io) (free tier available)\n- Project API key from Tolgee\n\n### Installation\n\n```bash\n# Clone the PHP localization example\ngit clone https://github.com/tolgee/tolgee-php-demo.git\ncd tolgee-php-demo\n\n# Configure your Tolgee credentials\ncat \u003e .env \u003c\u003c EOF\nTOLGEE_API_URL=https://app.tolgee.io\nTOLGEE_API_KEY=your-project-api-key\nTOLGEE_DEV_MODE=true\nEOF\n\n# Start the application with translation sync\ndocker compose --profile dev up\n```\n\n### Try In-Context Editing\n\n1. Open [http://localhost:8080](http://localhost:8080)\n2. Hold **Alt** (Windows/Linux) or **Option** (Mac)\n3. Hover over any translated text - it will highlight\n4. Click to open the translation editor\n5. Save changes - they sync automatically\n\n## Project Structure\n\n```\ntolgee-php-demo/\n├── docker-compose.yml        # PHP 8.4 + Tolgee CLI services\n├── Dockerfile                # Apache + PHP + SQLite\n├── .tolgeerc.json            # Tolgee CLI configuration\n│\n├── public/                   # Web root\n│   ├── index.php             # Main application with i18n\n│   ├── api.php               # REST API endpoints\n│   ├── style.css             # Application styles\n│   └── i18n/                 # Translation files\n│       ├── en.json           # English translations\n│       ├── cs.json           # Czech translations\n│       ├── fr.json           # French translations\n│       └── de.json           # German translations\n│\n└── src/                      # PHP source\n    ├── Translator.php        # Translation function with wrapping\n    ├── InvisibleWrapper.php  # Invisible character encoding\n    └── Database.php          # SQLite database handler\n```\n\n## Understanding the Invisible Wrapper\n\nThe `InvisibleWrapper` class encodes translation keys using zero-width Unicode characters:\n\n```php\nclass InvisibleWrapper\n{\n    // Zero-Width Non-Joiner (0) and Zero-Width Joiner (1)\n    const INVISIBLE_CHARACTERS = [\"\\u{200C}\", \"\\u{200D}\"];\n\n    public function wrap($key, $namespace, $translation)\n    {\n        // Encode {\"k\":\"key\",\"n\":\"namespace\"} as invisible binary\n        $data = json_encode(['k' =\u003e $key, 'n' =\u003e $namespace ?: '']);\n        return $translation . $this-\u003eencodeToInvisible($data);\n    }\n}\n```\n\nThese characters are:\n- ✅ Invisible to users\n- ✅ Safe in HTML\n- ✅ Preserved in copy/paste\n- ✅ Detected by Tolgee Observer\n\n## Enabling Development Mode\n\nBy default, you don't want to expose Tolgee dev tools or in-context editing capabilities to end users in production. The API key should never be bundled into client-side code, and the invisible character wrapping adds unnecessary overhead.\n\nHowever, **team members like translators or product managers often need to edit strings directly on production** - seeing translations in their real context is invaluable for quality.\n\n### The Tolgee Browser Plugin Solution\n\nThe [Tolgee Browser Plugin](https://docs.tolgee.io/browser-plugin) solves this elegantly. It can **inject the API key and dev tools directly into Tolgee JS** on the client side, enabling in-context editing without any server-side credentials:\n\n1. Install the [Tolgee Chrome Extension](https://chromewebstore.google.com/detail/tolgee-tools/hacnbapajkkfohnonhbmegojnddagfnj) or [Firefox Add-on](https://addons.mozilla.org/en-US/firefox/addon/tolgee-tools/)\n2. Configure the plugin with your Tolgee API key\n3. Visit your app with `?tolgeeDevelopment` parameter to load Tolgee JS\n4. The plugin injects credentials - in-context editing works without exposing keys server-side\n\nThis way, only team members with the plugin installed can edit translations, while regular users see a normal production site.\n\n### Method Used in This Example\n\n```php\n// Development mode is enabled when:\n// - API key is provided (local development with .env)\n// - ?tolgeeDevelopment query param is present (for browser plugin)\n$isDevelopment = !empty($apiKey) || isset($_GET['tolgeeDevelopment']);\n```\n\n### Alternative Approaches for Your Application\n\nDepending on your security requirements, consider these patterns:\n\n#### Session-Based Toggle\n```php\n// Enable via: /toggle-tolgee?enable=1\nif (isset($_GET['enable'])) {\n    $_SESSION['tolgee_dev'] = $_GET['enable'] === '1';\n}\n$isDevelopment = $_SESSION['tolgee_dev'] ?? false;\n```\n\n#### Staging Environment Detection\n```php\n// Auto-enable on staging subdomains\n$host = $_SERVER['HTTP_HOST'] ?? '';\n$isDevelopment = str_contains($host, 'staging.')\n    || str_contains($host, 'dev.')\n    || $host === 'localhost';\n```\n\n#### IP Allowlist\n```php\n// Only enable for office/VPN IPs\n$allowedIPs = ['192.168.1.0/24', '10.0.0.0/8'];\n$isDevelopment = ipInRange($_SERVER['REMOTE_ADDR'], $allowedIPs);\n```\n\n#### Authenticated Users Only\n```php\n// Only for logged-in translators\n$isDevelopment = isLoggedIn() \u0026\u0026 currentUser()-\u003ehasRole('translator');\n```\n\n## Production Deployment\n\nIn production, development mode should be **disabled** to:\n- Remove invisible character wrapping (cleaner HTML)\n- Skip loading Tolgee JS (faster page loads)\n\nSimply ensure no development triggers are active:\n- No `TOLGEE_API_KEY` in production env\n- Don't expose `?tolgeeDevelopment` parameter to end users\n\n## Documentation \u0026 Resources\n\n- 📖 [In-Context Editing for Backend Apps](https://docs.tolgee.io/js-sdk/integrations/backend-rendered/overview) - Complete integration guide\n- 📖 [Setup Guide](https://docs.tolgee.io/js-sdk/integrations/backend-rendered/setup) - Step-by-step instructions\n- 📖 [Tolgee CLI Documentation](https://docs.tolgee.io/tolgee-cli) - CLI commands and configuration\n- 🎓 [Tolgee Platform Docs](https://docs.tolgee.io) - Full documentation\n\n## Related Tolgee Integrations\n\n- [React + Tolgee](https://github.com/tolgee/react-example) - React SPA integration\n- [Next.js + Tolgee](https://github.com/tolgee/next-example) - Next.js with SSR\n- [Vue + Tolgee](https://github.com/tolgee/vue-example) - Vue.js integration\n- [Svelte + Tolgee](https://github.com/tolgee/svelte-example) - Svelte integration\n\n## Contributing\n\nContributions are welcome! Please read our [Contributing Guide](https://github.com/tolgee/tolgee-platform/blob/main/CONTRIBUTING.md) before submitting PRs.\n\n---\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://tolgee.io\"\u003e\n    \u003cimg src=\"./logo.svg\" alt=\"Tolgee Localization Platform Logo\" width=\"200\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cb\u003eTolgee - Localization platform developers enjoy\u003c/b\u003e\u003cbr\u003e\n  \u003ca href=\"https://tolgee.io\"\u003eWebsite\u003c/a\u003e •\n  \u003ca href=\"https://docs.tolgee.io\"\u003eDocumentation\u003c/a\u003e •\n  \u003ca href=\"https://app.tolgee.io\"\u003eGet Started Free\u003c/a\u003e\n\u003c/p\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftolgee%2Ftolgee-php-demo","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftolgee%2Ftolgee-php-demo","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftolgee%2Ftolgee-php-demo/lists"}