• 회원가입
  • 로그인
  • 구글아이디로 로그인

[web] 윈도우10 - 이모지 (Emoji) (입력법 + 웹에 적용)

10,096  
목차
  1. 이모지(Emoji) 소개
  2. 이모지(Emoji) 윈도우10에서 입력 방법 ★
  3. MySQL 명령어 입력 (= 사전 배경지식 ㅡㅡ;)
  4. 이모지(Emoji) 웹적용법1 - 직접 입력방식
  5. 이모지(Emoji) 웹적용법2 - 이모티콘 입력방식
  6. 이모지(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

 



2019-08-10 (토) 13:33 5년전
상세한 답변 정말 감사합니다.
제가 사용중인 서버는 지원하지 않나 봅니다.
잠정적 보류..ㅠㅠ

1.DB설정에서
/etc/my.cnf 에 접근 권한이 없습니다.ㅠㅠ
     
     
2019-08-10 (토) 16:24 5년전
[@홀민] 괜시리 DB만 많이 잡아먹어 저도 사용 않습니다. ㅎ
양파맨 이모티콘이 최고죠.
분류 제목 조회
web 홈페이지, 블로그, 카페 중 어떤 걸 선택해 운영할 것인가?
9,596
9,596
157/157
목록
찾아주셔서 감사합니다. Since 2012