Ghost 이미지 최적화 및 환경 설정 file
1. Ghost에서 이미지 크기 및 최적화 조정 방법
Ghost는 이미지를 자동으로 최적화하지만, 필요에 따라 사용자 정의 조정을 통해 성능과 사용자 경험을 개선할 수 있습니다. 이 문서에서는 이미지 크기 조정 및 최적화 방법을 단계별로 설명합니다.
1.1 이미지 최적화 기본 설정
Ghost는 config.production.json 파일에서 이미지 최적화를 설정할 수 있습니다.
기본 설정 확인 및 변경
"resize": true는 Ghost가 업로드된 이미지를 기기별로 최적화된 크기로 자동 제공하도록 설정합니다.
파일 저장 후 Ghost 재시작:
ghost restart
아래 설정을 추가하거나 수정:
"imageOptimization": {
"resize": true
}
설정 파일 열기:
nano /var/www/ghost/config.production.json
1.2 Unsplash 이미지 크기 조정
Unsplash 이미지는 가져올 때 URL 파라미터를 사용하여 크기와 품질을 제어할 수 있습니다.
파라미터 사용법
품질을 70%로 설정:
https://images.unsplash.com/photo-1234567890?q=70
크기를 800x600으로 줄이기:
https://images.unsplash.com/photo-1234567890?w=800&h=600
원본 URL 예시:
https://images.unsplash.com/photo-1234567890
활용 방법
Ghost의 포스트 작성 화면에서 Unsplash 이미지를 추가한 후, 이미지 URL을 위와 같이 수정하여 원하는 크기와 품질로 최적화할 수 있습니다.
1.3 테마에서 이미지 크기 제어
Ghost 테마를 수정하여 특정 크기만 표시되도록 설정할 수 있습니다.
테마 수정 방법
저장 후 테마 업데이트 및 Ghost 재시작:
ghost restart
아래와 같이 srcset 속성을 사용해 크기 조정 코드 추가:
<img
src="{{img_url feature_image}}"
srcset="{{img_url feature_image size="s"}} 300w,
{{img_url feature_image size="m"}} 600w,
{{img_url feature_image size="l"}} 1000w"
sizes="(max-width: 600px) 300px, 600px"
alt="{{title}}"
/>
post.hbs 파일 열기:
nano post.hbs
테마 디렉토리로 이동:
cd /var/www/ghost/content/themes/<your-theme>
1.4 업로드 전 이미지 최적화
Ghost 업로드 전에 이미지를 최적화하는 도구를 사용하면 성능을 더 향상시킬 수 있습니다.
추천 도구
- 온라인 도구
- CLI 도구
- Sharp (Node.js):
스크립트를 사용하여 대량 이미지 처리 가능.
- Sharp (Node.js):
ImageMagick:
convert input.jpg -resize 800x600 output.jpg
1.5 Ghost 이미지 테스트
설정을 변경한 후, 업로드한 이미지가 원하는 대로 조정되는지 확인합니다:
- Ghost 관리자 페이지에서 새 포스트 작성.
- 이미지를 업로드한 후 최적화된 크기와 품질로 표시되는지 확인.
2. Ghost 환경 설정 파일 형식과 오류 방지 가이드
Ghost의 환경 설정 파일(config.production.json)은 Ghost의 동작을 정의하는 중요한 구성 요소입니다. JSON 형식이 올바르지 않으면 Ghost가 실행되지 않으므로 주의가 필요합니다.
2.1 기본 JSON 구조
config.production.json 파일은 JSON 형식을 따라야 하며, 다음 기본 구조를 포함합니다:
{
"url": "https://yourdomain.com",
"server": {
"port": 2368,
"host": "127.0.0.1"
},
"database": {
"client": "sqlite3",
"connection": {
"filename": "/path/to/ghost.db"
}
},
"mail": {
"transport": "SMTP",
"options": {
"service": "Gmail",
"auth": {
"user": "your-email@gmail.com",
"pass": "your-email-password"
}
}
},
"logging": {
"transports": ["file", "stdout"]
},
"process": "systemd",
"paths": {
"contentPath": "/path/to/content"
}
}
2.2 JSON 오류 방지 팁
1) 쉼표(,) 위치
- JSON의 마지막 항목에는 쉼표를 추가하지 않습니다.
올바른 예:
"process": "systemd"
잘못된 예:
"process": "systemd",
2) 문자열 따옴표
- 모든 문자열은 큰따옴표(
")를 사용해야 합니다.
올바른 예:
"url": "https://yourdomain.com"
잘못된 예:
'url': 'https://yourdomain.com'
3) 중괄호 및 대괄호
- 모든
{}와[]는 짝이 맞아야 합니다.
올바른 예:
{
"server": {
"port": 2368,
"host": "127.0.0.1"
}
}
잘못된 예:
{
"server": {
"port": 2368,
"host": "127.0.0.1"
}
2.3 JSON 유효성 검사
파일 저장 후 JSON이 올바른지 확인합니다.
CLI를 사용한 검사
- 오류가 없으면 포맷된 JSON이 출력됩니다.
Python으로 유효성 검사:
cat /var/www/ghost/config.production.json | python3 -m json.tool
온라인 도구 사용
- JSONLint: JSON 파일을 업로드하거나 복사하여 검증.
2.4 JSON 수정 후 적용
수정 후 Ghost를 다시 시작하여 적용합니다:
ghost restart
2.5 자주 발생하는 오류와 해결
- 오류: Config file is not valid JSON
- 원인: JSON 구문 오류(쉼표, 따옴표, 중괄호 문제).
- 해결: JSON 유효성 검사 도구로 파일 점검.
- 오류: Missing required fields
- 원인: 필수 항목(
url,server,database,paths) 누락. - 해결: 기본 JSON 구조를 참고해 누락된 항목 추가.
- 원인: 필수 항목(
- 오류: Cannot connect to database
- 원인: 데이터베이스 설정 오류.
- 해결: 데이터베이스 정보(
host,user,password,database) 확인.