-
Notifications
You must be signed in to change notification settings - Fork 6.1k
Add comprehensive login page customization options #7374
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Open
strickvl
wants to merge
15
commits into
coder:main
Choose a base branch
from
strickvl:main
base: main
Could not load branches
Branch not found: {{ refName }}
Loading
Could not load tags
Nothing to show
Loading
Are you sure you want to change the base?
Some commits from the old base branch may be removed from the timeline,
and old review comments may become outdated.
+140
−23
Open
Changes from 6 commits
Commits
Show all changes
15 commits
Select commit
Hold shift + click to select a range
cd99956
feat: add comprehensive login page customization options
strickvl bac8b42
Merge branch 'main' into main
strickvl 2553f45
feat: replace individual UI flags with unified --custom-strings flag
strickvl c2eb61d
docs: simplify migration guide to only cover released flags
strickvl c0189ed
docs: update Docker customization examples to use --custom-strings
strickvl cacf3cc
Merge branch 'main' into main
strickvl 2b2819e
docs: remove niche customization sections from FAQ and install guide
strickvl b275d52
refactor: remove redundant custom-strings validation and global variable
strickvl af2f599
refactor: simplify loadCustomStrings function signature and error han…
strickvl e89a9af
test: remove outdated tests for deprecated custom UI flags
strickvl a8b7fbe
refactor: use addResourceBundle instead of re-initializing i18next
strickvl 27ee714
docs: improve custom-strings flag description
strickvl d5c0c88
refactor: keep --app-name flag as non-deprecated for {{app}} placeholder
strickvl fd6ca51
refactor: rename --custom-strings flag to --i18n
strickvl ca12a25
docs: consolidate i18n documentation in guide.md
strickvl File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,170 @@ | ||
# Login Page Customization | ||
strickvl marked this conversation as resolved.
Show resolved
Hide resolved
|
||
|
||
code-server allows you to customize the login page appearance and messages through a unified `--custom-strings` flag or legacy CLI arguments. | ||
|
||
## Recommended Approach: Custom Strings | ||
|
||
The `--custom-strings` flag provides a scalable way to customize any UI text by leveraging the built-in internationalization system. | ||
|
||
### Using JSON File | ||
|
||
Create a JSON file with your customizations: | ||
|
||
```json | ||
{ | ||
"WELCOME": "Welcome to {{app}} Development Portal", | ||
"LOGIN_TITLE": "{{app}} Secure Access", | ||
"LOGIN_BELOW": "Please authenticate to continue", | ||
"PASSWORD_PLACEHOLDER": "Enter your access code", | ||
"SUBMIT": "AUTHENTICATE", | ||
"LOGIN_PASSWORD": "Check the config file at {{configFile}} for the password.", | ||
"LOGIN_USING_ENV_PASSWORD": "Access code provided via environment variable", | ||
"LOGIN_USING_HASHED_PASSWORD": "Access code configured securely", | ||
"LOGIN_RATE_LIMIT": "Too many attempts. Please wait before trying again.", | ||
"MISS_PASSWORD": "Access code is required", | ||
"INCORRECT_PASSWORD": "Invalid access code" | ||
} | ||
``` | ||
|
||
```bash | ||
code-server --custom-strings /path/to/custom-strings.json | ||
``` | ||
|
||
### Using Inline JSON | ||
|
||
```bash | ||
code-server --custom-strings '{"WELCOME": "Welcome to My Dev Portal", "LOGIN_TITLE": "Development Access", "SUBMIT": "SIGN IN"}' | ||
``` | ||
|
||
### Configuration File | ||
|
||
Add to your `~/.config/code-server/config.yaml`: | ||
|
||
```yaml | ||
bind-addr: 127.0.0.1:8080 | ||
auth: password | ||
password: your-password | ||
custom-strings: | | ||
{ | ||
"WELCOME": "Welcome to {{app}} Development Portal", | ||
"LOGIN_TITLE": "{{app}} Secure Access", | ||
"PASSWORD_PLACEHOLDER": "Enter your access code", | ||
"SUBMIT": "AUTHENTICATE" | ||
} | ||
``` | ||
|
||
## Available Customization Keys | ||
|
||
| Key | Description | Default | Supports {{app}} placeholder | | ||
|-----|-------------|---------|------------------------------| | ||
| `WELCOME` | Welcome message on login page | "Welcome to {{app}}" | ✅ | | ||
| `LOGIN_TITLE` | Main title on login page | "{{app}} login" | ✅ | | ||
| `LOGIN_BELOW` | Text below the login title | "Please log in below." | ❌ | | ||
| `PASSWORD_PLACEHOLDER` | Password field placeholder text | "PASSWORD" | ❌ | | ||
| `SUBMIT` | Login button text | "SUBMIT" | ❌ | | ||
| `LOGIN_PASSWORD` | Message for config file password | "Check the config file at {{configFile}} for the password." | ❌ | | ||
| `LOGIN_USING_ENV_PASSWORD` | Message when using `$PASSWORD` env var | "Password was set from $PASSWORD." | ❌ | | ||
| `LOGIN_USING_HASHED_PASSWORD` | Message when using `$HASHED_PASSWORD` env var | "Password was set from $HASHED_PASSWORD." | ❌ | | ||
| `LOGIN_RATE_LIMIT` | Rate limiting error message | "Login rate limited!" | ❌ | | ||
| `MISS_PASSWORD` | Empty password error message | "Missing password" | ❌ | | ||
| `INCORRECT_PASSWORD` | Wrong password error message | "Incorrect password" | ❌ | | ||
|
||
## Docker Examples | ||
|
||
### Basic Docker Deployment | ||
|
||
```bash | ||
docker run -it --name code-server -p 127.0.0.1:8080:8080 \ | ||
-v "$PWD:/home/coder/project" \ | ||
-v "$PWD/custom-strings.json:/custom-strings.json" \ | ||
codercom/code-server:latest --custom-strings /custom-strings.json | ||
``` | ||
|
||
### Corporate Branding with Inline JSON | ||
|
||
```bash | ||
docker run -it --name code-server -p 127.0.0.1:8080:8080 \ | ||
-v "$PWD:/home/coder/project" \ | ||
codercom/code-server:latest --custom-strings '{ | ||
"WELCOME": "Welcome to ACME Corporation Development Portal", | ||
"LOGIN_TITLE": "ACME Dev Portal Access", | ||
"LOGIN_BELOW": "Enter your corporate credentials", | ||
"PASSWORD_PLACEHOLDER": "Corporate Password", | ||
"SUBMIT": "SIGN IN", | ||
"LOGIN_USING_ENV_PASSWORD": "Password managed by IT department" | ||
}' | ||
``` | ||
|
||
## Legacy Support (Deprecated) | ||
|
||
The following flags are still supported but deprecated. Use `--custom-strings` for new deployments: | ||
|
||
```bash | ||
# Deprecated - use --custom-strings instead | ||
code-server \ | ||
--app-name "My Development Server" \ | ||
--welcome-text "Welcome to the development environment" | ||
``` | ||
|
||
These legacy flags will show deprecation warnings and may be removed in future versions. | ||
|
||
## Migration Guide | ||
|
||
### From Legacy Flags to Custom Strings | ||
|
||
**Old approach:** | ||
```bash | ||
code-server \ | ||
--app-name "Dev Portal" \ | ||
--welcome-text "Welcome to development" | ||
``` | ||
|
||
**New approach:** | ||
```bash | ||
code-server --custom-strings '{ | ||
"WELCOME": "Welcome to development" | ||
}' | ||
``` | ||
|
||
**Note:** The `--app-name` flag controls the `{{app}}` placeholder in templates. You can either: | ||
1. Keep using `--app-name` alongside `--custom-strings` | ||
2. Customize the full text without placeholders in your JSON | ||
|
||
## Benefits of Custom Strings | ||
|
||
- ✅ **Scalable**: Add any new UI strings without new CLI flags | ||
- ✅ **Flexible**: Supports both files and inline JSON | ||
- ✅ **Future-proof**: Automatically supports new UI strings as they're added | ||
- ✅ **Organized**: All customizations in one place | ||
- ✅ **Version-controlled**: JSON files can be tracked in your repository | ||
|
||
## Advanced Usage | ||
|
||
### Multi-language Support | ||
|
||
Create different JSON files for different languages: | ||
|
||
```bash | ||
# English | ||
code-server --custom-strings /config/strings-en.json | ||
|
||
# Spanish | ||
code-server --custom-strings /config/strings-es.json --locale es | ||
``` | ||
|
||
### Dynamic Customization | ||
|
||
Generate JSON dynamically in scripts: | ||
|
||
```bash | ||
#!/bin/bash | ||
COMPANY_NAME="ACME Corp" | ||
cat > /tmp/strings.json << EOF | ||
{ | ||
"WELCOME": "Welcome to ${COMPANY_NAME} Development Portal", | ||
"LOGIN_TITLE": "${COMPANY_NAME} Access Portal" | ||
} | ||
EOF | ||
|
||
code-server --custom-strings /tmp/strings.json | ||
``` |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Uh oh!
There was an error while loading. Please reload this page.