부트스트랩8 그누보드에 부트스트랩 적용 - (5) 메뉴에서 게시판을 클릭해서 나오면 드롭다운 메뉴가 먹통이 되는데..게시판과 관련이 있을거 같다. 우선 부트스트랩을 이용해서 게시판의 내용을 container 안에 넣어야겠다. head.php 에서 nav 코드 다음에 아래 코드를 작성! tail.sub.php 에서 저것들을 닫아줘야겠지. 아래처럼 가운데로 싹 모아주네.. 게시판 쪽을 살펴봐야겠는데...기본 basic 스킨 css 로 표시되고 있다.부트스트랩으로 바꿔주려면 css 가 아니라 php 소스를 손봐야할거 같다. 게시판은 bbs/board.php 가 관할한다. 소스 들여다 봐야지. board_head.php 와 board_tail.php 는 게시판 상단, 하단에 들어가도록 관리자가 설정한 내용을 끌어오는 기능을 하고 있고.../bbs/board.p.. 2015. 3. 9. 그누보드에 부트스트랩 적용 - (4) 상단 메뉴말고, 진짜 메뉴를 가지고 놀려고 관리자 페이지, 메뉴 설정에서 메뉴를 만들려고 보니, 페이지가 제대로 뜨지 않는다.jquery 버전 문제인듯 싶어 최신버전으로 변경했던 jquery 버전을 다시 1.8.3 으로 돌려야했다. head.sub.php에서... 되돌려놓고 게시판을 몇개 만들고 메뉴도 만들었다. 그룹01-게시판01-게시판02그룹02-게시판03 요렇게 만들어놓고 테스트! 원래 소스에서 메뉴를 표시해주는 부분은 head.php 에 아래 부분이다. 메인메뉴 메뉴 준비 중입니다. 메뉴 준비 중입니다. 2015. 3. 8. 그누보드에 부트스트랩 적용 - (3) 주의) 재미로 하고 있는 작업입니다. 따라하시다가 욕을 볼 수도 있습니다.ㅎ 사이트 접속하면 처음 보이는 index.php 파일 및 기타 필수파일 몇개를 수정해서 하~얗게 만들었다. 수정하지 않았을 때 나타나는 것 중에 상단에 메뉴가 있는데...메뉴에 부트스트랩 적용해보겠다. 원본 head.php 에 보면 상단 시작, 상단 끝 구간이 있다.거기 보면 글자크기를 변경하는 버튼, 회원가입, 로그인, 새글..등 있고, 그 아래에 메뉴 뿌려주는 코드가 있다.글자크기 변경하는 건 관심없고. 메뉴 부분은 자세히 살펴봐야되고...상단에 회원가입, 로그인, 새글..등이 나타나는 상단 고정 메뉴를 부트스트랩의 nav 로 바꿔봐야지... 부트스트랩에서 navbar 라고 이름지어진 component 가 있다. 그거 이용하면.. 2015. 3. 8. 그누보드에 부트스트랩 적용 - 주의!! 혹시나 이글을 보고 따라하시는 분들이 계실까 글 남깁니다. 지난 해에 재미로 시작했다가 다른 일이 바빠서 못 하던거 다시 시작했습니다.언제 또 중단될지 모릅니다. 완성될 때까지는 따라하지 마세요..ㅎㅎ 2015. 3. 5. 그누보드에 부트스트랩 적용 - (2) 그누보드에 부트스트랩 적용 - (2) 부트스트랩은 css 와 js 로 이루어져있다고 보면 되겠는데...원래 그누보드에 있는 css 파일과 분명 부딪히는 일이 생길거 같다. 앞선 글에서 소스 보기를 하면 알 수 있는게, 그누는 default.css 파일과 아래 js 파일들을 사용한다.물론 admin 으로 로그인을 하면 admin.css 를 참조하긴 한다만...지금은 일반 로그인의 경우만 살펴봐야지. 부트스트랩도 jquery 를 사용하는데, 버전이 맞을라나 모르겠네. 그건 나중에 부트스트랩에서 js 를 사용할 때 좀 더 확실히 살펴봐야겠다. default.css 를 열어보니.... 레이아웃, 게시판용 css 등이 주석과 함께 작성이 되어있다.그냥 두고 부트스트랩을 추가하면 충돌이 일어날 듯한데... defa.. 2014. 11. 8. 그누보드에 부트스트랩 적용 - (1) 그누보드에 부트스트랩 적용 - (1) 난 그누보드도 사랑하고 부트스트랩도 사랑한다. 그누보드 5.0.30을 서버에 설치를 해 봤다. 그저 그 그누보드의 코어를 사용하되 모습을 부트스트랩의 모습으로 바꾸어보고 싶어졌다. 그래서, 하나씩 살펴보려고 한다. 그누보드를 홈디렉토리에 바로 설치를 했을 경우, 서버에 접속하면 index.php 가 브라우저에 보여지게 된다. index.php 소스를 열어서 들여다보면, 몇가지 파일들을 include 시키고 있으며, 브라우저 화면에 보여지게 될 '최신글'을 보여주기 위한 코드가 보인다. 브라우저에 보여지는 html 문서는 보통 아래의 모습을 띄게 된다. 여기에 메뉴가 들어간다고 가정하자......페이지마다 다른 내용들이 이곳에 들어간다고 가정하자....웹 페이지 하단에.. 2014. 11. 8. [부트스트랩] popover 기본적으로 트위터 부트스트랩의 js 와 css는 잘 포함을 시켰다는 가정하에 진행합니다. 팝오버 보기 이녀석을 클릭했을 때, 팝오버가 나타나도록 하기 위해, jquery 로 설정을 해 둬야합니다. 그러면, 클릭했을 때, 기본적으로 오른쪽으로 팝오버 메시지가 나타납니다. 나타나는 방향을 설정하려면?? 팝오버 보기 data-placement 에다가 top, right, bottom, left 를 지정해주면 됩니다. 2013. 2. 14. 다음 지도 API v3 와 트위터 부트스트랩(Twitter Bootstrap) CSS 다음 지도 API v3를 이용해서 간단한 기능의 웹 페이지를 작성하던 중에 발견한 내용을 정리합니다. 다음 지도 API v3 를 이용해보려고, 우선 다음에서 제공하는 매뉴얼대로 테스트 페이지를 작성해서 실행해 보았습니다. 시키는대로 하면 아래와 같이 이쁘게 지도가 표시가 됩니다. 다음 지도 API v3 홈페이지 : http://dna.daum.net/apis/maps/v3 간단하게 API 사용법을 살펴본 후에, 제가 만들어보려던 웹 페이지를 만들면서 트위터의 부트스트랩 CSS 파일을 불러오도록 소스를 작성하였습니다. 트위터 부트스트랩 홈페이지 : http://twitter.github.com/bootstrap/ 그렇게 트위터의 부트스트랩 CSS를 적용시키니까, 아래와 같이 지도가 제대로 표시가 되지 않더.. 2012. 3. 25. 이전 1 다음
