최근 글 목록
-
- 🎈✨🎈✨🎈 진.보.넷.이.2.2.주.년.을. 맞....(1)
- 진보네
- 2020
-
- 스팸 댓글은 운영진이 삭제/대응하고 ...(1)
- 진보네
- 2018
-
- 이용약관 변경 알림(1)
- 진보네
- 2016
-
- 블로그에 동영상 올리기(4)
- 진보네
- 2016
-
- 블로그 서버 업데이트로 인한 버그 신...(1)
- 진보네
- 2015
0. 일단 공지사항!
블로그의 기본, 포스팅 쓰기창의 편집기가 새롭게 업그레이드 되었습니다! 브라우저들이 다양해지고 버전들이 올라가면서 기존 편집기가 여러가지 문제를 가지고 있었는데요, 그 문제들을 해결하는 것이 이번 업그레이드의 목표였어요! 또 업그레이드하면서 그 동안 필요하다고 생각되던 기능들도 몇 가지 추가되었습니다. 이번 개편(!)을 계기로 아주아주 오래된 simple 에디터는 더 이상 제공되지 않습니다. 에디터 기능모음도 간단하게
에디터의 기능들은 대부분이 기존에 있던 것들이고, 여기저기서 사용되는 익숙한 것들이어서 별도의 설명이 필요없을 것 같은데요. 새롭게 제공되는 기능들에 대해서는 약간의 매뉴얼이 필요한 것 같아서, 지금부터 설명을 시작하겠습니다. 일단 추가된 새 기능은 "더 보기"와 "각주달기" 입니다.
1. 주름지게 포스팅하기
"더 보기" 기능은 기존의 "more" 기능이 확장된 것인데요. 기존에는 포스팅 맨 끝에 한 번만 가능하고, 입력창도 따로 존재하는 등 약간의 불편이 있었는데요. 새 에디터에서는 "더 보기" 기능이 에디터 버튼으로 들어갔고, 포스팅의 어디에나 입력할 수 있으며, 1회가 아니라 여러번 사용할 수 있게 되었습니다.
위의 툴바 그림에서 오른쪽 빨간 박스로 표시되어 있는 것이 새 "더 보기" 버튼입니다. "더 보기"를 사용하기 위해서 위의 버튼을 클릭하면 아래와 같은 창이 뜰거예요.
위의 창에 링크-말이라고 되어있는 부분이 포스팅에서 클릭하면 숨겨진 텍스트를 보여주게할 링크에 해당합니다. 기본은 "더 보기"라고 되어있는데, 그대로 가도 되고 숨겨진 텍스트를 수식/연결시켜줄 단어 혹은 문장을 입력할 수 있습니다. 입력한 후 아래에 있는 "예" 버튼을 누르면 편집화면에 아래와 같은 박스가 나타날 거예요.
"더 보기"는 위의 창에서 링크-말에 입력했던 단어이구요. 회색박스는 포스팅이 보여줄 때 숨겨진 상태로 나타나게될 텍스트를 입력하는 부분이예요. 회색박스 안에 텍스트를 다 입력했다면 커서를 아래쪽으로 옮겨서 계속해서 포스팅을 진행할 수가 있구요. 그렇게 진행하다가 다시 "더 보기"를 사용하고 싶다면 처음에 했던 것처럼 버튼을 다시 눌러주면 됩니다. 그럼 똑같은 창이 다시 나타나게 되겠죠. 두 번의 "더 보기"를 사용하고 있는 모습은 아래와 같습니다.
위와 같은 식으로 계속해서 여러번의 "더 보기"를 입력할 수 있구요. 포스팅에서는 링크-말 옆에 화살표 아이콘이 나타나 보일 거예요. 링크-말을 클릭하면 숨겨져있던 텍스트가 나타나고 다시 한 번 클릭하면 나타났던 텍스트가 다시 접혀지게 됩니다. "더 보기"가 많을수록 주름진 포스팅이 되겠네요.
이렇게 숨겨진 텍스트가 나타난다는 말이구요. 지금 이 텍스트는 제가 회색박스 안에 써 넣은 텍스트 이겠죠?! 휴, (-_-) 근데 여기까지 오는데 포스팅 두 번 날렸어요. 흑흑, 다음에는 자동 임시저장 기능을 만들어야겠네요. 흑흑
아, 그리고 위에서처럼 꼭 "더 보기"버튼을 먼저 클릭할 필요없이, 회색박스에 들어갈 텍스트를 모두 적은 다음에 그 부분을 마우스로 드래그해서 영역표시를 한 후 "더 보기" 버튼을 누른다면, 해당 부분이 자동으로 회색박스 안에 나타나면서 에디터에 표시됩니다. 일단 써 놓고 나중에 박스를 칠 수 있다는 말이죠!!
참, 그리고 기존에 입력되어 있었던 "계속 보기"들도 모두 새로운 모습으로 바뀌어있을 거예요. 한번씩 확인은 했는데, 혹시 문제가 있다면 즉시 신고해주세요. (신고방법은 맨 아래)
2. 포스팅에 각주를 달자!
그 다음 새로 생기는 기능은 각주기능인데요. 일단 버튼은 아래 화면에서 왼쪽 아래에 있는 빨간 박스 부분입니다. "각주"라고 써 있네요.
"각주"버튼을 클릭을 클릭하면 현재 커서가 위치한 곳에 footnote라는 태그가 나타나는데요. 그 모습은 아래와 같습니다.
<풋노트>풋노트>1라는 태그 쌍이 나타나는 데요. 각주에 들어갈 부분은 <풋노트>와 풋노트> 사이로 커서를 이동시켜서 그 안에 텍스트를 입력하면 되요. 아래와 같은 모습이 되겠죠.
위의 화면에서 <풋노트>와 풋노트> 사이에는 "태그 사이에 이렇게 각주에 들어갈 내용을 적어주면 됩니다." 라는 텍스트가 들어가 있죠. 이 텍스트는 실제 포스팅이 보여질 때는 이렇게 보여지지 않고, 대신 각주 순서에 따라 숫자로 치환되어서 보여집니다. 텍스트는 포스팅 맨 밑에 숫자와 함께 위치하구요. 본문에서 숫자를 클릭하면 각주로 화면이 이동합니다. 각주의 내용 맨 끝에는 다시 화살표 아이콘이 있는데요. 이 화살표를 클릭하면 다시 숫자가 있던 본문 부분으로 화면이 돌아오구요. 이것도 역시 직접 보자는게 좋겠죠? 위의 에디터 화면이 포스팅에서는 이렇게 보입니다.2 요 옆에 숫자 보이시죠? 사실 에디터에서는 위의 화면에서처럼 <풋노트> 텍스트~ 풋노트>라고 입력되어 있답니다. 숫자와 화살표도 한 번 클릭해보셔요. 참 여기 숫자가 "2"인 이유는 두 번째 <풋노트>풋노트>이기 때문입니다. 잘 찾아보면 위에도 이미 각주가 한 번 사용되고 있거든요.
각주 기능은 위와 같이 버튼을 이용할 수도 있지만, 사실 에디터에 바로 <풋노트> 풋노트> 태그를 입력해서 사용할 수도 있구요. 결과는 똑같습니다. 그리고 "더 보기"와 마찬가지로 각주 내용을 먼저 적은 상태에서 그 부분을 드래그해서 영역표시 한 후 각주 버튼을 누른다면 그 텍스트 부분이 <풋노트>와 풋노트> 태그 사이에 자동으로 들어가서 각주기능이 완성됩니다.
3. 기타
이 편집기는 자유소프트웨어인 fckeditor를 이용하고 있구요. 위에 나온 기능과 몇 가지 사항들은 진보넷에서 수정/추가를 하였어요. fckeditor에 대한 자세한 설명은 툴바에서 물음표 버튼을 클릭하셔도 되고, 위의 링크에 가보셔도 되구요.
무엇보다 중요한 것은 새로운 편집기를 사용하다가 안 되는 것이 있다면 이 곳으로 바로 신고를 해주시구요. 신고할 때는 꼭 문제가 발생한 "운영체제/브라우저/버전" 을 함께 알려주셔요3 또 다른 기능에 대한 설명이나 필요한 다른 기능이 있다면 역시 이 곳으로 알려주시면 될 것 같구요!!
그리고 다음 주 블로그 개편을 위한 블로거 간담회 있는 거 아시죠? 아마도 금요일! 많은 참여와 의견을 부탁드려요!
진보블로그에 그림 올리기 (4) | 2010/05/20 |
블로그에 유투브, 다음 등 동영상 넣기 (13) | 2009/12/10 |
공지사항 쓰기 - 블로그 상단에 글 고정하기 (0) | 2009/12/10 |
수정 누르지 않고 포스트의 공개 여부 상태 변경하기 (5) | 2007/03/14 |
진보네 메일 스팸압박 덜어내기 TIP (2) | 2005/11/02 |
댓글 목록
술래
관리 메뉴
본문
설명이 참 친절도 하시네요(진심으로 하는 말임). 각주를 늘 수동으로 만들어 달다가 이런 자동기능이라니, 너무 과분한 호사를 누리는 게 아닐까 하는 미안한 맘도 약간 들지만 아주 반갑고 고마운 기능이군요. 더보기 기능은 남들은 다 잘 하던데 저는 그동안 하고싶어도 몰라서 못했었는데 이제서야... 마니마니 감사합니다.부가 정보
진보네
관리 메뉴
본문
네~ 앞으로도 멋진 포스팅들 부탁드려요! 각지고(!) 주름진(!) 크부가 정보
laron
관리 메뉴
본문
우왕ㅋ 굳ㅋ!부가 정보
진보네
관리 메뉴
본문
감사합니다.부가 정보
강이
관리 메뉴
본문
오호... 더 보기... 좋습니다. 각주 기능 생긴 것도 좋기는 한데... 각주가 눈에 너무 안 띄네요. 각주 서체 바꾸고 이런 건 어떻게 하는지, 혹시 태그 아시는 분 없을까요?부가 정보
진보네
관리 메뉴
본문
블로그관리화면에서 스킨편집-CSS 부분에 다음과 같이 추가해주시면 되요. 위의 div.footnotes 단락은 아래 각주가 나타나는 부분에 대한 스타일 정의이구요. font-family에는 원하는 폰트(아래의 경우 Dotum돋움)를 font-size에는 원하는 글자크기(12대신 숫자만 변경해주세요)를 color에는 글자색을 지정해주시면 되요. color에는 우리가 흔히 알고 있는 색깔을 지정할 수도 있고, 색상표를 찾아서 #CDCDCD와 같은 색상코드를 입력할 수도 있습니다. 색상표 클릭!div.footnotes {
font-family: Dotum;
font-size: 12px !important;
color: red;
}
혹시 본문에 나타나는 숫자에 대한 스타일을 변경하고 싶으시다면 마찬가지로 CSS에 아래와 같이 입력하면 됩니다. 위와 마찬가지로 font-size에 글자크기를 변경할 수 있구요!
a.identifier {
font-size: 20px !important;
}
근데 각주가 눈에 안 뛴다면 진보블로그 전체적으로도 기본 스타일을 손봤으면 하는데, 어느 정도 사이즈 어느 폰트 어떤 색깔을 좋을지 의견을 주시면 좋을 것 같네요~
부가 정보
강이
관리 메뉴
본문
와와.. 상세하고도 친절한 답변 감사합니다.제가 원래 물어봤던 건, 각주 번호(그러니까 본문에 윗첨자로 나오는 숫자)에 관한 것이었는데... 각주 내용까지 스타일을 주셨군요. 잘 쓰고 있습니다.
그런데 아직 질문이 남아 있습니다.
1. 각주 번호는... 색깔이나 굵은 글씨가 적용 안 되네요(서체는 바꿀 수 있습니다만). 그건 또 어떻게 해야 할까요?
2. 각주 본문에서 각주 1과 각주 2 사이의 줄간격이 너무 빽빽합니다. 이건 해결할 수 없을까요?
각주 스타일에 관한 저의 의견을 말씀드리자면...
1. 저는 책의 레이아웃에 익숙해서 그런지, 책의 본문과 같은 레이아웃을 선호합니다. 각주가 본문보다 20pt 정도 오른쪽으로 들어가 있는데... 본문과 태그 사이에 쑥~ 들어간 부분이 있어서 상체만 튼튼하고, 막 기브스 풀어서 비쩍 마른 다리처럼 힘 없어 보입니다. 그냥 각주도 줄 길이를 본문과 같게 하는 게 낫겠다 싶습니다.
2. 각주 번호는... 음~ 12포인트에 서체를 좀 굵은 것을 쓰고(숫자니까 영문 서체를 써도 될 거 같아요) 색상을... 만약 준다면 빨간색(?)처럼 눈에 잘 띄는 색으로요. 아무래도 웹 화면은 글씨도 책보다 작고, 줄간격도 좁아서 보통의 각주 번호는 찾기가 힘듭니다.
4. 각주 본문은 다 좋은데요. 각주 본문의 번호와 내용 사이에 빈칸 두 칸인 것이 어정쩡하네요. 그냥 한 칸만 떼는 게 좋겠습니다.
[참 그리고... 위의 댓글에 링크해 주신 색상표 링크 깨졌습니다. 저는 별도로 가지고 있는 자료가 있어서 괜찮습니다만]
부가 정보
진보네
관리 메뉴
본문
음, 각주내용간 줄 간격은 약간 띄었구요. 각주번호 색깔은 일단 푸른색으로 수정하였습니다.(흰색바탕에는 빨간색이 더 좋긴 한데, 검은바탕이나 빨간 바탕 쓰시는 분들이 있어서) 이게 개별적으로 수정 가능하면 좋을텐데 현재로서는 뭔가 불가능해요. 이제 시작되는 블로그 개편까지만 초큼 기다려주세요!부가 정보
적린
관리 메뉴
본문
나이쑤! 수고하셨어요. 잘쓸게요~ ^^부가 정보
앙겔부처
관리 메뉴
본문
후후후 금욜에 만나효<부가 정보
마성은
관리 메뉴
본문
새로운 기능들이 모두 마음에 드네요.ㅎ 수고하셨습니다. :)부가 정보
앙겔부처
관리 메뉴
본문
그러게요 지난 주에 이거 테스트하느라고 일도 별로 못했다눙.. ㅎㅎ 금욜에 생령이라도 보내주세욤'ㅁ'부가 정보
marishin
관리 메뉴
본문
일단 간단히 확인해봤는데, 맥오에스텐 10.5.7/사파리 4.0(5530.17)에서 기본적으로 작동합니다. 초창기에는 유독 사파리에서만 제대도 작동하지 않았는데, 이제는 사파리에서도 문제가 없는 듯 하군요.부가 정보
앙겔부처
관리 메뉴
본문
다행이네요~! 우리 활동가 중에도 맥 유저가 있어서 체크하고는 있는데 ㅎㅎ부가 정보
아, 넷!
관리 메뉴
본문
멋집니다. 다양한 글쓰기 형식들을 고려한!그런데, 진보넷에서 수정/추가하신 fckeditor 소스를 공개해 주시면 좋겠습니다. 진보블로그에 적용하는 편집기이지만 자유소프트웨어를 활용하시기도 하셨으니, 다른 곳들에서도 널리 사용할 수 있도록 말입지요.
부가 정보