티스토리 블로그 맨위로 가기 버튼 만드는 방법
오늘은 간단한 블로그 꾸미기 팁 하나를 작성하려고 합니다.
컨텐츠 분량이 적은 블로그는 상관없겠지만, 내용을 길게 쓰기를 좋아하시는 분들은
방문자들에게 은근히 스크롤 압박을 줄 수가 있습니다 ㅎㅎ
블로그 하단부에 맨위로 가기 버튼을 달아두면 단번에 페이지 상단으로
이동시킬 수 있기때문에 방문자들이 글을 보는 데 조금이나마 편리함을 줄 수 있을 것입니다.
우선 버튼으로 활용할 문구 또는
이미지를 준비합니다. 저같은 경우는 제가 직접 만든 문구를
이미지로 저장시켜보았죠 ㅎ 아래처럼요.
이미지가 준비되었으면
자신의 블로그에 이미지 저장을 해야합니다.
관리자 페이지로 들어가서.....
>>
파일업로드 메뉴로 들어간다음
페이지 하단부에 보이는 [추가] 버튼을 눌러서 이미지 파일 업로드를 합니다.
>>
올린 파일에 대고 우클릭을 하면
이미지에 대한 url 주소가 나옵니다. 그것을 복사해두세요.
>>
이제 다시 html 편집 창으로 이동합니다.
버튼의 위치는 보통 페이지 하단부가 되겠죠?
티스토리 소스에서 본문을 나타내는 태그는 아래와 같습니다.
컨텐츠 분량이 적은 블로그는 상관없겠지만, 내용을 길게 쓰기를 좋아하시는 분들은
방문자들에게 은근히 스크롤 압박을 줄 수가 있습니다 ㅎㅎ
블로그 하단부에 맨위로 가기 버튼을 달아두면 단번에 페이지 상단으로
이동시킬 수 있기때문에 방문자들이 글을 보는 데 조금이나마 편리함을 줄 수 있을 것입니다.
우선 버튼으로 활용할 문구 또는
이미지를 준비합니다. 저같은 경우는 제가 직접 만든 문구를
이미지로 저장시켜보았죠 ㅎ 아래처럼요.
이미지가 준비되었으면
자신의 블로그에 이미지 저장을 해야합니다.
관리자 페이지로 들어가서.....
>>
파일업로드 메뉴로 들어간다음
페이지 하단부에 보이는 [추가] 버튼을 눌러서 이미지 파일 업로드를 합니다.
>>
올린 파일에 대고 우클릭을 하면
이미지에 대한 url 주소가 나옵니다. 그것을 복사해두세요.
>>
이제 다시 html 편집 창으로 이동합니다.
버튼의 위치는 보통 페이지 하단부가 되겠죠?
티스토리 소스에서 본문을 나타내는 태그는 아래와 같습니다.
위 태그 윗부분에 소스를 집어넣으면 본문 위쪽에 출력이 되고
아랫부분에 넣으면 본문 아래쪽에 출력이 됩니다. 첨부해야할 소스는 다음과 같습니다.
앵커태그를 이용하였는데요,
위 소스에서 img src=" 이 부분 다음에 나오는 이미지 url 주소를
아까전에 자신이 업로드한 이미지 파일의 주소로 변경해주시면 됩니다.
어떤 블로그를 보면
맨위로 가기 버튼을 눌렀을 때
스크롤을 타고 자연스럽게 올라가는 효과도 주곤 하는데요,
그 부분은 소스가 다소 복잡한 걸로 알고있습니다.
아무튼 이 글을 보시는 분들은
단순한 소스를 이용하여 곧바로 페이지 상단으로 이동하는 효과를 나타내실 분들이
참고하시면 될 것 같네요. 오늘의 간단한 블로그팁은 여기까지입니다 ㅎ