# 그림 삽입

{% hint style="success" %}

### 그림, 사진 등을 이용하여 문서를 다양하게 꾸며 보세요!

{% endhint %}

<div align="left"><img src="https://www.officenote.co.kr/api/v1/download/6e44cbac-5d23-cff6-5dba-86a8f54af3fe/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202023-08-10%2009.02.01.png" alt="external_image" width="563"></div>

1. 그림을 삽입 할 위치에 커서를 놓고 에디터 도구 바에서 <mark style="background-color:orange;">\[그림 삽입]</mark> <img src="https://www.officenote.co.kr/api/v1/download/c23f0204-acfa-7818-1317-a144a4e65fcd/image.png" alt="external_image" data-size="line"> 버튼을 클릭 하세요.
2. &#x20;<mark style="background-color:orange;">\[파일찾기]</mark> 버튼을 통해 그림을 선택하거나, '드래그 앤 드롭'으로 그림을 삽입할 수 있어요.

> &#x20;드래그 앤 드롭으로 삽입 시, 브라우저에 따른 이미지 삽입 위치는 아래와 같습니다.
>
> &#x20;     \- IE 10 이상 : 편집 영역의 가장 마지막 위치에 삽입\
> &#x20;     \- Chrome & Safari & Opera : 드래그 앤 드롭 동작 전 캐럿 위치에 삽입\
> &#x20;     \- Firefox : 편집 영역의 이미지를 드래그 앤 드롭 하는 위치에 삽입

3. 그림 넣기 팝업 창에서 다양한 기능들을 활용할 수 있어요. (GIF, JPG, BMP, PNG 등 그림 형식을 지원합니다.)

<div align="left"><figure><img src="https://www.officenote.co.kr/api/v1/download/0fe7a3d1-2dae-c3db-52a2-3a477fdca936/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202023-08-10%2008.44.13.png" alt="" width="563"><figcaption></figcaption></figure></div>

a. <mark style="background-color:orange;">\[파일 찾기]</mark> 버튼을 사용하여 '그림 경로'를 입력해 주세요.

b. '그림 제목'은 해당 그림에 마우스를 위치 하였을 때 노출됩니다. \
&#x20;   <img src="https://www.officenote.co.kr/api/v1/download/610bea88-6d0d-ae91-6b1d-aa019e97ee93/image.png" alt="external_image" data-size="original">

c. '그림 설명'은 이미지가 보이지 않을 때 표시되며, 그림의 대체 문구가 될 수 있는 간단한 의미를 입력합니다.

d. 확대 버튼을 클릭하여, '그림의 세부사항'을 설정할 수 있어요. 너비, 높이, 정렬, 테두리 두께를 설정합니다.&#x20;

e. ['](https://www.officenote.co.kr/shared-page/b2b12514-6662-438e-920a-db7fc7564d85)[하이퍼링크](https://jiransoft.gitbook.io/officenext/guide/officenext/document/editor_component/insertion/hyperlink)'를 통해 그림을 삽입하여 설정할 수 있어요.

***

{% hint style="success" %}

### '나모 포토에디터' 기능을 사용하여, 사진을 다양하게 편집할 수 있어요.

{% endhint %}

<div align="left"><figure><img src="https://www.officenote.co.kr/api/v1/download/ccaaf75e-2063-786e-915e-69c55043f373/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202023-08-10%2017.21.56.png" alt="" width="563"><figcaption></figcaption></figure></div>

1. <mark style="background-color:orange;">\[사진 추가]</mark> 버튼을 선택하여 편집할 사진을 포토 에디터로 불러옵니다.
2. 사진 편집에 필요한 여러 가지 도구들을 모아 놓은 <mark style="background-color:orange;">\[도구 바]</mark> 영역입니다.

<details>

<summary>사진 자르기</summary>

* 편집 창에 사진을 불러온 뒤 원하는 부분만 잘라서 사용할 수 있습니다.\
  ![](https://www.officenote.co.kr/api/v1/download/66bda030-ba4b-41f4-a50c-95eba3ed2d7c/%E1%84%89%E1%85%A1%E1%84%8C%E1%85%B5%E1%86%AB%20%E1%84%8C%E1%85%A1%E1%84%85%E1%85%B3%E1%84%80%E1%85%B5.png)
* 편집할 사진을 불러온 후, 도구 바에서 <img src="https://www.officenote.co.kr/api/v1/download/270fec19-ed3d-88a5-2b89-e2a79f7f3f3c/image.png" alt="external_image" data-size="line"> 버튼을 선택합니다\
  \- 자르기 : 선택한 안쪽 영역만 잘라냅니다. 선택 바깥 영역이 편집 창에 남아있습니다.\
  \- 선택 영역 오려내기 : 선택한 바깥 영역을 잘라냅니다. 안쪽 영역은 편집 창에 남아있습니다.\
  \- 오려낸 후 복사하기 : 원본에서 선택한 영역을 잘라내고 자른 영역으로 새 레이어를 만듭니다.\
  \- 선택 영역 복사하기 : 원본 사진은 자르지 않고 선택 영역만 복사하여 새 레이어로 만듭니다.

</details>

<details>

<summary><strong>사진 크기 조절</strong></summary>

* 편집 창에 사진을 불러온 뒤 사진 크기를 조절할 수 있습니다.   &#x20;

&#x20;        ![](https://www.officenote.co.kr/api/v1/download/b3bf8a91-851d-fe9d-5afc-e5bac5187eed/%E1%84%8F%E1%85%B3%E1%84%80%E1%85%B5%20%E1%84%8C%E1%85%A9%E1%84%8C%E1%85%A5%E1%86%AF.png)&#x20;

* 편집할 사진을 불러온 후, 도구 바에서  <img src="https://www.officenote.co.kr/api/v1/download/270fec19-ed3d-88a5-2b89-e2a79f7f3f3c/image.png" alt="external_image" data-size="line"> 버튼을 선택합니다.
* 사진 테두리에 표시되는 핸들(회색 네모 상자)을 이용하여 사진 크기를 조정할 수 있습니다.
* 속성 창에 표시되는 사진의 너비와 높이 값을 확인 후 적용 버튼을 클릭하여 적용합니다.&#x20;

</details>

<details>

<summary><strong>사진 변형</strong></summary>

* 사진을 여러 사진을 여러 각도로 원하는 데로 회전하며 변형할 수 있습니다.

&#x20;        ![](https://www.officenote.co.kr/api/v1/download/ede3e8ac-2fa3-f1a9-f5ed-2099d721fb2c/%E1%84%89%E1%85%A1%E1%84%8C%E1%85%B5%E1%86%AB%20%E1%84%87%E1%85%A7%E1%86%AB%E1%84%92%E1%85%A7%E1%86%BC.png)&#x20;

* 편집할 사진을 불러온 후, 도구 바에서   버튼을 선택합니다.
* 빨간 동그라미의 핸들을 움직여 원하는 데로 회전하고 변형할 수 있습니다.&#x20;

</details>

<details>

<summary><strong>사진 글자 추가</strong></summary>

* 텍스트 버튼을 이용하여 편집 창의 사진 위에 원하는 텍스트를 덧붙일 수 있습니다. \
  ![](https://www.officenote.co.kr/api/v1/download/744af728-8ebc-1e42-f0f2-e3d24192e36c/%E1%84%90%E1%85%A6%E1%86%A8%E1%84%89%E1%85%B3%E1%84%90%E1%85%B3%20%E1%84%8E%E1%85%AE%E1%84%80%E1%85%A1.png)
* 도구 바에서  <img src="https://www.officenote.co.kr/api/v1/download/b4bf3384-814b-d048-3570-6bb7511f737f/image.png" alt="external_image" data-size="line"> 를 누르면 텍스트 입력 상자가 나타나며 속성 창에는 텍스트 속성이 나타납니다.
* 속성 창에서 텍스트의 속성을 지정한 뒤 텍스트를 입력합니다.
* 속성 창의 적용 버튼을 클릭합니다.&#x20;
* 레이어 창에 텍스트 레이어가 추가된 것을 확인할 수 있습니다.

</details>

<details>

<summary><strong>필터 효과</strong></summary>

<img src="https://www.officenote.co.kr/api/v1/download/6dd4b3fa-4e61-d001-fe70-77a731895c8f/%E1%84%91%E1%85%B5%E1%86%AF%E1%84%90%E1%85%A5.png" alt="" data-size="original">

* 도구 바에서  <img src="https://www.officenote.co.kr/api/v1/download/70c42d20-84ec-c485-b740-ea977de5403a/image.png" alt="external_image" data-size="line"> 버튼을 클릭 합니다.
* 속성 창에서 원하는 옵션을 선택합니다. 필터가 적용된 결과를 편집 창에서 바로 확인할 수 있습니다.
* 지정한 필터 효과를 사진에 적용하려면 속성 창에서 적용을 누릅니다.&#x20;

</details>

<details>

<summary><strong>편집 전 내용 되돌리기</strong></summary>

&#x20;        ![](https://www.officenote.co.kr/api/v1/download/01da40bd-905e-fd9f-bc35-8e5929fd2e30/%E1%84%91%E1%85%A7%E1%86%AB%E1%84%8C%E1%85%B5%E1%86%B8%20%E1%84%82%E1%85%A2%E1%84%8B%E1%85%AD%E1%86%BC%20%E1%84%83%E1%85%AC%E1%84%83%E1%85%A9%E1%86%AF%E1%84%85%E1%85%B5%E1%84%80%E1%85%B5.png)

* 사진을 편집한 뒤 이전 단계로 돌아가려면 도구 바에서 <img src="https://www.officenote.co.kr/api/v1/download/205d7740-bce0-402b-6548-4d6ab2b157ee/image.png" alt="external_image" data-size="line"> 버튼을 선택합니다.
* 실행 취소 버튼을 이용하여 취소한 편집 내용을 다시 실행하려면 도구 바에서  <img src="https://www.officenote.co.kr/api/v1/download/2fe6981a-7800-d333-d398-1d330f64de89/image.png" alt="external_image" data-size="line"> 버튼을 선택합니다.
* 편집한 내용을 모두 취소하고 사진을 원래대로 돌리려면 도구 바에서 <img src="https://www.officenote.co.kr/api/v1/download/baad491f-7b25-0c8f-73cc-c1a977cef5c0/image.png" alt="external_image" data-size="line"> 버튼을 누릅니다.

</details>

3. 도구 바에서 선택한 도구에 따라 세부 <mark style="background-color:orange;">\[속성 내역]</mark>이 나타납니다.
4. 작업 중인 <mark style="background-color:orange;">\[레이어 목록]</mark>을 미리보기와 함께 보여 줍니다.\
   \- 삭제할 레이어에서 <img src="https://www.officenote.co.kr/api/v1/download/6fd4d2e1-3ab5-ae1a-85a5-94f9a9e6d329/image.png" alt="external_image" data-size="line"> 버튼을 선택하여 레이어를 삭제할 수 있습니다.\
   \- 편집 창에서 숨기려는 레이어를 선택한 뒤 <img src="https://www.officenote.co.kr/api/v1/download/685a9b1c-71c5-bfed-dbbf-2946bbdf6065/image.png" alt="external_image" data-size="line"> 버튼을 선택하여 레이어를 숨길 수 있습니다.\
   \- 레이어를 선택한 뒤 원하는 위치로 드래그 하여 위치를 변경할 수 있습니다.&#x20;
5. 편집 창에 작업 중인 이미지를 <mark style="background-color:orange;">\[확대/축소]</mark>할 수 있습니다.&#x20;
6. 세부 편집을 <mark style="background-color:orange;">\[실행]</mark>할 수 있는 영역입니다.
7. 사진 편집을 <mark style="background-color:orange;">\[취소]</mark>하거나, 편집이 완료된 경우 <mark style="background-color:orange;">\[확인]</mark>을 클릭하여 편집한 이미지를 삽입합니다. <br>