http://brm.io/matter-js-demo/#slingshot 소스 검색하다가 찾은 사이트인데 물리 법칙을 표현하기 위한 자바스크립트로 만들어진 게임이 있습니다. 돌을 쏴서 드럼통 밀어내기 게임인데 석궁의 돌을 클릭 드래그 해서 각도와 강도를 잘 조절해 화살표 있는 곳에 쌓으면 가장 빠르게 떨어트릴 수 있습니다. 하지만 조절이 안되면 드럼통이 원하지 않는 곳에 위치하게 되고 시간이 더 걸립니다. 하다보면 방법을 알게 됩니다. 포인트는 방금 전에 쏜 돌의 각도와 강도를 잘 기억해야 어떤 위치로 돌을 올릴지 알 수 있습니다.
트위터 부트스트랩 기반의 무료 템플릿입니다. 원 페이지 사이트를 만들 수 있으며 디자인이 상당히 좋습니다. 픽셀부다(pixelpuddha)는 소스를 얻기 위해 제가 자주 방문하는 사이트 중 하나입니다. http://pixelbuddha.net/freebie/freebie-white-one-page-html-template 위 페이지에서 하단으로 스크롤하면 데모를 볼 수 있는 링크와 다운로드 링크가 있습니다. http://evick.ru/market/white/image_slider/index.html 데모 사이트 링크입니다. 로드 되는데 좀 시간이 걸립니다. 압축파일을 해제하고 html 폴더로 들어가면 두개의 폴더가 있는데 그중 하나의 폴더의 이미지들은 더미 이미지인데 다른 하나의 폴더에서 복사해 사용하..
엔바토(Envato)는 씸포레스트(Themeforest)의 모기업으로 디자인 관련한 다양한 소스를 판매하는 회사입니다. http://market.envato.com/ 이 사이트에서는 매월 무료 버전을 공개하는데 이번 달에는 제법 쓸만한 소스가 많습니다. 상단의 메뉴 중 하나, 예를 들면 themeforest를 클릭합니다. 중간 쯤으로 스크롤하면 Free라는 섹션이 있습니다. 현재 유료로 판매되고 있는 소스를 4월에 한해 무료로 사용할 수 있습니다. 첫 번째 썸네일이 Uncle Hummer라는 워드프레스 테마인데 워드프레스 테마의 경우 무료라는 것이 거의 의미가 없습니다. 왜냐하면 워드프레스가 업데이트 되면 호환이 안될 수도 있기 때문에 이에 맞춰 테마도 업데이트 돼야 하는데 무료 버전의 경우 업데이트가 ..
지난 번에 페이팔 피싱 관련해서 글을 올렸는데 이번에는 페이팔 사이트와 아주 똑같은 사이트를 만들어서 피싱 유혹을 하고 있습니다. 이것은 정말 영어를 잘 한다해도 깜빡 속아넘어갈 상황입니다. URL이나 웹에 대해 잘 알지 못하면 쉽게 당할 수 있습니다. 이번에 온 이메일은 위처럼 생겼습니다. 잘 거래도 안하는데 뭔가 제한이 있다는 내용입니다. 보낸 사람의 메일을 보니 outlook.com입니다. 아주 수상하죠. 그래서 Login In Now 버튼을 클릭해봤습니다. 첫 화면 하단에 한글도 나옵니다. 요즘 페이팔이 한글도 지원하는 추세에 맞춰 한글을 사용하는 것입니다. 하지만 상단의 URL이 아주 엉성합니다. 일반인들 이런 것 잘 안보죠. 진짜 페이팔 사이트와 비교해보면... 얼른 보기에는 아주 똑같습니다...
지난 2월에 원고를 완료했지만 편집 디자인 작업과 리뷰가 다소 늦어져 4월 20일에 서점에 나옵니다. 표지 디자인이 나왔으니 이제 인쇄 작업을 거치면 책이 나오게 됩니다. 서적 예제 사이트 http://bootstrap.diywordpress.kr/ 책에서 만든 사이트입니다. 다만 홈 페이지 메뉴와 One page 메뉴에서는 여러 가지 제이쿼리 플러그인의 테스트를 위해 추가한 페이지이니 서적에는 포함되지 않았습니다. 책을 이해한다면 소스를 이용해 다양한 슬라이더를 만들 수 있습니다. 예약 판매 Yes24 알라딘 교보문고 인터파크 11번가 강컴닷컴 동영상 보조 강좌 안내 트위터 부트스트랩으로 만드는 워드프레스 테마 서문 필자가 처음 부트스트랩을 접했던 것은 의뢰를 받아 웹사이트를 제작하던 때였습니다. 이 ..
웹 개발 시 유용한 사이트를 소개합니다. http://tympanus.net/codrops/ 웹 개발자라면 웹디자인 소스를 찾다가 한번쯤은 들렀을 정도고 아주 유명한 사이트입니다. 새로운 글들이 올라와 데모를 확인하면 아주 놀라울 정도로 참신합니다. 메뉴에서 Tutorial은 웹 개발 시 필요한 소스와 함께 깊이 있는 강좌가 있습니다. 개별 글에서 데모를 확인할 수 있습니다. Playground 메뉴에서는 최신의 기술을 사용한 강좌가 있습니다. Blueprints에서는 실험적인 강좌와 소스가 있습니다. 중요한 것이 Collective 메뉴의 콘텐츠인데 이곳에는 여러 사이트에서 새로 올라온 글 중 신선한 내용을 목록형태로 보여주고 해당사이트로 이동할 수 있습니다. 이 사이트를 통하면 이와 비슷한 사이트를 ..
'반짝 반짝 작은 별'이라는 동요가 있다. 알고 보니 에이비씨 송과 곡이 같다고 한다. 더 알고 보니 모짜르트가 작곡했다고 한다. 원곡은 프랑스 민요 '아 어머니 들어주세요'라고 하는데 이를 바탕으로 12개의 변주곡을 만들었다고 한다. 그래서 원래의 제목도 "'아 어머니 들어주세요'에 의한 변주곡 C장조"이다. '4월은 너의 거짓말'이란 일본 애니메이션을 보게 됐는데 피아노를 치기를 그만둔 주인공이 여자 친구의 강압에 못이겨 카페에서 아이들에게 가르치는 장면에서 이 곡이 나왔다. 뒷 부분에서 변주곡 1로 들어가는데 아주 멋진 장면이어서 유투브를 찾아봤다. 12개의 전 곡이 무려 8분이나 된다. 변화가 아주 다양해서 하나도 지루하지가 않다. 중간에 고양이가 어슬렁 거리며 지나가는 장면이 압권이다.
워드프레스로 만들 수 있는 웹사이트 중 가장 복잡한 것이 쇼핑몰입니다. 우커머스라는 플러그인으로 쇼핑몰을 만들 수 있는데 제가 만들어본 것 중 가장 복잡한 구조에 속합니다. 간단한 쇼핑몰이 아니라 프리미엄 테마에 여러가지 플러그인이 추가됐는데 무려 50여개나 됩니다. 이렇게 많은 플러그인을 사용해도 쇼핑몰이 제대로 작동할지 의심이 됐지만 현재로서는 아주 만족할 만 합니다. 의뢰인도 만족하고 있고 직접 블로그 글도 올리고 페이지도 만들고 있습니다. 여태까지 왜 이런 도구를 사용하지 않았을까 후회하면서 말이죠. 이번 글에서는 쇼핑몰 사이트 제작 사례를 이야기 해보겠습니다. 책도 써야 하고 일이 바쁘다보니 의문사항에 답변을 드릴 수 없는 점 이해 바랍니다. 서버 해외쇼핑몰을 만들기 위한 전제조건이 해외 서버입..
워드프레스 4.2 베타 버전이 예정보다 하루 늦어 오늘 발표됐습니다. https://wordpress.org/wordpress-4.2-beta1.zip 이전 글에서 예정된 기능의 추가 중에서 메뉴 커스터마이저만 제외되고 에모지(Emoji:絵文字; 일본어) 기능이 추가됐습니다. 에모지는 우리나라에서는 이모티콘이라는 말로 사용하는데 아주 오래전부터 사용했었죠. icontexttextfull texticonfull text:):-):smile::lol::D:-D:grin::oops::(:-(:sad::cry::o:-o:eek::evil:8O8-O:shock::twisted::?:-?:???::roll:8)8-):cool::!::x:-x:mad::?::P:-P:razz::idea::|:-|:neutral::ar..
원곡: 좋아한다는 가수 레일라 헤더웨이(Lalah Hathaway) MP3:
우커머스에는 기본적으로 설정된 주문 상태가 있습니다. 이들 주문 상태 외에 사용자 정의 해서 주문 상태를 추가할 수 있는 방법을 알아보겠습니다. /** * Register new status**/function register_custom_order_status() { register_post_status( 'wc-shipping', array( 'label' => '배송중', 'public' => true, 'exclude_from_search' => false, 'show_in_admin_all_list' => true, 'show_in_admin_status_list' => true, 'label_count' => _n_noop( '배송중 (%s)', '배송중 (%s)' ) ) ); register..
워드프레스는 4개월을 주기로 새 버전이 출시됩니다. 4.1 버전이 나온지 2개월 됐는데 벌써 4.2 버전이 개발 중이고 3월 중에 베타 버전이 나오고 4월 중에는 정식 버전이 출시됩니다. 4.2 알파 Nightly 버전 - https://wordpress.org/nightly-builds/wordpress-latest.zip December 19, 2014Trunk is open for business. (Post 4.1)January 21, 2015Initial 4.2 meeting.February 18, 2015 (+3w)Decision time for features being developed as a plugin. Merge window opens for any blessed for 4.2.Fe..
트위터 부트스트랩은 손쉽게 레이아웃을 만드는 도구로 자리를 잡았습니다. 2.0 버전의 인기에 이어 한층 더 사용하기 좋아진 3.0 버전이 이미 많은 인기를 얻고 있습니다. 현재 4.0 버전이 나올 예정으로 올해 초에는 알파버전이 나올 듯합니다. 이전에 2.0 버전을 기준으로 책을 출간했는데 절판 되어 3.0 버전을 기준으로 새로운 책을 준비하고 있습니다. 원고가 거의 완성됐고 리뷰와 인쇄 과정을 거치면 2월 말이나 3월 초 4월 중에는 출간 될 것으로 보입니다. 이전의 책에서는 단순히 HTML 페이지만 만들었는데 사실 HTML로는 이메일도 보낼 수 없죠. 그래서 생각했던 것이 단순한 CMS를 사용해보고자 했습니다. CMS를 이용해 부트스트랩으로 레이아웃을 만들고 실질적으로 사용할 수 있는 웹사이트를 만들..
그동안 웹상에서는 JPG, PNG, GIF 포맷의 이미지가 많이 사용됐는데 최근 새로운 이미지 포맷이 개발돼 화제입니다. 이미지는 주로 JPG 형식을 사용하지만 용량을 줄이기 위해 압축 시 로스가 많았지만 그런대로 쓸만 했습니다. 최근에 개발된 BPG 포맷은 JPG와 동일한 화질을 유지한 채 2분의 1 크기 이상으로 줄일 수 있습니다. BPG는 Better Portable Graphics(더 좋은 휴대용 그래픽)의 약자입니다. BPG는 동영상의 새로운 기술인 HEVC(High Efficiency Video Coding)에서 파생된 것입니다. 동영상은 하나의 프레임의 이미지를 연속 동작으로 보여주는 것인데 이 기술의 하나의 프레임이 BPG인 것입니다. 그동안 사용됐던 H.264/MPEG-4 AVC 기술을 ..
우커머스 2.2 버전이 발표된지 얼마 되지 않았고 계속 버그 수정을 업데이트 중입니다. 이런 상황에서 새로운 버전의 개발도 이뤄지고 있습니다. 현재는 이른바 블리딩 엣지(Bleeding Edge ; 최첨단 버전) 버전으로 불리고 있습니다. 아직 알파 버전 상태도 아닙니다. 우커머스 관련 개발자님들은 미리 대비하는 차원에서 소개드립니다. https://github.com/woothemes/woocommerce 위 깃허브에서 내려받아 깃허브 관련 파일을 제거하면 됩니다. 그러면 아래와 같이 됩니다. 바뀐 부분을 알아보면 다음과 같습니다. 아직 자세한 설명이 없기 때문에 코어부분에 대해서는 알 수 없습니다. 일반 설정 부분이 간단해졌습니다. 이곳에 있던 상품 관련 내용은 상품 탭으로 이전했습니다. 일반 탭에 ..
워드프레스 4.1 버전이 발표됐습니다. 워드프레스는 새 버전 발표 시마다 재즈 아티스트의 이름을 붙이는데 이번은 제주 가수이자 피아니스트인 디나(Dinah; Dinah Washington)으로 명명 됐습니다. 당초 12월 8일 예정이었으나 다소 늦어져 11일 후인 오늘 발표됐습니다. 표면상으로 추가된 기능에 대해 알아보겠습니다. 1. 새로운 기본 테마 Twenty Fifteen Twenty Fifteen은 구글 노토(Noto) 폰트 패밀리의 도움으로 흠 없는 언어 지원을 갖추고 있습니다. 직관적인 타이포그래피는 어떤 화면 크기에서도 가독성이 높습니다. 콘텐츠는 스마트폰, 태블릿, 노트북 또는 데스크탑 컴퓨터 등 어떤 기기에서 보더라도 항상 중앙에 자리잡게 됩니다. 노토 폰트는 세계 여러 나라의 언어로 사..