0.5를 내놓은지도 얼마 안 됐는데 틈나는대로 작업을 해서 기어이ㅜ 0.6까지 왔습니다.
https://xetown.com/1564278
1. 먼저 양해의 말씀
- 사이즈 조절과 좌측 정렬에 대한 요구가 적지 않았습니다. 애드온 설정에서 옵션을 제공하는 것도 방법이지만 고심 끝에 커스터마이징 용도로 별도의 css 파일을 제공하기로 했습니다.
- 근데 이게 쉬운 일이 아니었습니다. 스타일 커스터마이징을 준비하다보니 그동안 미디어 하나하나 추가할 때마다 얼마나 주먹구구식으로 작업을 해왔는지가 눈에 보이더라구요.ㅜ
- 코드가 복잡해서 좀 고민이 됐는데, 기존 버전과 불화감을 최소화하려면 이전의 임베디드 요소에 div를 하나 더 감싸줘야 간편하게 접근할 수 있겠다는 결론이었습니다.
- 그런데 바로 이 때문에 혼란스러운 상황이 예상되기도 합니다. 요소 배치 방식과 기본 스타일이 바뀌면서 이전에 입력하셨을 콘텐츠들에 부정적인 영향을 줄 수 있기 때문이죠.
- (새로 다운로드 받는 분들은 상관 없겠지만) 그래서 이번 판올림은 신중하게 고려해주셨으면 합니다.
- 1) 예전 글들에 들어가서 아이프레임을 지웠다가 다시 임베딩을 하는 등 글 수정을 해야 할 수도 있고, 2) (꼼수긴 하지만) 기존 글의 원활한 로딩을 위해 별도로 스크립트를 짜셔야 할 수도 있거든요. ... 이런저런 방법들이 생각나긴 하는데, 역시 개별 문서들에 대한 직접 수정 말고는 뾰족한 대안은 잘 떠오르지 않네요ㅜ
- 어떤 상황이 펼쳐질지 미리 가늠해보고 싶으시다면 제 사이트에 들어가서 개발자 도구로 한번 살펴보셔도 좋을 것 같아요. (사이트 홍보 아님요) 여깁니다 :) https://dev.aporia.blog/board_fKje44/category/35668
2. 스타일 커스터마이징은 어떻게 하는가?
- 암튼 0.6.0에서는 스타일 커스터마이징을 좀 더 안정적으로 하실 수 있겠습니다.
- 콘텐츠들의 최대 넓이를 제한하고, 좌정렬, 중앙정렬, 우정렬할 수 있습니다.
- 그동안 애드온의 코드를 직접 수정하셨을 텐데요. 이번부터 제공되는 custom.css 파일을 통해 좀 더 간편하게 접근이 가능합니다.
예) 가로사이즈를 640으로 고정하려면? custom.css 파일 안에 다음과 같이 기입합니다.
.media_embed_wrapper { max-width: 640px; }
예) 중앙 정렬을 하고 싶다면? (이번 버전부터는 좌측 정렬이 기본이에요!) custom.css 파일 안에 다음과 같이 기입합니다.
.media_embed_wrapper { margin: 0 auto; text-align: center; }
- 일단 이번에 배포하는 자료에는 가로 최대 넓이 640px, 가운데 정렬로 설정된 커스텀 파일을 동봉했습니다.
- 이 안의 내용을 지우시면 미디어 콘텐츠들은 가로 100%, 좌측 정렬됩니다.
3. 그런데 왜 별도 파일인가?
- css 파일로 커스터마이징하는 것을 꺼리실 분도 있을 줄 압니다. 그냥 애드온 설정에 넣어주면 더 편하긴 하죠. 저 역시 그렇게 시도해봤습니다.
- 실제로 본문 읽기 화면에서는 애드온 설정값이 잘 먹었습니다. 근데 문제는 글쓰기 화면이었어요.
- CK에디터에서는 인라인으로 처리되는 style 태그의 내용을 인식을 못하더라구요. (그걸 하려면 별도의 플러그인을 설치해야 하는데, 굳이...) 다만 css 파일 형태가 되어야 인식이 가능했죠ㅜ
- 그래서 불편을 끼치더라도, 커스터마이징을 제공하려면 css 파일을 통한 접근이 불가피하다고 생각했습니다.
4. 혹시 또 달라진 점은?
- 몇몇 미디어들을 새로 추가하기도 했지만 그중에서도 눈여겨보실 부분은 네이버와 다음의 vod와 라이브 영상을 임베딩할 수 있게 됐다는 겁니다.
- 영상 콘텐츠가 포함된 주소를 입력창에 텍스트 상태로 붙여넣으면 해당 주소에 포함된 vod나 라이브 영상이 들어가게 되는 거죠. 그 결과가 바로 다음과 같습니다ㅋ
- 다음 VOD : https://dev.aporia.blog/board_fKje44/37103
- 네이버 VOD : https://dev.aporia.blog/board_fKje44/36899
- 개인적으로 심혈을 기울였는데 ... 뭐 물론 그냥 혼자 오버하는 걸 수도 있기는 합니다.
5. 그럼 이만 줄입니다.
- 추신 : 자료 만드는 것만큼 소개글 쓰는 것도 힘드네요;;;;
트위터,인스타,유트브 정도의 컨텐츠가 작성되어 있습니다.
업데이트 감사합니다. 수고 많으셨습니다.