'분류 전체보기' 카테고리의 글 목록 (3 Page)::VICTORY

글전체에 해당되는 글176건

부트스트랩,익스플로러 반응형 처리

익스플로러 7,8에서는 반응형이 안 된다. 그래서 부트스트랩은 익스플로러 7,8에서 반응형이 가능하도록 하기 위해서 아래처럼 하고 있다. 아래 코드에서 IE9(익스플로러 9)보다 작으면 html5shiv.js와 respond.js를 처리하고도록 하고 있다. 여기에서 html5shiv.js는 html5에 해당하는 것이고 respond.js가 반응형에 관계된 것이다. 그러면 영어인 http://getbootstrap.com/를 익스플로러 7,8로 보면 반응형이 된다는 것을 알 수 있다. 그러면 티스토리도 반응형을 만들 수 있으니 티스토리도 익스플로러 7,8에서 반응형이 돼야 할 것이 맞아야 할 것이다. 그러나 이것 때문에 며칠 동안 고생하다 알았는데 티스토리에서 respond.js가 안 먹히므로 반응형이 안..

2015.02.04

티스토리 블로그를 네이버 블로그와 비교한다.

나는 티스토리 블로그를 주로 네이버 블로그와 비교한다. 블로그는 다음 블로그, 이글루스 블로그 등도 있으나 기능 등 여러가지 면에서 나는 네이버 블로그만 비교한다. 그리고 자체적이 아닌 (사)인터넷전문가협회나 블로그어워드 등 외부적으로 수상하는 곳의 블로그를 보면 대부분 네이버 블로그와 티스토리 블로그가 많다. 다음 블로그도 있기는 하는데 다음 블로그는 개인과 공공 블로그만 있다. 기업 블로그는 하나도 없다고 보면 된다. 기업 블로그중에 대기업 블로그는 거의 티스토리 블로그라 보면 될 것이다. 대기업 블로그가 티스토리 블로그를 선택하지 않으면 워드프레스 등을 선택한다. 혹시 네이버 블로그를 선택하지는 않는다. 아마 네이버 블로그쪽은 제한이 많아서 그런 것 같다. 네이버 블로그쪽도 기업 블로그가 있는데 대..

2014.10.13

꾸준히 업그레이드하는 앱은 다르다.

최근 네이버 앱(어플)을 업그레이드했는데 아래 그림처럼 아주 좋게 변했다. 앱(어플)의 버전은 5.7.3으로 아래 왼쪽에 나온 N이라는 원형 아이콘을 터치하면 원형으로 메뉴가 나온다. 예로 블로그 앱을 들면 티스토리에서 배포한 앱이 현재 최신 버전이 0.9.6이다. 이것이 업그레이드가 없이 계속 정체되면 그저 그렇게 된다. 네이버에서 배포한 블로그 앱이 꾸준한 업그레이드로 좋게 변했다.

2014.10.11

부트스트랩 Carousel를 통한 명언

명언에 대한 출처는 여기이고 부트스트랩(Bootstrap) CAROUSEL을 통하여 다이나믹하게 만들어 보았다. 아래 부트스트랩에 대한 소스는 http://bootsnipp.com/snippets/featured/responsive-quote-carousel에서 구할 수 있다. 단 부트스트랩을 사용하지 않는다면 소스는 필요없고 아래 보이는 부트스트랩은 3.0.0을 사용하고 있다. 그러니 2.*을 사용한다면 필요없다. 반응형 Carousel 부트스트랩 3.0 꿈을 날짜와 함께 적어놓으면 그것은 목표가 되고, 목표를 잘게 나누면 그것은 계획이 되며, 그 계획을 실행에 옮기면 꿈은 이루어지는 것이다. 그레그 S. 레잇 계획은 미래를 현재 속으로 불러들인다. 당신이 지금, 미래에 대해서 무언가를 할 수 있도록 ..

2014.09.29

이 블로그의 부트스트랩 버전

이 글을 쓰는 시점으로 이 블로그는 부트스트랩 3.2.0을 사용하고 있다. 이 블로그는 부트스트랩 최신 버전을 사용하고 있으나 글을 쓴 후 다시 버전업될 것이다. 현재는 부트스트랩 3.2.0이 최신 버전이다. 부트스트랩을 설명하는 한글 사이트는 http://bootstrapk.com/BS3/인데 한글로 된 사이트의 최신 버전은 아마도 3.0인 것 같다. 왜냐하면 최신 버전을 사용하려면 영어 사이트인 http://getbootstrap.com/를 이용하기 바란다. 아래는 부트스트랩 3.2.0에서 작동하는 것이다. 아래 소스는 http://bootsnipp.com/snippets/featured/bootstrap-3d-buttons에서 구할 수 있다. 3D Buttons hot button Sunny but..

2014.09.01

부트스트랩 아이콘이 나오게 했다.

이 블로그에 사용한 등 아이콘이 크롬과 익스플로러에서는 나타났는데 파이어폭스에서는 안 나타나서 아래 그림처럼 최근 부트스트랩의 CDN CSS를 이용했다. 참고로 부트스트랩에서 사용하는 Glyphicons은 여기를 보고 부트스트랩 CDN은 여기를 보기 바란다. 그 다음으로 위에 CSS는 폰트 설정이 "Helvetica Neue",Helvetica,Arial,sans-serif으로 설정됐으니 아래처럼 설정했다. CSS에서 우선순위는 인라인 CSS,style,link순이니 폰트를 로 정의하면 될 것 같아 아래와 같이 html에 폰트를 설정했다.

2013.12.26

트위터위젯을 커스텀설정으로 다양화 할 수 있구나!2

저는 트위터에서 트위터 위젯을 가져오면 위젯에 사이드바가 생겨 안 가져왔는데 커스텀 설정으로 트윗수를 지정하면 사이드바가 생기지 않는다는 것을 알았습니다. 이 블로그의 사이트바에 있는 트위터를 클릭하여 트위터 위젯이 나오는데 사이드바가 없을 것입니다. 이것은 트위터 위젯을 고급옵션으로 커스텀 설정한 것입니다. 트위터 위젯의 커스텀 설정은 트위터 위젯을 가져올 때 아래 그림에서 커스텀 옵션을 클릭하면 볼 수 있습니다. 참고하라고 트위터 위젯은 자신의 트위터에서 나사모양의 아이콘 > 설정 > 위젯을 클릭하면 됩니다.

2013.11.05

반응형 핀보드 블로그만들기 어렵다10

반응형이 아닌 고정된 레이아웃으로 반응형으로 만드는 것은 Yongzz님의 노하우를 보고 http://wred-test.tistory.com/처럼 핀보드 형태로 블로그를 만들었다, 그러나 반응형으로 핀보드 형식으로 만들려고 하니 힘들다. 이때 만드는 것은 고정 형태가 아니라 유동 형태의 반응형이라는 것이다. 반응형이라면 어떤 기기에서든 변함이 없어야 하는데...내가 말하는 것은 브라우저의 가로크기를 조절해도 항상 일정한 아래 같은 그림의 것을 말하는 비슷한 것을 말하는 것이다. 이런 것을 실제로 보고 싶다면 여기를 보기 바란다. 이미 해본 고정형을 말하는 것이 아니다.

2013.10.27

부트스트랩의 그리드 시스템이 헷갈린다.

부트스트랩3에서 그리드 시스템에 헷갈린다. 그래서 어떤때는 템플릿을 보고 무작정 그리드를 쓰거나 내가 이해하는 col-md-*만을 쓴다. 이 블로그도 col-md-*로 그리드를 사용하고 있다. .col-xs-,.col-sm-,.col-lg- 는 봐도 모르니 그냥 이해가 편한 col-md-만 사용하고 나머지는 템블릿을 본다. 참고로 아래 그림의 부트스트랩은 12칼럼인데 이 블로그는 10칼럼으로 하는데 언제 변경될지 모른다.부트스트랩3 그리드에 대한 설명(영어) : http://getbootstrap.com/css/#grid 부트스트랩 3의 그리드시스템을 좋은 것 같은데....헷갈리니 아쉽다.

2013.10.26

며칠간 반응형으로 안 나오는 원인을 몰라 고생했다2

이 티스토리 블로그를 반응형으로 만들었는데 PC로 반응형 사이트를 검사하는 트로이(http://troy.labs.daum.net/)에서 검사하면 이상이 없었으나 나의 스마트폰으로 보면 아래 그림의 첫번째처럼 나와야 하는데 두번째처럼 나와 원인이 고민을 정말 많이 했다. 참고로 반응형 웹사이트는 외국사이트를 찾을 필요없이 http://troy.labs.daum.net/에서 시험하기 바란다. 오늘 알았는데 뷰포인트인 를 지정해주지 않아서였다. 내가 뷰포인트에 대해서는 모르지만 뷰포인트는 모바일웹에서 글자가 모바일웹에 맞게 보이도록 하게 하는 것이다라는 정도로 알고 있다. 정확한지 모르니 아니면 지적해주기 바란다. 그래서 위 구문을 추가하니 스마트폰에서 위 그림의 왼쪽 첫번째 그림처럼 나왔다. 며칠간 이것때문..

2013.10.10

부트스트랩을 쓰니 간단하네

아래 접혔다 펴지는 것이나 3개의 댓글창이 나타나게 하는 탭을 쓴 것은 모두 부트스트랩((Bootstrap)에 있는 기능으로 했는데 정말 쉽다. 그냥 부트스트랩에 있는 설명대로만 하니 간단히 만들어지네. 그러나 http://min-blog.tistory.com에서 jQuery 플로그인으로 많이 구현했던 것에 비하면 너무 단순하게 금방 싫증날 것 같다는 생각이 든다. 생각외에 부트스트랩에는 유용한 기능이 많이 있으니 시간이 있으면 부트스트랩을 더 많이 알아 다양한 옵션을 많이 연구해야겠다. 남들과 똑같으면 금방 싫증날 것 같다는 생각이 들기 때문이다.

2013.10.07

부트스트랩 3으로 변경했다.2

전에는 이 블로그를 부트스트랩(Bootstrap) 2.3.2로 만들었는데 이번에 부트스트랩 3으로 완전히 변경했다. 3이 나온지 한참됐고 2.3.2를 계속 사용하기가 그랬다. 아직 부트스트랩에 대해 모르는게 많지만... 부트스트랩 3 내려받기와 설명 : http://getbootstrap.com/

2013.10.06

플래시 사용하지 않는 것이 그렇게 힘든가.4

플래시를 사용하지 않고 무엇을 하는 것이 그렇게 힘든 것인가 묻고 싶습니다. 이 블로그를 반응형으로 만들어서 스마트트폰에서 이 블로그를 보면 티스토리에서 강제로 모바일 페이지로 이동시켜 모바일웹 스킨을 적용시키지 않고, 레이아웃만 변경해주게 됩니다. 이런 것이 반응형 웹입니다. 현재 PC(컴퓨터)나 태블릿PC에서 이 블로그를 본다면 레이아웃이 다를 것입니다. 단 낮은 버전의 익스플로러는 제외입니다. 현재 크롬 모바일에서는 플래시가 보이지 않습니다. 그러면 페이지에 플래시로 된 것이 있으면 안 보이게 됩니다. 그런데 아래 그림에서 보면 엮인글(트랙백) 주소를 복사할 버튼이 보이지 않습니다. 그 버튼은 아래 그림에 빨간색 사각형에 있어야 합니다. 왜 안 보이냐하면 그 버튼이 플래시이므로 안 보이는 것입니다...

2013.10.04

블로그를 반응형으로 만들었다2

이 티스토리 블로그를 부트스트랩(Bootstrap)을 사용하여 반응형으로 만들었는데 아직 많이 부족합니다. 익스플로러가 아닌 크롬,사파리 등 최신 브라우저에서 브라우저의 가로폭을 줄여보세요. 그럼 레이아웃이 해상도에 창에 맞게 변할 것입니다. 이런 것이 반응형 웹이라는 것을 이해하기 바랍니다. 아직 부트스트랩에 대한 것에 많이 모르니 이상한 것이나 부족한 점이 있으면 가르쳐주기 바랍니다. http://min-blog.tistroy.com을 만들었을 때도 완전 허접했는데 여기도 많은 업데이트가 있으면 많은 발전이 있을 것입니다. 무엇보다도 반응형 기초를 위한 기반을 것에 만족합니다. 거창한 계획에 시작도 못하는 것보다는...

2013.09.07

레이아웃 익히는 중2

현재 티스토리 블로그의 반응형 스킨을 만들기 위해 무료 부트스트랩 테마인 http://addyosmani.github.io/jquery-ui-bootstrap/을 이용해서 레이아웃을 익히고 있다. 그리고 스킨만들기에 대해서는 티스토리의 스킨가이드인 http://www.tistory.com/manual/skin/?_top_tistory=navi_manual_skin을 보고 있는데 부트스트랩과 스킨에 대해서는 약해서 어렵다. 부트스트랩은 12개의 div로 나누고 각 class는 span이라 하고, 줄의 class는 row라 하는구나! 유동인 경우는 class="row-fluid"라고 하고 container도 유동인 경우는 class="container"에서 -fluid를 더해 class="container-..

2013.08.30

네이버 블로그에서 제한하는 태그 알아보기5

네이버 블로그에서 태그 사용할 때 알아야 할 사항은 네이버에서 보안을 위해 제한하는 태그가 아니면 사용할 수 있다. 이것은 대부분이 태그를 사용할 수 없으므로 거의 태그를 사용할 수 없다고 보면 된다. 아이프레임(iframe) 태그에서 모든 아이프레임 태그를 허용하는 것이 아니라 네이버에서 제한하지 않는 유튜브나 다음뷰 추천 위젯 소스로 알고 있다. 아래는 다음뷰 추천 위젯 소스이로 얼마전에 알았는데 네이버 블로그에서 지원한다. 아래는 유튜브의 동영상으로 네이버 블로그에서 지원한다. 위아래는 모두 아이프레임 소스인데 네이버에서 보안을 위해 허용한 태그이니 되는 것이다. 아이프레임이라고 모든 아이프레임이 되는 것이 아니라는 것을 확실히 알기 바란다. 네이버 블로그만 아니라 다음 블로그도 보안을 위해 다음에..

2013.08.26