Category Archives: WordPress

wordpress에 Gist GitHub Shortcode 넣기

초보자가 프로그램을 공부를 하면서 정리도 할 겸 이 곳에서 간단한 소개와 함께 써놓았죠. 워드프레스(wordpress)에서 코드를 보여주기 위해서 단순하게 글에 작은 코드를 넣고 보게끔 만들었습니다. 그런데 그 코드들을 변경하고자 할 경우, 번거롭게 글도 고쳐야 했습니다. 이때 https://gist.github.com를 사용하여 코드를 저장하고 관리하는데 더 편리한 것을 알게되었습니다. 그러면 여기에 저장되어 있는 작은 코드를 어떻게 하면 wordpress에 넣을까 하고 플러그인을 찾아봤습니다. 역시 있더군요.

https://wordpress.org/plugins/gist-github-shortcode/

사용하는 방법은 단순합니다. 우선 플러그인 Gist GitHub Shortcode을 설치합니다. 그런 다음 이 플러그인을 Plugins 메뉴에서 찾아 활성화(activate) 해 줍니다. 그런 다음 자신이 올린 여러분들이 gist에 올린 코드들의 주소를 찾아서 올리시면 됩니다. 제가 올린 코드의 URL 주소는 https://gist.github.com/dialektike/2b711592501eaf4f964d와 같은데 여기서 2b711592501eaf4f964d이 바로 코드 주소입니다.

// from string to int in swift
let intString: String = "256"
let stringInt: Int? = Int(intString)

상세한 것은 아래 링크를 참고하시면 됩니다.

https://wordpress.org/plugins/gist-github-shortcode/screenshots/

PS: 최근에 WordPress에서 뜨고 있는 Jetpack by WordPress.com 을 설치하셨다면, 굳이 위의 플러그인을 설치하실 필요가 없습니다. 제가 궁금해서 질문을 올렸는데 답변을 받았습니다1. Shortcode Embeds이라는 기능이 위의 플러그인 기능을 대신합니다. 따라서 Jetpack을 까셨다면, gist-github-shortcode을 까실 필요가 없습니다. 심지어 두 개가 충돌하기도 합니다.Jetpack by WordPress.com 을 설치하고 Gist를 사용하시는 방법은 Gist — Support — WordPress.com을 보시면 됩니다.

프로그램 코드와 같은 형식의 글을 넣어보자!

조금 제목이 이상하지만, 가끔 글을 올릴 때 컴퓨터 명령어나 프로그램 코드와 같은 것들을 올려야 될 경우가 있습니다. 바로 Mac OS X 에서는 어떻게 MD5 체크(MD5 Check)를 할까?라는 글이 그렇습니다. 여기에는 터미널에서 사용하는 명령어를 넣어야 하는데 그냥 쓰는 글로 쓰면 구별이 안될 것 같아서 다르게 넣으려고 인용으로 넣었지만 보기가 좋지 않았습니다. 그래서 찾아보다 다음 플러그인을 발견했습니다. 쓸만합니다. 사용법도 물론 간단합니다.

WP-Syntax

굴림 폰트 사용시 크기 비교 및 특징

인터넷에서 뭔가를 할 때, 가장 고민하는 문제가 바로 서체, 유식하게 말하다면 서체 문제가 아닐까 생각이 듭니다. kukie님 홈피에서 귀충한 글을 발견했다. HTML에 관심이 있으시면 곱씹어 읽어볼 충분한 가치가 있는글입니다. 강추합니다.

http://kukie.net/resources/font_gulim/#gulim

Best of CSS Design 2007

 뭐 아시는 분은 아시겠지만, 제가 웹디자인에 관심이 있습니다. 이번에 http://www.webdesignerwall.com/이라는 곳에서 올해의 Best of CSS Design 2007 을 선정했습니다. 관심 있으신 분은 다음 링크를 클릭하시면 됩니다. 뭐 한국은 아직도 윈도우에서 벗어나고 있지 못한데, 참 많은 것이 빨리 변하고 있습니다.

http://www.webdesignerwall.com/trends/best-of-css-design-2007/

블로그에서 각주를 달아봅시다!

여기에 글을 올릴려고 하는데, 긴 글이다 보니 각주를 달아야 될 일이 생겼습니다. 고민하고 있었는데 역시 찾았습니다. 아직 설치는 하지 않았지만, 설치할 계획입니다. 자세한 것은 아랫 글을 참고해주세요!

WP-Footnotes (a plugin for WordPress)

http://www.elvery.net/drzax/more-things/wordpress-footnotes-plugin/

Web 디자인에 유용한 곳 링크 모음

제 실력은 미천함에도 불구하고, 문과에서 컴퓨터를 잘 다루는 사람이 없는 관계로 관리하고 있는 홈페이지가 좀 있습니다. 뭐 그래도 Html과 같은 것은 어느 정도 알지만, 미적 표현력이 떨어진 나머지, 디자인적인 측면에서는 거의 50점도 못 되는 수준입니다. 그래서 웹디자인 실력을 늘리고자 자료를 조사했습니다. 이 아래 링크들은 아마도 책같은 곳에서 찾은 것 같은데, 정리한 파일에는 책이름이 적혀 있지 않네요. 출처불명이 되는군요. 그래서 좋은 곳들을 모아둔 것이니 참고하세요!

  1. http://www.w3.org/:여기는 웹은 물론이고 웹 표준을 매일 개발하는 기관
  2. http://www.webstandards.org/: 1998년에 설립된 조직으로 웹 표준을 대중에게 널리 알리고 웹 디자이너와 개발자들이 표준에 따라 개발할 수 있는 교육자료를 제공한다.
  3. http://www.alistapart.com/: 웹 표준으로 디자인하기 위한 테크닉과 장점에 초점을 맞춰 웹 컨텐트를 만들기 위한 디자인, 개발에 관련된 내용을 소개하는 웹진
  4. http://www.csszengarden.com/: 동일한 마크업 구조를 사용하는 자기만의 CSS 디자인을 만들어 제출하여, 보여주는 사이트, 지속적인 업그래이드 되고 있습니다.
  5. http://www.diveintoaccessibility.org/: 웹 접근성에 대해 논의하는 홈피
  6. http://web-graphics.com/: 하이퍼텍스트 디자인 자료, 링크, 설명 들을 모아놓은 곳입니다. 표준에 관련된 디자인과 개발 분야의 새로운 소식을 알려줍니다.
  7. http://www.digital-web.com/: 웹 디자이너를 위한 컬럼, 뉴스, 튜토리얼을 제공하는 온라인 잡지입니다.
  8. http://www.zeldman.com/: 1995년부터 웹 디자인과 관련된 소식과 정보를 올리고 있는 ‘웹 표준의 대부’라고 불리우는 제프리 젤드만의 홈피. (참고: 개인적으로 강추하는 홈피입니다. 정말로 인쇄매체처럼 잘 만들어져 있는 곳입니다. 고수의 숨결을 느낄 수 있습니다.)
  9. http://www.mezzoblue.com/: css 젠 가든(http://www.csszengarden.com)인 Dave Shea의 홈피입니다.
  10. http://www.meyerweb.com/: CSS의 전문가라고 알려진 에릭 마이어의 홈피입니다. 그는 넷스케이프 사와 웹표준에 관련된 컨설팅과 작업을 했습니다.
  11. http://www.whatdoiknow.org/: 훌륭한 표준 웹 사이트 작업에 많이 참여한 토드 도미니의 개인 웹 사이트입니다.
  12. http://www.saila.com/: 온라인 저널리즘부터 웹 구축까지 캐나다 뉴미디어에 관한 소식을 전하는 싸이트. 웹 표준과 관련된 고품격 정보들을 전해줍니다.
  13. http://www.cssdrive.com/

페이지 넘어가는 답변 기능을 가진 플러그인을 깔아서 방명록 만들기!

항상 홈페이지를 만들때, 항상 방명록을 어떻게 구현하는가하는게 문제였습니다. 저번에 Movble Type(이하 MT)을 사용할 때에도 이것은 문제였습니다. 그래서 항상 제로보드와 같은 별도의 프로그램을 사용하여 방명록를 만들어 왔습니다. 그런데 제가 디자인과 프로그램 실력이 미천해서, 홈피와 방명록을 같은 디자인으로 만들지 못하겠더군요. 항상 제 홈피는 망명록과 홈피 디자인이 따로 놀게 되었습니다. 어느날 우연히 kukie님의 글을 보니, 쉽게 만들수 있을 것 같은 생각이 들더군요! 물론 이런 생각이 무모했죠 ^^; kukie님의 글을 몇번씩 숙독한 다음, 따라하기 시작했습니다. 그러다가 실패를 거듭해서 포기하고 있었습니다(참고: 피오넬님의 포스트도 참고했습니다!).

그러다가 오늘 다시 kukie님이 방명록을 만들면서 소개한 Keyvan Minoukadeh님의 WordPress Paged Comments Plugin을 다시 가봤습니다. 자세히 보니, 이 플러그인이 방명록만을 위한 것은 아니더군요! 답변이 많아지면, 페이지를 넘겨주고, 답변의 순서도 바꿔주는 기능을 합니다. 앞의 글을 보시면 설치하는 법이 잘 나와있지만, 제 경험을 바탕으로 다시 정리해보겠습니다. (참고로 저는 WordPress 2.0을 사용하고 있습니다. 마지막에 1.5 사용방법이 나오지만, 제가 몰라서 과감하게 삭제했습니다!)

  1. 파일을 받아서 압축을 풉니다.
  2. 설정을 바꾸시려면, paged-comments-config-sample.php 파일을 수정해서 paged-comments-config.php 이라는 이름으로 바꿔 저장합니다. 파일 안에 보시면, 설명이 다 들어 있습니다. 우선 페이지당 나오는 답변의 숫자 설정, 답변의 순서(쓴 시간 순서가 앞쪽으로 혹은 뒷쪽으로) 변경 등등을 변경하실 수 있습니다. 물론 만들어 쓰신 파일이 있으시면, 하실 필요없습니다.
  3. paged-comments.php과 앞에서 만드신 paged-comments-config.php, 이 2개의 파일을 plugins folder(wp-content/plugins/)에 올립니다.
  4. 앞에서 압축을 풀어 놓은 folder를 보면, 테마별로 comments-paged.php 파일이 있습니다. 지금 쓰시고 게시는 테마가 이중에 있으시면, 그 파일을 테마 폴더(예:wp-content/themes/”쓰시는 테마이름”/)에 올리세요. 없으시면, ‘default’ folder에 있는 있는 comments-paged.php을 쓰시는 테마 폴더에 올리시면 됩니다.
  5. 자신이 쓰시는 테마 폴더(앞에서 comments-paged.php을 올린 곳)에서 template file(일반적으로 single.php and page.php 등등 )들을 수정합니다. 파일을 열어서 “comments_template();” 이라고 적혀 있는 곳을 지우시고 다음과 같이 적어줍니다. 저도 요기에서 조금 헛갈렸습니다. 프로그램에서 명령어를 바꿔주는 것이더군요. 앞에서 올린 파일을 써서 답변을 만들고, 만약 없으면 있던 것을 쓰자! 뭐 이런 명령어입니다. 파일을 열고 단순히 고치시면 됩니다. 저는 page 기능을 이용해서 방명록에서만 쓰려고 했기 때문에, page.php만 고쳤습니다. if (function_exists(‘paged_comments_template’)) paged_comments_template(); else comments_template();
  6. 마지막으로 admin interface에 가서 앞에서 올린 paged_comments을 활성화(active)시켜주면 됩니다. 문론 WordPress 2.0에만 이 기능이 있습니다.
  7. 설치는 다했는데, 마지막으로 Page기능을 이용해 방명록을 만들겠습니다. admin의 write menu에서 적당한 이름의 page(ex. guestbook)를 생성해줍니다. 그런 다음 admin의 Manage menu에서 pages를 선택하면 앞에서 만든 page가 있습니다. 여기서 view를 누르시면, 그 page가 뜹니다. 그리고 edit누르시면 내용이 들어가게 됩니다. 여기에 쓰시고 싶으신 글을 쓰시면 됩니다. 다음은 제 방명록 페이지 링크입니다(http://www.epistemology.pe.kr/guestbook/). 이것을 방명록으로 링크를 걸어서 사용하시면 됩니다.

블로그에 음악을 달아봅시다.

뭐 아시는 분은 다 아시겠지만, 요즘 온라인게임이 유행입니다. 그런데 거기에 쓰이는 음악들이 수준이 대단합니다. 이번에 World of Warcraft라는 온라인 게임이 확장팩을 만들고 있습니다. 거기에 쓰인다는 노래를 들었는데, 정말로 좋더군요! 그래서 이 노래를 홈피에 올리고자, 기억을 더듬어서 다음 링크를 찾아냈습니다. 오래전부터 깔고 싶었던 것인데, 이제서야 손을 대는 군요!

http://www.1pixelout.net/code/audio-player-wordpress-plugin/

설치 방법은 쉽습니다. 위에 링크에 있습니다만, 잠시 정리하겠습니다.

  1. 우선 파일을 받아서 압축을 푼 다음, plugins 디렉토리(폴더라고도 하죠!)에 업로드합니다. 요기서 조심해야 할 부분이 받으시면, 다음과 같은 위치로 꼭 올리셔야 됩니다. audio-player.php은 plugins 디렉토리에 있어야 되고 audio-player라는 plugins 디렉토리에 올리셔야 됩니다. 저처럼 그냥 풀어서 통채로 plugins 디렉토리에 올려버리면 안됩니다. 소리가 나오지 않게 됩니다.
  2. 다음으로 노래를 저장할 디렉토리를 만듭니다. 기본설정은 루트디렉토리로 되어있습니다. 따라서 루트에 audio 디랙토리(폴더라고 하죠!)를 만듭니다.
  3. 그리고 나서 WP admin에 가서 이 플러그 인을 활성화(Activate)시킵니다.

그러면 설치는 대락 마무리됩니다.

[audio:nellisa_1159342751_ES_SilvermoonIntro01.mp3|autostart=no|bgcolor=0x000000]