워드프레스에서 기본적으로 제공하는 있는 텍스트 편집기는 블록 편집기입니다. 블록 편집기에서 줄 바꿈을 하거나 간격을 늘리더라도 실제 글에서는 간격이 반영되지 않는 것을 볼 수 있습니다. 이는 블록 편집기는 블록 단위로 글을 편집하는데, 우리가 입력한 ‘엔터’는 줄을 바꿔주는 역할을 하는 것이 아니라 새로운 블록을 추가 시켜 주는 역할을 하기 때문입니다. 이번 글에서는 워드프레스에서 문단과 문단 사이에 간격을 넣은 방법에 대해서 알아 보겠습니다.
1. 편집기 화면과 실제 화면 (발행 글) 차이
워드프레스 블록 편집기에서 ‘엔터’를 치면 편집기 화면 상으로는 여백이 삽입된 것처럼 보입니다. 하지만 실제 발행 된 글에서는 해당 여백이 사라짐을 볼 수 있습니다. 아래 핑크색으로 표시된 영역이 줄 바꿈을 통해 여백이 삽입된 것처럼 보이지만 실제 브라우저에서 보여질 때는 해당 부분이 사라집니다.
블록편집기 화면
실제 사이트 화면
2. 문단(단락)과 문단(단락) 사이 간격 주는 방법
워드프레스를 처음 사용하면 이 블록 편집기에서 줄 바꿈이 되지 않는 문제로 인해 많은 어려움을 겪는 데 해결 방법은 간단합니다. 문단 블록을 만든 후 글 입력창에서 [Shift + Enter]를 치면 됩니다. 편집기 화면상에서는 ‘Enter‘와 ‘Shift + Enter‘가 동일하게 보이지만, 글을 발행 후 브라우저에서 보이는 모습은 차이가 납니다.
- Enter: 단락 바꾸기, <p> 태그 삽입
- Shift + Enter: 줄 바꾸기, <br> 태그 삽입
블록 편집기 화면
실제 사이트 화면
3. 여백 도구 사용하여 단락 및 블록 사이 간격 벌리기
단락과 단락, 단락과 사진, 제목과 단락 등 블록 사이 간격을 삽입하는 또 다른 방법은 [여백 도구]를 이용하여 간격을 삽입하는 것입니다. 여백을 삽입하고 싶은 위치에서 워드프레스 상단 좌측에 있는 [블록 추가] 버튼을 추가해서 [여백 도구]를 선택합니다.
사각형 형태의 여백 상자가 만들어 지는데 마우스를 이용하여 여백 박스 높이를 조정합니다. 마우스 사용이 불편하거나 정확한 높이 설정을 원한다면 오른쪽에 있는 설정에서 원하는 높이를 입력합니다.
[여백 도구]를 삽입 후 글을 발행하면 아래와 같이 높이 100px의 여백이 삽입되어 있음을 볼 수 있습니다.
이 번글에서는 워드프레서 블록 편집기에서 줄 바꿈을 통해 문단과 문단 사이에 여백을 삽입하는 방법에 대해서 알아 보았습니다.