페이지 3 의 41234

티스토리 블로그 스킨 만들기 11 – 컨텐트 영역 제목 타이틀 리본 만들기

이번 글에서 만들게 될 제목 타이틀의 리본입니다. 평범한 제목부분과 위처럼 리본이 있는 것과는 블로그 전체적인 이미지가 아주 다르게 보입니다. 이 리본은 포토샵으로 만든 하나의 이미지를 사용합니다. 제목의 배경은 이미지가 아니라 background 컬러 속성을 사용합니다. 그래야 제목이 길어져서 두줄로 되면 모든 글자에 배경색이 적용됩니다. 그리고 bottom-border 속성을 사용하여 1픽셀의 빨간색이 추가됐습니다. 사용한 이미지는 2부분의 삼각형과 그림자입니다. ...

티스토리 블로그 스킨 만들기 10 – 제이쿼리 플러그인을 이용한 메뉴바 만들기 2

이번 글에서 만들게 될 메뉴바입니다. 이곳 을 클릭하면 테스트 블로그로 이동합니다. 메뉴에 마우스 오버하면 서브 메뉴가 애니메이션 되면서 나옵니다. 구글 광고에 가려지는 드랍다운 메뉴는 금지이므로 메뉴를 위로 나오게 하는 방법도 있습니다. 웹사이트에서 메뉴의 배치를 주로 헤더영역에 하는 것은 검색엔진이 내 웹사이트를 검색할때 최우선 접하는 곳이기 때문입니다. 대부분의 블로그는 카테고리라고 하여 메뉴역할을 하는데 사이드바에 배치합니다.  내 글에서 ...

티스토리 블로그 스킨 만들기 9 – 제이쿼리 플러그인을 이용한 메뉴바 만들기 1

이번 글에서 만들 메뉴바입니다. 이미지로 보면 단순하지만 이곳 을 클릭하여 위 테스트 블로그로 이동하고 메뉴에 마우스오버하면 홈에 있던 회색의 박스가 애니메이션 되면서 해당메뉴로 이동합니다. 이것은 제이쿼리 플러그인을 사용한 것입니다. 이러한 제이쿼리 플러그인을 Lava Lamp 라고 합니다. 이것은 메뉴의 글자의 크기에 따라서 사각형이 변하기 때문에 이름이 붙여진 것입니다. Lava Lamp란 용암이 물흐르듯 움직이는 램프인데 이것에서 이름을 ...

티스토리 블로그 스킨 만들기 – 현재까지 진행된 스킨을 공개합니다.

"티스토리 블로그 스킨 만들기"라는 타이틀로 만들고 있는 스킨은 이웃블로거이신 이츠하크님의 요청으로 시작해서 거의 마무리 단계에 있습니다. 지금까지 만든 것으로도 충분히 스킨으로 사용할 수 있으며 메뉴 부분과 각종 아이콘을 삽입만 하면 완료됩니다. 그동안 따라하시는 분들이 어려워하시는 것은 본 스킨 만들기 과정이 제 포스팅의 CSS기초부분을 기반으로 해서 진행된 것이라 스킨만들기부분만 하셔서 그렇습니다. 스킨이 완료되면 공개하려고 하였지만 과정의 ...

티스토리 블로그 스킨 만들기 8 – Footer 영역과 페이징에 배경이미지 삽입

이번 글에서 진행할 내용은 세가지입니다. 컨테이너 영역 외부에 있던 Footer를 내부로 들여오고 이 footer와 페이징을 CSS기초에서 만든 배경이미지로 둥근 모서리를 만듭니다. 그리고 검색 모듈을 헤더로 이동하고 이미지를 삽입합니다. 검색 박스는 평상시에는 Search라는 단어가 나오고 클릭하면 검색어를 입력할 수 있도록 사라지게 합니다. 이것은 자바스크립트를 사용합니다. 간단한 내용이니 알아두는 것도 좋습니다. 검색버튼은 워드프레스의 아이콘으로 교체할 예정입니다. 그동안 ...

티스토리 블로그 스킨 만들기 7 – 사이드바와 모듈

이전글에서 티스토리 블로그 스킨의 사이드바는 티스토리 고유의 태그를 사용한다고 했습니다. 그 태그란 <s_sidebar></s_sidebar>로 일반적인 html에서 사용하는 태그 괄호를 사용하므로 태그라고 하였지만 실제 명칭은 치환자라고 합니다. 티스토리는 원래 텍스트큐브(or 태터툴즈)라는 블로그 프로그램을 사용하고 있고 현재 설치형 블로그 프로그램으로서도 존재하고 계속 개발되고 있습니다 .  그래서 티스토리 블로그는 텍스트큐브에서 사용되는 치환자를 사용하는데 이 치환자라는 것은 일반적으로 변수나 함수를 ...

페이지 3 의 41234