본문 바로가기

template9

[Wordpress] 워드프레스 테마(Theme)용 하단(footer) 고정시키는 CSS 템플릿 샘플 예제 워드프레스용 하단(Footer) 고정 템플릿 샘플예제입니다. 워드프레스 테마(Theme)를 만들 때 유용합니다. 2018. 12. 21.
[Bootstrap] 부트스트랩으로 만든 Adsense 광고가 포함된 퀴즈/문제 템플릿 예제 샘플 See the Pen responsible quiz/question template with adsense by Woojin Choi (@woojin-choi) on CodePen. 부트스트랩과 CSS로 만든... 광고를 포함한 퀴즈/문제(4문항) 템플릿입니다.개인적으로 사용할데가 있어서 만들어 봤습니다. 2018. 12. 18.
[HTML5/CSS3/jQuery] 반응형 상단에 광고 추가 가능한 헤더 템플릿(Template) - 밝은 빨강 계열 샘플 See the Pen responsive header template (red) by Woojin Choi (@woojin-choi) on CodePen. 밝은색의 경쾌한 상단 템플릿 예제입니다. 외국계 템플릿을 참고해서 반응형으로 한번 만들어 봤습니다. 구글 애드센스 하시는 분들을 위해 광고도 하나 넣었습니다. 2018. 12. 13.
[jQuery] 좌우 Div의 높이를 동일하게 조정하기 (레이아웃이나 템플릿 등에서 사용 가능) See the Pen [jQuery] 좌우 Div의 높이를 동일하게 조정하기 (레이아웃이나 템플릿 등에서 사용 가능) by zzzznara (@zzznara) on CodePen. 3단 레이아웃일 경우, 상단/좌측하단/우측하단 이렇게 구분이 되는데요. 이미지나 내용이 많을 경우 좌측하단과 우측하단의 높이가 일치하지 않는 문제가 생깁니다. 이럴 때 사용하면 좋을 것 같네요~ 예제에서 처음 화면이 열릴 때 좌우측 하단의 높이가 다릅니다. 좌측하단 높이 : 300px 우측하단 높이 : 100px 하지만, setTimeout() 함수로 2초 후에 equalHeights() 함수를 호출하여 높이를 같게 해줍니다. 물론, 실제 레이아웃 등에 사용할 때는 setTimeout() 함수는 필요없으므로 제거하시면 됩니다... 2018. 6. 10.
[Wordpress] 워드프레스 테마 제작을 위해 템플릿 태그 목록 보기 워드프레스에는 백여 가지의 템플릿 태그가 있는데요. 워드프레스 코덱스에는 템플릿 태그를 잘 정리해 놓아서 필요한 태그를 찾아서 사용하면 됩니다.http://codex.wordpress.org/Template_Tags 해당 템플릿 태그를 클릭하면 사용법이 자세히 나와 있는데요. 영어를 잘 하지 못해도 예제만 보시고 사용하시면 되니 겁먹지 않아도 됩니다. 2015. 9. 16.
[Wordpress] 워드프레스 테마 제작을 위한 템플릿 태그의 종류 알아보기 워드프레스 템플릿 태그는 매개변수를 꼭 사용해야 하는 것도 있고 매개변수가 전혀 필요 없는 것도 있습니다. 매개변수를 사용하는 경우 변수를 사용해서 변수에 해당하는 값을 표시하도록 하는 템플릿 태그와 질의문(query string)을 사용해서 해당 질의문의 결과를 표시하는 템플릿 태그가 있습니다. 매개변수가 필요없는 경우 위와 같이 글쓴이의 이름을 표시하는 태그는 최종 정보에 해당하므로 추가적인 매개변수가 필요 없습니다. 매개변수가 필요한 경우 위와 같이 bloginfo 태그는 각종 블로그 정보의 상위 개념이므로 하위 요소가 많습니다. 'description'라는 매개변수를 사용하면 태그라인(사이트 설명 글)에 해당하는 정보를 표시합니다. 매개변수로 질의문을 사용하는 경우 wp_list_cats는 카테고.. 2015. 9. 16.
[Wordpress] 워드프레스 템플릿 계층구조 (Template Hierarchy) 워드프레스의 테마 폴더에는 여러 개의 파일이 있지만 사용하는 파일이 상황에 따라서 다릅니다. 사용자가 지정하는 게 아니고 워드프레스가 알아서 지정하는데요.예를들어, 테마 폴더에 font-page.php 파일이 있으면 워드프레스는 이를 웹페이지 초기 화면으로 나타나게 하고 home.php 파일이 있으면 블로그 글 목록이 나타나게 합니다. 이 파일이 없으면 그 다음 단계인 page.php 파일을 초기 화면으로 사용합니다. 만약 이 파일도 없다면 index.php 파일을 초기화면으로 사용합니다. 이처럼 테마 폴더에 어떤 파일이 있느냐에 따라 사용되는 파일이 달라지는 것을 템플릿 계층구조라고 합니다.마찬가지로 카테고리 목록을 선택했을 때 category.php 파일을 우선 사용하고 이 파일이 없으면 archiv.. 2015. 9. 16.
[Wordpress] 워드프레스에서 티스토리의 서식 기능 사용하게 해주는 플러그인 - Tiny MCE Templates 티스토리의 서식 기능을 사용해 보셨나요?자주 사용되어지는 형태의 템플릿을 미리 저장해 놓고 필요할 때마다 불러서 쓰는 기능인데요.워드프레스에도 이렇게 서식 기능을 사용하게 해주는 많은 Template 플러그인들이 있답니다.그 중에서 심플하면서도 편리한 Tiny MCE Templates를 소개드리도록 하겠습니다. 먼저, 워드프레스 관리자페이지의 [플러그인 추가] 메뉴에서 Tiny MCE Templates 라고 검색을 하고 설치를 해보세요. 플러그인을 설치하고 활성화하면 Templates라는 메뉴가 좌측에 생기는데요.[Add New]를 눌러서 서식을 저장하시면 서식이 추가됩니다. 글쓰기에서 이 서식을 불러오려면 [비주얼] 모드에 놓고 서식 아이콘을 클릭하시면 팝업으로 서식 목록이 열립니다.원하는 서식을 선택.. 2014. 11. 25.
[이클립스] eclipse에서 Code Template 으로 편하게 주석(Comment)을 넣자. 동일한 내용을 반복하는 일은 은근히 귀찮은 일이죠. Eclipse의 Code Template을 기능을 사용하면 편리합니다. 지금 하고 있는 프로젝트에서 javadoc 생성을 위해 모든 method에 주석을 넣으라고 하더군요. 어떤 분이 Code Template을 사용하는 방법을 알려주셔서 편하게 작업할 수 있었습니다. 먼저, 이클립스를 열어서 다음 경로로 들어가 보세요. Window > Preferences > Java > Code Style > Code Templates Comments를 펼치세요. 1. Class에 주석 넣기 Types를 클릭하면 다음과 같이 보입니다. [Edit] 버튼을 눌러서 템플릿을 원하는 내용으로 바꾸세요. 적용을 한 후, 파일을 열어서 class 윗부분에 커서를 위치시키고 단.. 2011. 4. 13.