Editus(에디투스) 프론트앤드 에디터 기능을 알아보자. Part2

인터넷과 웹 정보

"Editus : Simpler, Faster, Easier Writing in WordPress"

오늘은 43Gear.com의 프론트 앤드 에디터 “Editus”를 소개하는 두번째 시간으로 Editus(에디투스) Toolbar(툴바)를 살펴보기로 하겠다.

< 그림 1. 43Gear.com에 로그인을 하면 볼 수 있는 Editus. >

우선, 43Gear.com에 로그인을 했다는 가정에서 다시 출발해 보겠다. 43Gear.com에 로그인을 하면 위 이미지와 같이 화면 하단에 “Editus 프론트 앤드(front-end) 에디터”가 기어(Gear)들이 블로그 포스트를 작성해 주길 기다리고 있는 모습을 보게 될 것이다. 그리고 우리는 지난 “Editus(에디투스) 프론트앤드 에디터 기능을 알아보자. Part1”을 통해서 위 이미지 하단 “Editus 프론트 앤드(front-end) 에디터”의 두 개의 메뉴중 노란색 마크가 되어있는 “Add Post”를 클릭한 후, 새로운 블로그 포스트 작성을 할 수 있다는 사실을 살펴보았다.

< 그림 2. 새 블로그 포스트 제목 설정 화면. >

다음으로 “Add Post”를 클릭했다면 > 제일 먼저 위 이미지와 같이 제목을 입력하는 창이 나타난다. 내 경우 “Editus(에디투스) 프론트앤드 에디터 기능을 알아보자. Part1”를 입력했다. 그리고 “Create” 버튼을 클릭하면 블로그 포스트 페이지가 자동으로 생성된다.

< 그림 3. “노란색 X” 표시 아이콘을 클릭하면 Editus Toolbar로 돌아간다. >

새로운 블로그 포스트 작성이 끝이 났다면,, 

• 먼저 위 이미지 오른쪽 끝 “디스크 이미지” 아이콘을 클릭하여 작성한 블로그 포스트를 저장하자. 물론, 글(블로그 포스트) 저장은 글을 쓰는 중간 또는 언제라도 저장을 반복적으로 할 수 있다. 
• 그런 다음, 위 이미지 왼쪽 끝 “노란색 X” 표시 아이콘을 클릭하여 “Editus Editor Workflow(워크플로우)를 빠져 나가보자!

그러면 아래 이미지와 같이 “Editus Editor Toolbar”를 보게 될 것이다...

< 그림 4. Editus Toobar로 전환된 모습. >

< 그림 5. Editus Toolbar. >

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

“꼭 기억해두자! Editus Editor가 다른 기타 에디터나 워드프레스 대시보드 환경과 조금 다른 부분은 바로 이 부분이다. Editus Editor는 글 작성 이후에, 특성 이미지 삽입, 카테고리 지정, 태그 삽입이 가능하다.”

앞 선 블로그 포스트 “Editus(에디투스) 프론트앤드 에디터 기능을 알아보자. Part1”에서도 밝혔듯이, "Editus 프론트 앤드 에디터"는 본문 작성이 먼저다. 그런 다음, 특성 이미지(featured image) 삽입, 카테고리 지정, 태그 삽입을 할 수 있다.

• Editus 작업 흐름: 본문 작성 > 특성 이미지(featured image) 삽입 > 카테고리 지정 > 태그 삽입.

이제  앞 선 “그림 3” 왼쪽 끝 “노란색 X” 표시 아이콘을 클릭했다면 “그림 4, 그림 5”와 같이 Editus(에디투스) Toolbar(툴바)를 보게 될 것이다. 우리는 “그림 5. Editus Toolbar” 중, “2. Post Setting”을 클릭한다.

< 그림 6. Editus Toolbar 중, 2. Post Setting 화면. >

특별히 설명할 부분은 없다. 누구나 알고 이해할 수 있는 부분이기 때문이다. 그럼에도 불구하고 설명을 더하자면,,,

 

• 특성 이미지(featured image) 삽입 부분엔 “연필 아이콘”이 있을 것이다. 그 “연필 아이콘”을 클릭한 후 특성 이미지(featured image)로 사용할 이미지 또는 사진을 첨부하면 된다.
• 내 경우엔, “Editus(에디투스) 프론트앤드 에디터 기능을 알아보자. Part1” 블로그 포스트를 이미 공개했기 때문에 “Status(등급 또는 상태)”가 “Publish(출판)”으로 되어있다. 만약 기어(Gear)가 작성한 블로그 포스트를 아직 공개하지 않았다면 “Status(등급 또는 상태)”는 “Draft(원고, 초안)” 즉 저장(Saved)된 상태로 표시될 것이다.
• 그 다음 아래 부분에 카테고리 지정 창이 있다. 마우스를 이동해 카테고리 지정 창을 클릭하면 카테고리 목록이 나타나고 원하는 카테고리를 지정하면 된다. 참고로 43Gear에는 총 9개의 카테고리가 존재하고 이미 작성한 “Editus(에디투스) 프론트앤드 에디터 기능을 알아보자. Part1”은 9개의 카테고리 중 “IT : 웹/소프트웨어/하드웨어” 카테고리를 지정하였다.  
• 그 밑으로 태그 입력 창이 있다. 원하는 태그를 입력하고 “Enter(엔터)” 키를 누르면 태그 삽입이 위 “그림 6” 처럼 삽입된다.
• 마지막으로 그 밑에 날짜(Post Date)이 있는데, 날짜는 기어(Gear)들이 “새 블로그 포스트”를 작성한 그 날짜가 자동으로 지정된다.

모든 작업을 마쳤다면 “Save(저장)” 버튼을 클릭하자!

앞 선, “그림 5. Editus Toolbar” 밑에 총 다섯개의 툴바 메뉴를 간략하게 소개했다. 그 중 “1. Edit Post”는 위 “그림 3”번과 같이 다시 “Editus Editor Workflow”로 돌아가기 위한 기능이다. 만약 작성한 글(블로그 포스트)을 수정하고 싶거나 또는 아직 끝나지 않은 블로그 포스트라면 글 작성 중간에 “Editus Toolbar”로 이동후 특성 이미지(featured image) 삽입, 카테고리 지정, 태그 삽입 후, 작성하던 본문으로 이동하고 싶을때 사용하면 되겠다. “2. Post Setting” 부분은 위 “그림 6”과 함께 설명되었다. 이제 “3. All Posts”를 살펴보자.

< 그림 7. All Posts 화면. >

위 “그림 5. Editus Toolbar” 중 “3. All Posts”를 클릭하면 위 이미지와 같이 “All Posts 화면”이 나타난다. All Posts는 기어(Gear)들 개개인이 작성한(했던) 모든 블로그 포스트를 확인할 수 있는 기능이다. 그 중 위 “그림 7”의 노란색 테두리는 마우스를 이동했을때 위 “그림 5. Editus Toolbar”중 “1. Edit Post”로 이동할 수 있는 옵션과 “휴지통 아이콘” 즉 삭제 할 수 있는 옵션이 주어진다.

PS: 한가지 기억해야 할 점은, 잠시 위 “그림 1. 43Gear.com에 로그인을 하면 볼 수 있는 Editus” 로 가보자. 처음 43Gear에 로그인을 하면 볼 수 있는 화면 하단의 “All Posts”와 “Editus Toolbar”의 “3. All Posts” 아이콘은 동일한 아이콘이다. 따라서 어디서든 언제든 자신이 작성한 글을 확인할 수 있고, 수정 및 삭제가 가능하단 것이다.

마지막으로 “그림 5. Editus Toolbar” 중 “5. Add Post”는 “새 블로그 포스트 작성”을 위한 아이콘이다!

PS: 한가지 기억해야 할 점은, 잠시 위 “그림 1. 43Gear.com에 로그인을 하면 볼 수 있는 Editus” 로 가보자. 처음 43Gear에 로그인을 하면 볼 수 있는 화면 하단의 “Add Post”와 “Editus Toolbar”의 “5. Add Post” 아이콘은 동일한 아이콘이다.

"Editus는 그 기능이 직관적인 만큼 동일한 아이콘, 동일한 버튼일땐, 그 기능도 동일하다. 그만큼 사용이 편리하기도 한 것이다."

따라서, “5. Add Post”를 클릭하고 “새 블로그 포스트”를 작성하려면 위 “그림 1 > 그림 2”와 동일한 작업을 해주면 되는 것이다.

43Gear의 프론트 앤드 에디터 “Editus”를 위한 두번째 블로그 포스팅을 이렇게 마무리 하겠다. 참고로, “그림 5. Editus Toolbar” 중 “4. Revisions”에 관한 설명은 “Editus(에디투스) 프론트앤드 에디터 기능을 알아보자. Part2”에선 하지 않기로 하겠다. 그 이유는, 내가 아직 사용을 해보지 못했고, 43Gear의 프론트 앤드 에디터 “Editus”를 설명하며 꼭 이미지를 첨부하여 쉽게 이해할 수 있도록 하고 싶은데 사용을 해보지 못했기에 첨부할 이미지도 존재하질 않는다. 차 후, “4. Revisions”은 꼭 다시 언급하도록 하겠다.

다음 시간엔, 마지막으로 “Editus(에디투스) 프론트앤드 에디터의 숨은 기능. Part 3.”를 통해서 Editus(에디투스)의 숨겨진 기능들을 알아보고, 유튜브 삽입방법(Tip), “UL, OL” 리스트 태그 삽입 Tip 등을 살펴보려 한다.

시간이 많이 지나더라도,, Editus(에디투스)에 관한 블로그 포스트는 따로 메뉴얼 페이지를 만들 것이다. 누구라도 한 번만 사용해보면 메뉴얼 페이지가 왜 필요한지 이해 할 수 없겠지만, 그래도 43Gear.com의 프론트앤드 에디터 “Editus(에디투스)”를 기념하기 위해서, 그리고 누구라도 좀 더 쉽게 블로그 포스트 작성을 할 수 있게 하기 위해서 그렇게 하도록 하겠다.

Editus(에디투스) 프론트앤드 에디터 기능을 알아보자. Part 1.

Editus(에디투스) 프론트앤드 에디터 기능을 알아보자. Part 2.

Editus(에디투스) 프론트앤드 에디터의 숨은 기능. Part 3.

Editus(에디투스) 프론트앤드 에디터 기능을 알아보자. Part2

-잼-