목차
- 이모지(Emoji) 소개
- 이모지(Emoji) 윈도우10에서 입력 방법 ★
- MySQL 명령어 입력 (= 사전 배경지식 ㅡㅡ;)
- 이모지(Emoji) 웹적용법1 - 직접 입력방식
- 이모지(Emoji) 웹적용법2 - 이모티콘 입력방식
- 이모지(Emoji) 관련 참고주소
이모지(Emoji) 소개
스마트폰 등에서 사용하는 그림문자.
1.
어원은 아래 일본어에서 유래. (발음은 영어식)
2.
1개당 4byte 차지 (※ utf8mb4 언어셋 DB만 지원)3.
이모지(Emoji) 윈도우10에서 입력 방법 ★
※ 3가지 방법으로 가능
- Windows 키 + ; (세미콜론)키
- Windows 키 + . (마침표)키
- 마우스오른쪽버튼 > 그림 이모티콘
MySQL 명령어 입력 (= 사전 배경지식 ㅡㅡ;)
[방법1] - PUTTY 등 SSH 콘솔 이용
1. MySQL 모드로 이동
mysql -u root -p
2. 작업할 DB명 선택
use DB명; (예) use homzzang;
[방법2] - PhpMyAdmin 이용
PhpMyAdmin 로그인 > 좌측에서 작업할 DB선택 > SQL 탭 선택 > 작업할 명령어 입력
이모지(Emoji) 웹적용법1 - 직접 입력방식
1.
서버 DB를 utf8mb4 설정하기
※ 참고1.
utf8mb4_unicode_ci (DB엄격비교, 속도느림) 대신
utf8mb4_general_ci (DB간편비교, 속도빠름) 사용해도 됨.
※ 아래 작업은 putty 등 SSH 콘솔 이용해 작업함.
1.
DB 설정 변경
[MariaDB]
/etc/mysql/conf.d/mariadb.cnf
# MariaDB-specific config file.
# Read by /etc/mysql/my.cnf
[client]
default-character-set = utf8mb4
[mysqld]
# * Character sets
character-set-client-handshake = FALSE
character-set-server = utf8mb4
collation-server = utf8mb4_unicode_ci
character_set_server = utf8mb4
collation_server = utf8mb4_unicode_ci
[MySQL 5.5.3 이상]
/etc/my.cnf
[client]
default-character-set = utf8mb4
[mysql]
default-character-set = utf8mb4
[mysqld]
character-set-client-handshake = FALSE
character-set-server = utf8mb4
collation-server = utf8mb4_unicode_ci
character_set_server = utf8mb4
collation_server = utf8mb4_unicode_ci
2.
DB 재시작
service mysql restart
3.
변경내역 확인하기
1.
MySQL 모드 설정
mysql -u root -p
2.
MySQL 모드에서 입력
SHOW VARIABLES WHERE Variable_name LIKE 'character\_set\_%' OR Variable_name LIKE 'collation%';
※ 아래처럼 나오는지 확인
+--------------------------+--------------------+
| Variable_name | Value |
+--------------------------+--------------------+
| character_set_client | utf8mb4 |
| character_set_connection | utf8mb4 |
| character_set_database | utf8mb4 |
| character_set_filesystem | binary |
| character_set_results | utf8mb4 |
| character_set_server | utf8mb4 |
| character_set_system | utf8 |
| collation_connection | utf8mb4_unicode_ci |
| collation_database | utf8mb4_unicode_ci |
| collation_server | utf8mb4_unicode_ci |
+--------------------------+--------------------+
※ 핑크색 부분은 안 바뀌는 게 정상. 자세히 보기
2.
사용 중인 UTF8 → utf8mb4 버전으로 전환
0.
mysql 버전이 utf8mb4 지원하는지 체크. (※ utf8mb4_general_ci 사용 권장)
(phpMyAdmin 접속해 DB 생성 또는 특정테이블에 컬럼 추가 시, 테이터정렬방식에 utf8mb4 있는지 체크.)
※ MySQL 5.5.3부터 utf8mb4 지원
1.
[G5 5.4 이상 버전]/config.php 약 40라인 수정수정 전: define('G5_DB_CHARSET', 'utf8');
수정 전: define('G5_DB_CHARSET', 'utf8mb4');
[G5 5.4 미만 버전]
/common.php 약 143라인 수정
수정 전 : sql_set_charset('utf8', $connect_db);
수정 후 : sql_set_charset('utf8mb4', $connect_db);
2.
※ 테이블의 모든 컬럼을 utf8mb4로 수정하기
ALTER TABLE 테이블명 CONVERT TO CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci;
※ 테이블의 글제목과 글내용 컬럼만 utf8mb4로 수정하기
ALTER TABLE `g5_write_게시판ID` CHANGE `wr_subject` `wr_subject` VARCHAR(255) CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci NOT NULL;
ALTER TABLE `g5_write_게시판ID` CHANGE `wr_content` `wr_content` TEXT CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci NOT NULL;
※ 아래 방법으로 해도 됨.
phpmyadmin 로그인
> 좌측에서 작업할 DB 선택
> 수정할 게시판 테이블 선택
> 구조 탭 클릭
> wr_subject 와 wr_content 컬럼의 변경 버튼 클릭
> 데이터정렬방식을 utf8mb4_general_ci 또는 utf8mb4_unicode_ci 선택
※ 작업 전 백업 필수 !!
3.
/adm/sql_write.sql 46라인 수정 (게시판 생성 시, utf8mb4 테이블 생성되게 설정)
수정 전 : ) ENGINE=MyISAM DEFAULT CHARSET=utf8;
수정 후 : ) ENGINE=MyISAM DEFAULT CHARSET=utf8mb4;
PS.
그누보드 설치 경우, 아래 파일도 수정
/install/*.sql 파일 수정
수정 전 : ) ENGINE=MyISAM DEFAULT CHARSET=utf8;
수정 후 : ) ENGINE=MyISAM DEFAULT CHARSET=utf8mb4;
이모지(Emoji) 웹적용법2 - 이모티콘 입력방식
1.
위 직접 입력방식 참고해, utf8mb4 설정 작업
2.
이모지 유니코드 테이블 참고해, 이모지 입력패널창 생성.
https://apps.timwhitlock.info/emoji/tables/unicode
https://www.unicode.org/emoji/charts/full-emoji-list.html
3.
이모지 입력패널창 생성할 때, 이모지 유니코드를 웹사용 코드로 전환 필요.
- 수정 전: U+1F601
- 수정 후: 😁 (즉, U+ 제거 후, 앞에 &#x 붙이고, 뒤에는 ; 붙임)
4.
에디터의 기존 이모티콘 기능 참고해, 이모지 클릭 시 이모지 코드 적용되도록 작업.
ps.
utf8mb4 설정 작업없이 이모지 코드 적용할 경우, 웹사용 코드로 전환않고 바로 이모지 코드 넣으면 이모지 코드 뒤의 모든 내용이 사라지는 증상 생김.
※ 이 방식은 초보자에겐 좀 무리인 작업이니, 초급기능사에게 1~2일 잡고 의뢰맡기세요.
※ 스마트폰에서 바로 입력되도록 하려면, 문자열 치환하는 JS 정규표현식 지식이 필요함.
이모지(Emoji) 관련 참고주소
이모지 웹적용법
- http://naminsik.com/blog/3149
UTF8 --> UTF8MB4
- http://amina.co.kr/bbs/board.php?bo_table=tip&wr_id=3968
- http://amina.co.kr/bbs/board.php?bo_table=tip&wr_id=3625
- https://www.happyjung.com/lecture/2503
윈도우10 이모지
- https://theqoo.net/square/889075049
전반적인 상세작업
- https://www.wsgvet.com/bbs/board.php?bo_table=home&wr_id=520
