Editus(에디투스) 프론트앤드 에디터 기능

[Jamnetkr : 리테일 숍ModeratorNewbie 8,389 points]

< 이미지 1 >

 

 

“Editus : Simpler, Faster, Easier Writing in WordPress. This is 43Gear way.”

 

 

앞 선 포럼 “Editus 프론트 앤드(front-end) 에디터“를 통해서,

43Gear(이하 기어)가 선택한 Editus(이하 에디투스) 프론트앤드 에디터(Editor)를 소개했었다.

오늘은 Editus의 기능을 살펴보려 한다.

 

이 기능편이 필요한 이유는,

43기어를 방문하고 43기어에서 활동하는 기어들에게 이 기능을 소개한 글이 정보와 메뉴얼의 역할이 되어주길 원하기 때문이다.

 

너무나 직관적이고 쉬운 “에디투스” 에디터인데, 너무나 다루기 쉬운 이 프론트 앤드 에디터를 좀 더 쉽게 설명할 수 있는 방법은 뭘까?

43Gear.com을 오랫동안 방문한 기어(Gear)라면, 43Gear에 “FCPX(Final Cut Pro)”에 관한 블로그 포스트가 연재되어 있다는 사실을 알고 있을 것이다.

개인적으로 메뉴얼 또는 어떤 앱이나 하드웨어를 설명할때 작업의 흐름을 보여주는 설명 방식을 좋아한다.

그래서 “FCPX(Final Cut Pro)”를 소개하면서도 내가 작업하는 흐름을 제일 처음 보여줬었다.

 

“에디투스 프론트 앤드 에디터”의 기능을 소개하려는 이 글 역시 그와같은 방식으로 소개해 보면 어떨까.

내가 43Gear.com에 로그인을 한 후 > 어떻게 “에디투스 프론트 앤드 에디터”를 통해 블로그 포스트를 작성하는지 말이다.

 

 

• 먼저, 이 ‘에디투스 프론트 앤드 에디터 메뉴얼’을 작성하기에 앞 서 꼭! 기억해야 할 부분이 있다.
• ‘에디투스 프론트 앤드 에디터’는 기어들이 블로그 포스트를 작성할때 필요한 에디터(툴)이다.
• 따라서 ‘에디투스 프론트 앤드 에디터’로 작성한 모든 글은 43기어 상단 메뉴중 ‘BLOG(블로그)’ 공간에서 확인 할 수 있다.
• 이 메뉴얼 작성을 위해 사용한 이미지중 대부분은, ‘에디투스’ 최신버전 업데이트 이전의 이미지임을 참고해 주기 바란다.

 

 

0. 직관적인 “에디투스 프론트 앤드(front-end) 에디터”는 43기어 어디에서도 사용할 수 있다.

 

 

< 이미지 2. 43기어 메인화면 >

 

< 이미지 3. 43기어 블로그 포스트 카테고리 화면 >

 

 

위 두 개의 이미지를 보자.

43기어의 대문인 포럼과 블로그 카테고리 공간이다.

우리는 두 카테고리 모두에서 하단에 위치해 있는 에디투스 프론트 앤드 에디터를 확인할 수 있다.

 

다시말해서,

43기어의 프론트 앤드 에디터 에디투스는,

43기어 어느 공간에서도 블로그 작성을 위해 준비되어 있고, 사용할 수 있다는 것이다.

모든 기능은 동일하며 사용방법도 동일하다.

다만, 에디투스 프론트 앤드 에디터로 작성한 포스트는 BLOG(블로그) 카테고리에 등록되는 것만 기억하자.

 

 

43기어에 로그인을 한 후 블로그 포스트를 작성하려고 한다면, 먼저 블로그(BLOG) 카테고리로 이동을 해야하는데,

상단 메뉴중 블로그(BLOG) 클릭하고 이동하면, 위 이미지와 같이 화면 하단에 “에디투스 프론트 앤드 에디터”가 기어(Gear)들이 블로그 포스트를 작성해 주길 기다리고 있는 모습을 보게 될 것이다. 하단 “Editus 프론트 앤드(front-end) 에디터”의 두 개의 메뉴중 노란색 마크가 되어있는 “Add Post”를 클릭한다.

 

 

1. 에디투스 : 애드 포스트(Add Post).

 

 

< 이미지 4 >

 

 

• 이미 블로그 포스트를 작성하고자 하는 기어들을 기다리고 있는,
• 화면 하단의 에디투스 레디(Ready) 중, 노란색 마킹이 되어있는 노란색 마크가 되어있는 “애드 포스트(Add Post)”를 클릭한다.

 

 

2. 블로그 포스트의 제목을 입력한다.

 

 

< 이미지 5 >

 

 

• 위 이미지의 노란색 테두리로 마킹이 되어있는 ‘제목 입력 창’이 나타나면 블로그 포스트 제목을 입력한다.
• 그 다음, 만들기(Create) 버튼 클릭.

 

 

3. 이제 자유롭게 블로그 포스트 작성을 하면 된다.

 

 

< 이미지 6 >

 

 

에드 포스트(Add Post) > 제목 입력 > 만들기(Create)을 했다면, 위 이미지와 같이 글을 쓸 수 있는 블로그 포스트 공간이 열린다.

 

이제 기어들이 편한 방법데로 스타일데로 글을 작성하면 되겠다.

내 경우엔, 위 이미지 중 파란색으로 색인이 된 부분(이 문장은 에디투스가 자동으로 생성하는 문구)부터 글을 작성한다.

 

 

4. 이미지 삽입.

 

 

< 이미지 7 >

 

 

• 위 이미지중 노란색 마킹된 “+” 아이콘을 살펴보자.
• 마우스로 노란색 “+” 아이콘을 클릭하면 > 위 이미지와 같이 이미지 삽입 옵션과 따옴표(quote) 삽입 옵션 아이콘이 나타난다.
• 이미지 삽입을 원하면 카메라 아이콘을, 따옴표 삽입을 원하면 따옴표 아이콘을, 원하는 위치에 드래그(Drag)한다.

 

Tip)

• 카메라와 따옴표 삽입을 위해 아이콘을 드래그하면 사진이나 따옴표 삽입을 위한 공간이 자동으로 생성되지는 않는다.
• 따라서 스스로 스페이스 커서를 이용해서 이미지, 사진, 따옴표 삽입을 위한 공간을 확보해야 한다.
• 메뉴얼을 위해 새로운 이미지를 만들지는 않았지만, 현재 에디투스는 위 이미지의 하단 기능 이외에 화면 왼쪽에 “+” 아이콘이 별도로 생성된다.
• 이 “+” 아이콘은 기어들이 글을 쓰는 동안 계속 커서의 위치를 따라 움직인다.
• 그 “+” 아이콘을 활용해도 동일하게 이미지, 사진, 따옴표를 삽입할 수 있다.

 

 

< 이미지 8 >

 

 

• 카메라 아이콘을 드래그했다면 이제 이미지, 사진을 삽입할 수 있게 창이 열리고,
• 원하는 이미지, 사진을 삽입하면 되겠다.

 

 

5. Quote(따옴표)도 삽입해 보았다.

 

 

< 이미지 9 >

 

 

• 위 이미지중 노란색 마킹된 “+” 아이콘을 살펴보자.
• 마우스로 노란색 “+” 아이콘을 클릭하면 > 위 이미지와 같이 이미지 삽입 옵션과 따옴표(quote) 삽입 옵션 아이콘이 나타난다.
• 마우스로 “따옴표(quote)” 아이콘을 드래그하여 자신이 원하는 따옴표(quote)가 삽입될 위치로 드래그 앤 드롭한다.
• 그러면 위 이미지와 같이 “따옴표(quote)”를 삽입할 수 있는 공간이 만들어진다.
• 만들어진 공간에 원하는 문구 또는 문장을 삽입한다.

 

Tip)

• 카메라와 따옴표 삽입을 위해 아이콘을 드래그하면 사진이나 따옴표 삽입을 위한 공간이 자동으로 생성되지는 않는다.
• 따라서 스스로 스페이스 커서를 이용해서 이미지, 사진, 따옴표 삽입을 위한 공간을 확보해야 한다.
• 메뉴얼을 위해 새로운 이미지를 만들지는 않았지만, 현재 에디투스는 위 이미지의 하단 기능 이외에 화면 왼쪽에 “+” 아이콘이 별도로 생성된다.
• 이 “+” 아이콘은 기어들이 글을 쓰는 동안 계속 커서의 위치를 따라 움직인다.
• 그 “+” 아이콘을 활용해도 동일하게 이미지, 사진, 따옴표를 삽입할 수 있다.

 

 

6. Editus editor workflow : 에디투스 작업 환경.

 

 

< 이미지 10 >

 

 

1. 맨 왼쪽 “노란색 X” 표시 아이콘은 위 이미지의 “Editus Editor” 워크플로우(Workflow)를 나가기 위한 버튼이다.
2. 오른쪽 첫번째 “디스크 이미지” 아이콘은 작성하고 있는 블로그 포스트를 저장하기 위한 버튼이다. 
3. 오른쪽 맨 끝 “펜(Pen) 이미지” 아이콘은 작성한 블로그 포스트를 공개할 때 클릭하는 버튼이다.

 

Tip)

• 디스크 이미지 아이콘을 클릭하면 작성했던 블로그 포스트가 저장된다. 블로그 포스트가 포럼과 다른 부분은,
• 작성하고 있던 글이 완성되기 까지 공개/비공개를 기어들이 결정할 수 있다는 점이며,
• 작성하던 포스트가 완성되기까지 언제까지라도 글을 수정할 수 있다는 점이다(물론 포럼도 수정은 가능함).

 

 

하지만, 글을 작성하고, 작성한 글을 공개(펜 아이콘 클릭) 했을 지라도, 대표이미지, 카테고리,태그는 결정하지 않은 상태가 된다. 따라서 작성한 블로그 포스트의 대표이미지를 삽입하고, 카테고리를 정하고, 태그 삽입을 원한다면 다음의 작업을 수행해야 한다.

 

 

• PS: 작성한 블로그 포스트에 대표이미지 삽입, 카테고리 설정, 태그 삽입을 위해 먼저 에디투스의 툴바(Toolbar)를 잠깐 살펴보자.

 

 

7. “Editus Toolbar”를 살펴보자.

 

 

• 위 “6”번을 참고하여 제일 왼쪽 “노란색 X” 아이콘을 클릭하여 “에디투스 에디터 워크플로우”를 빠져나오자.
• 그러면 아래 이미지와 같이 기어(Gear)들이 작성한 모든 모든 글(블로그 포스트)을 관리할 수 있는 “툴바(Toolbar)“를 보게 될 것이다.

 

 

< 이미지 11 >

 

 

1. Edit Post : 위 “7”번의 “Editus Editor Workflow”로 돌아가기 위한 기능이다.
2. Post Setting : 바로 특성 이미지(featured image), 카테고리 지정, 태그삽입을 하기 위한 기능이다.
3. All Posts : 내가 작성한 모든 블로그 포스트를 한 눈에 볼 수 있는 기능이다.
4. Revisions : 내가 작성한 모든 블로그 포스트를 재검토하고 다시 작성할때 사용하는 기능이다.
5. Add Post : 새로운 블로그 포스트를 작성할때 사용하는 기능이다.

 

Tip)

• 이 메뉴얼에 삽입된 이미지 중, 제일 첫번째, 두번째, 세번째 이미지를 살펴보자.
• 기어들이 글을 쓰기를 기다리고 있는 “에디투스 레디(Ready)” 중 우리는 “애드 포스트(Add Post)”를 클릭하고 글을 작성했다.
• 그리고 “애드 포스트(Add Post)” 옆, 올 포스트(All Post)와 위 이미지의 “3. 올 포스트(All Post)는 같은 기능이다.
• 그리고 위 이미지 중, “2. 포스트 셋팅(Post Setting)”을 살펴보자.
• 에디투스 툴바(Toolbar)는, “이미지 11의 노란색 X 아이콘”을 클릭하던, “이미지 1의 올 포스트(All Post)” 클릭후 작성한 글을 선택하던 동일하게 등장한다.
• 그리고 위 이미지 중, “2. 포스트 셋팅(Post Setting)”을 보자. 언제 툴바(Toolbar)가 생성되던지 툴바(Toolbar)에 속한 기능이다.
• 바로 이 “2. 포스트 셋팅(Post Setting)” 을 통해서 대표이미지 삽입, 카테고리 설정, 태그 삽입을 할 수 있다.

 

 

8. 포스트 셋팅(Post Setting).

 

 

< 이미지 12 >

 

 

• 대표(특성) 이미지(featured image) 삽입 : 위 이미지 12중 이미지가 삽입되어 있는 상단 왼쪽 부분에 “연필 아이콘”이 있다. “연필 아이콘”을 클릭후 이미지를 삽입하면 된다.
• 카테고리 설정 : 그 다음 아래 부분에 카테고리 지정 창이 있다. 마우스를 이동해 카테고리 지정 창을 클릭하면 카테고리 목록이 나타나고 원하는 카테고리를 지정하면 된다. 
• 태그 설정 : 그 밑으로 태그 입력 창이 있다. 원하는 태그를 입력하고 “Enter(엔터)” 키를 누르면 태그가 삽입된다.
• 예약 설정 : 그 밑에 날짜 입력란이 있다. 아직 작성한 블로그 포스트를 공개하지 않았다면 날짜를 입력해서 자동으로 공개 날짜를 정할 수 있다.
• 모든 작업을 마쳤다면 “Save(저장)” 버튼을 클릭하자!

 

 

앞 선, “1”번의 내용을 살펴보자. 제일 처음 43Gear.com에 로그인을 하게되면 보게 될 “Editus(에디투시) 활성화” 아이콘을 기억하고 있을 것이다. 위 이미지 “Editus Toolbar” 중 “3. All Posts”와 “5.Add Post”는 앞 선 “1”번의 “Editus 활성화” 아이콘과 동일한 아이콘이며 동일한 기능임을 기억하자.

 

.

[글쓴이]

글