별건 없고 이번에 일모리네 html 틀을 새로 잡아주면서 겸사겸사해서 새 워드프레스 테마를 같이 곁들였습니다. 단순한만큼 유저분들께서 자신의 입맛에 맞게 수정 하시면 되겠습니다. 일모리네가 워낙 더덕더덕 붙은게 많았었는데 뼈대를 다시 잡아주면서 제가 수정하기 아주 좋아졌습니다.

이번 테마는 Publisher Spring 입니다. 4가지 버전이 있으며 모두 기본 디자인 컨셉은 같습니다. 하드코어 블로거들을 위한 테마 입니다.

• Publisher Spring - 기본 버전입니다. 해더와 왼쪽에 본문 오른쪽에 사이드바의 기본적인 형태입니다. 무한대의 변화 가능성이 있는 버전입니다. PREVIEW
• Publisher Spring Pro 1 - 사이드바가 필요없으신 프로 블로거들을 위한 버전입니다. PREVIEW
• Publisher Spring Pro 2 - 역시 사이드바가 없습니다. Pro1 과 다른점은 상단 타이틀 옆에 자신의 이미지나 로고를 넣을수 있는 부분입니다. 나머지는 같습니다. PREVIEW
• Publisher Spring Black - PSP1 의 검은 배경 버전입니다. PREVIEW

블로그 테마 혹은 스킨 이라는 것이 얼굴 이기때문에 자신만의 특별한 무언가가 없다면 같은 테마를 적용한 어느곳과 같은곳인줄 착각하게 됩니다. 그러니 받으시고 수정하는데에 자신감을 가지시길 권합니다. 워낙 간단한 스킨이라 style.css에 몇 주석을 넣었으니 수정에는 문제가 없을듯 합니다. 누구나 가능합니다.

저작권은 style.css 의 theme maker profile 부분 말고는 외부에는 일부러 넣지 않았습니다. 제가 뼈대부터 만든거긴 하지만 멋지게 수정하실꺼라 믿고 그냥 이대로 공개합니다. 그래도 찝찝하시다면 맨 하단에 조그만하게 일모리네 링크를 넣어주시면 되겠습니다.

Best Viewed in Mac. (as always)

혹시나 테터용이나 티스토리용으로 요청이 많아지면 TT용도 생각해보겠습니다.

Technorati Tags: ilmol, publisherspring, skin, theme, tistory, wordpress, 일모리

1. 일단 첫번째로 저번에 공개한 볼스킨테마를 기본으로 검은색 사이드바와 추가, 그리고 크리마스를 맞아 클스마스 버전으로 2개를 겸용할수 있도록 제작해 올립니다. 스크린샷은 밑을 보시면 아시다시피 몇일간 제 블로그에 적용해 놓았던 검은 버전과 빨간색의 사이드바를 가진 크리스마스 버전입니다.
   

   

   아시다시피 약간의 html 과 css 를 아시면 모든 부분을 수정 가능하며, 특히 포토샵이나 일러스트레이터를 사용하여 메인 이미지를 수정하면 자신만의 새로운 블로그 테마를 가질수 있습니다. 약간의 수정으로 완전 새로운 블로그 테마를 갖는것이죠. 코드들도 최대한 간결하게 써 놓았기 때문에 알아보시는데 문제 없을거 같습니다. ^^

   특별히 css 파일 말고 php 파일을 건드릴것이 있다면, sidebar.php 입니다. 맨 윗부분에 있는 프로필 사진 경로를 잘 잡아주셔야 하는데 각각의 폴더에(images_black, images_red 폴더들) 맞는 이미지가 들어있습니다. png 를 사용하면 간편하겠지만 IE 지원이 미숙하니 힘겹게 할수 밖에 없었네요.
   이 테마 다운로드
   *회색테마가 기본으로 되어 있습니다.

2. 두번째 테마는 공허함을 사랑하시는 ㅡㅡ;; 혹은 심플을 신봉하시는 분들께 사용가능토록 올립니다. 정말 아무것도 없으며 타이틀 이미지만 빼면 정말 공허하죠. 하지만 그만큼 타이틀 이미지만 잘 표현하면 자신만의 멋진 테마로 가꿀수 있다고 생각됩니다. ^^
   

   볼스킨과 마찬가지로 sidebar.php 를 여셔서 현재 Jonathan Ive 사진으로 되어있는 부분을 자신의 사진으로 바꿔주세요. 또한 메뉴 부분을 현재는 사이드바에 넣어져 있지만 index.php 를 보시면 아시다시피 윗부분에도 사용할수 있습니다. style.css 에서 sitemenu 의 display:none; 을 지우시면 사용가능하며 위치는 #sitemenu 값중 bottom, left 값을 고치시면 어느곳에나 위치 가능합니다.
   이 테마 다운로드

3. 세번째 테마는 볼스킨보다 하나적은 2개의 테마를 담고 있습니다. 하나는 ‘겨울이야기’ 버전이고 다른 하나는 ‘신선한 블로그’ 버전입니다. 스샷을 보시면 아시겠지만 간단한 타이틀이미지와 2개의 아이콘 교환으로 전체의 분위기가 바뀌는 효과를 볼수 있겠네요. 몇줄 안되는 소스를 손봄으로써 여러분들도 테마를 마음껏 뽐낼수 있습니다. ^^
   

   

   이 테마 또한 위에다가 메뉴삽입이 가능하며 사이드바에 자신의 사진 넣는거 잊지 마시구요. 물론 Jonathan Ive 사진으로 남겨 놓으셔도 됩니다. 거의 신봉되어오는 인기인 이니까요. ^^
   이 테마 다운로드
   *겨울 테마가 기본으로 되어있습니다.

테마는 블로그의 얼굴입니다. 아이디를 먼저 보기 전에 테마가 눈에 들어오며 아이디를 보지 않아도 내가 어디 아시는 분에 집에 와있구나 생각이 들게 되어있습니다. lunamoth님의 댁에가면 인터넷을 돌아다니다가 우연히 들어가게 되더래도 이곳은 lunamoth님 댁이구나를 확실히 알수 있습니다. 김중태님댁도 그리하죠. 한마디로 자신만의 테마가 필요하다는 것입니다. 그것이 최대한 가능하도록 타이틀 이미지에 최대한 자유스럽게 한 것들이고 자유스러운 테마입니다. 수정하시고 잘 쓰시기 바랍니다.

-말씀드렸듯이 skin by 일몰 부분은 거북하시면 지우셔도 무관합니다. ㅡㅜ;
-특별한 에러나 이상한 부분은 리포트 부탁드리겠습니다. 모두들 워프로 이사오세요 ㅡㅡ;;;;
-테터용을 테터1.0이 공개되는기간에 혹 공개할지도 모르겠습니다. 축하하는 의미에서,,, ^^;;

++
참고로 테마 안에서의 변화는 단순히 style.css 를 여셔서 맨 밑에 있는 코멘트 부분을 잘 보시면 됩니다. 다른 수정은 거의 불필요 하며 style.css 의 수정만으로 테마 안에서의 변화가 가능합니다. 한마디로 간단하죠

이번 테마는 지금 쓰고 있는 제 블로그의 테마와 거의 같지만 더욱 가볍고 코드들도 별로 없는지라 개인에게 맞도록 수정하기와 css xhtml 공부하기에는 알맞다고 생각됩니다. 특히 거의 대부분을 자유스러울수 있도록 비워둔지라 멋지게 수정할수 있지 않을까 하네요. 한창 하늘이님과 해코님께서 워드프레스로 바꾸신 절묘한 타이밍과 함께 워드프레스만의 전용 테마를 공개하게 되서 아주,,, 쑥스럽습니다. ㅡㅡ;;;

아시다시피 몰스킨 구입후 너무 잘 놀고 있는 와중에 이름을 붙이게 되어서 페이지의 형태로 디자인되었기 때문에 Blog+Moleskine 블로그를 위한 몰스킨으로 해서 볼스킨 Boleskine 이라고 해 놨습니다. 뭘 하나 써도 가치있게 자부심을 가질수 있는 테마라고 생각이 됩니다. Blog 또한 하나의 Web+Log, 웹의 기록이니까요.

header.php, index.php, comment.php, sidebar.php, style.css 의 5개의 파일로 이루어져 있으며 필요시에 single.php, category.php 등을 제작하셔서 알맞게 사용하실수 있겠습니다.

앞으로 새로운 색상 테마들이 계속 업데이트 될것이구요, 필요한 부분이 있다면 보충하며 쓰겠습니다.

참고로 확인해 보세요

다운받으시고 압축을 푸셔서 몇가지 수정이 필요합니다. 뭐 절대적이진 않지만,

1. sidebar.php 를 열어 9번째줄, “읽고계신 글은” 이라는 부분의 전체줄을 지우시고 자신의 소개글로 바꾸실수 있습니다. 물론 워프 자체내의 블로그 설명 부분을 고치면 자동으로 업데이트됩니다.
2. sidebar.php 에서 마지막 부분인 ‘기타링크’ 부분을 자신에게 맞도록 링크를 넣으시고 링크하나하나마다 <li> 로시작해서 </li> 로 마치시면 됩니다. 물론 워프 자체에서 링크를 컨트롤 할수 있지만 약간의 수정이 필요합니다.
3. sidebar.php 의 중간부분에 최근덧글 부분이 코멘트화 되어 있습니다. 물론 간단히 <!– 부분과 –> 부분을 지우시면 활성화가 되지만 꼭 최근코멘트 플러그인을 설치하셨을 경우에만 이 기능을 활성화 하시기 바랍니다.
4. sidebar.php 맨위의 3번째 줄에 <img src=”images/img_wordpress.gif” alt=”my profile pic” id=”profilepicture” /> 부분을 자신의 사진이라 타 이미지로 바꾸시면 좋을꺼 같습니다.
5. index.php 에서 div id=”title” 부분을 style.css 에서 #title 로 찾으셔서 background 주로를 바꿈으로 원하고 싶은 그림이나 이미지로 전환하시기 바랍니다.
6. 바로 그 위에가 메인 메뉴 부분입니다. 잘 고쳐쓰시길
7. index.php 맨 밑에 div id=”footer” 부분을 좀더 채워 넣으시고 알차게 그리고 힘차게 정보들을 넣으십시오. 블로그의 묘미또한 이런거 아니겠습니까 ^^
8. header.php 를 열어서 메타태그가 비어있는곳에 꽉꽉 채워 넣으세요. 설명 많아서 나쁠꺼 없습니다.
9. 일단 px 단위로 폰트 사이즈가 지정되어 있지만 괜찮으시면 em 으로 바꾸어 주시면 좋겠습니다. 물론 가능하시다면요

코드와 짜임새가 너무 심플,간단하여 수정하시는데에 어려움이 없을꺼라 생각이 됩니다. 혹시나 생기시면 답글 달아주시면 되겠습니다.

테마는 옷. 얼굴

테마는 옷과 같으며 얼굴과도 같습니다. 가끔 웹에서 의 만남은 가물가물 하다가도 특별한 디자인의 홈을 가면 정확하게 떠오르는경우 많이 격어보셨을겁니다. 반대로 아무리 기억을 되세기려해도 테마가 바뀌는 바람에 한창 고민하는 경우도 겪어 보셨을겁니다. 그만큼 이미지는 머리속에 오래남으며 기억과도 긴밀히 연관이 되어 있습니다.

그러므로 이 스킨이 간단한 만큼 그 안에서 몇가지 타이틀이나 여러가지 변화를 주어 자신만의 색을 확실히 찾으시는 블로그로 거듭나시길 바랍니다. ^^ 그를 위해서 간편하게 제작된것 이니까요. 마구 뜯어 고치세요 ㅎㅎ

저작권

저작권은 뭐 표시 하셔도 되고 안하셔도 됩니다. 일단은 Boleskine 이라고 넣어 놓았습니다만 불편하시다면 빼셔도 무관합니다. 테마에 무리 안가도록 간편하게 적어 넣었구요. 다만 style.css 안 맨 위에 있는 boleskine 소개 부분만 남겨두신다면야 괜찮습니다.

다운로드

하루만 Boleskine 테마로 적용해 놓겠습니다.

네 무슨 리뉴얼을 밥먹듯이 하느냐 하시겠지만 이번엔 특별한 사정이 있어서 새롭게 만들수 밖에 없었습니다. 턱스님께서 주장하시는만큼 정력맨은 아닙니다. ㅡㅜ;

이번에 리뉴얼 하면서 꽤나 배운점들이 많습니다. 워드프레스와도 더욱 친해진듯 하고, XHTML strict 1.1 을 잘 써보기도 했구요. 예상외로 까다롭기는 했습니다만 보시다시피 99% 하얗다 보니 뭐 많이 기술이 들어가지 않아서 무사히 통과한 부분들이 대부분입니다. 아직 코멘트 부분을 통과해야하기 때문에 나중에 손봐야 하구요, 그런대로 괜찮습니다.

코딩을 다듬어야 하겠지만 일단 베타테스팅 적으로 열어놓겠습니다. 건의나 지적 바랍니다. ^^
http://semkim.net

음,, 한가지더. 제목에 “그리고” 를 붙였는데, 이유가 있습니다.

이번에 ‘믿거나 말거나’ 식으로 shortstat 통계 플러그인의 방문자 수가 약 9만8천 정도 입니다. 곧 10만을 넘을듯 합니다.통계가 시작된것은 지난 6월 5일. IE 유저는 40%, 불여우는 23%. 한국이 4만, 미국이 8천 일본이 3천 정도 입니다. 하지만,,, 방문자 수는 검색로봇 스펨등 여러가지를 고려 할때 반 때고, 거기서 약간 떼어내면 총 4~5만 정도로 생각하고 있습니다. 아무튼 많은 분들께서 찾아 주시니 너무 감사해서 이벤트를 열고 싶지만 뭐 딱히 방법도 없고 해서, 나중에 웹표준 책으로 하나 드리기로 하고, 글이던지, 어떠한 제작이던지 확실히 무언가 이벤트를 열기로 하겠습니다. 후에 포스팅 하겠습니다. ‘글’ 이 될 가능성이 많습니다. ‘한국 포털에게 말한다’ 라던지 말이죠. . 아무튼 웹표준에 관한 이벤트가 될듯 하니 슬슬 공부하셔도 늦지 않을듯 합니다.

아무튼 너무나 감사드리고, 일단은 이렇게 줄입니다. . .

지금 적용이된 예제를 제 WP 페이지에 가시면 오른쪽 위의 사각형들을 클릭하시면서 보실수 있습니다. 클릭후엔 쿠키로 정보를 남겨서 다음에 접속시에도 적용이 되어 나오게 됩니다. 물론 CSS 파일만 다를뿐 index.php나 모든 파일은 건드리지 않습니다. 파일하나로 바뀌게 되는효과입니다.
강력한 CSS와 XHTML 의 힘이죠

여기저기서 많이 보았지만(잰가든이 그렇게 되어있었죠) 제가쓸수 있는 적용 플러그인을 찾고 싶었습니다. css 파일은 다 만들어 놓았었거든요.

낮잠을 한숨 잔후에 이런저런 경로를 통해 찾게 된 방법을 소개합니다. 원본사이트를 찾았습니다.
많은경우 그저 테마를 복사해서 테마를 하나 더 만든후 안에있는 css 파일만 바꾸어 넣어 테마를 바꾸어 보여주는것은 흔했지만 단순히 css 파일만 바꾸어 주는것은 조금 찾기 힘들었습니다. 힘들었던 만큼 직접 적용하고 보니 괜찮습니다.

거창한 플러그인은 아니고 간단히 파일업로드 후 index 파일에 코드 몇줄만 넣으면 되는 간단한 방법입니다. 들어가 볼까요

#주의!! 순서가 아주 중요합니다. <script> 부분이 절대 스타일시트보다 위에 위치하면 안됩니다. 그럴경우에는 언제나 default가 먼저 보인후에 다른 스타일시트가 적용됩니다

DavidAppleyard 에서 참고를 했습니다.
그리 어렵지 않으니 해보시기 바랍니다. ^^
링크따라 가시면 직접 헤더와 헤더사이에 일일이 새로운 css 링크들을 적지 않아도
알아도 찾아주는 php 코드가 있으니 필요하시면 가보시기 바랍니다.

일단 유저들에게 다양함을 보여줄수 있으니 커다란 장점이 되겠네요
.
.
Go WordPress.
웹표준화에 참여합시다.

처음으로 테이블을 배제한 제작이었기 때문에 여러가지 에로사항이 많았던게 사실이라,, (이러다 구글검색에 ‘에로’ 로 들어오지 않을까 걱정된다) 시간도 꽤 걸리고, 잔손도 많이 갔다.

그래서 그런지 XHTML validation 을 통과했을때의 그 기분이란

• WordPress 는 테터나 조그 같은 설치형 블로그이다. 설치형 블로그, 즉 자신의 계정에서 블로그를 돌리는 것이다. 물론 WP 는 외국산이고, MT(Movable Type 타 설치형 블로그) 의 뒤를 잊고 있는 대세의 블로그이다. 한국에서도 꽤나 많은 분들께서 WP 를 사용하고 계신다.

이번 스킨, 테마 제작은 예전부터 계획하고 있던 포트폴리오 제작에 괜히 연관되어서 시작되었다. 어차피 포트폴리오 사이트는 영어로 제작해야 하니 블로그가 대세인 요즘에 블로그 기반으로 제작하는게 어떨까 하는 생각이었다. 슬슬 직장도 알아봐야 하니 지금이 기회다 라는 억지로 일을 벌리게 되었고 별 생각 없이 시작한 일이 3일간의 쉬는 시간을 다 가져가 버렸다. 덕분에 턱수염이. . . . . ㅡㅜ

처음엔 언제나 써오던 테이블의 버릇을 버리기가 그리 쉽지는 않았다. 계속 DIV 와 OL UL LI 등과 친해져야 했으니 헛갈리는 머리속의 둔함이 얼마나 얄밉던지. . 예전부터 프로그래머의 자존심이라고나 할까? 홈페이지를 만들때는 타 프로그램을 쓰지 않고 직접 TABLE, TR, TD 를 써가며 작업했었다. 몇백줄. 기본이었다. 하지만 생소한 DIV 만으로의 뼈대작업, CSS 로의 살붙이기, 예상외로 내 머리를 복잡하게 했다. CSS 와 이름이 틀린탓에 막히질 않나, ID 와 CLASS 를 바꿔사용했다가 안먹히질 않나, XHTML 에 규격에 않맞는다고 뭐라하질 않나. 하지만 고생끝에 낙이 온다고 XHTML validation 도 통과하고 불여우와 IE 에서의 compatibility 호환성도 확인했다. (아직 사파리나 오페라는 확인 못했슴. 안봐도 어딘가 이상한게 있을것임)

일모리의 영어 블로그로 가기

이렇게 나의 쉬는시간을 다 가져가 버린 스킨(WP 에서는 테마라고들 한다) 을 만들고 나니 꽤나 기분이 좋다. 물론 원래의 계획이었던 포트폴리오 페이지는 아직 만들어 지지 않았지만 ^^ 이미 CSS2를 손에 익혔으니 그리 어렵지는 않을꺼 같다.
대충 디자인도 되어있고. .

지금은 리퍼러 통계를 보여주는 플러그인과 BBCODE 플러그인, 이미지를 올리고 지우는 플러그인을 일단 깔았다. 여러 메타사이트에도 등록도 하고 잔손을 보고 있다. 새집을 지은듯한 기분. 처음으로 wp 를 써보는 호기심도 재미에 한몫 하고 있다.

이곳에 WP 관련 팁이나 여러가지를 올릴생각이다. 오히려 WP 가 깔린곳은 그곳이지만 영어로 운영이 되니 그리 효율성이 없지 않을지.

Hello to the world of WP.

ps. 혹시나 멋진 플러그인을 아시면 도움도 부탁을. . .