블로그에 맨처음 들어가보면 카테고리가 접혀있다.

깔끔해 보일진 몰라고, 조금 귀찮아 보여서, 펼친상태로 보여주는걸 원해서

기능을 적용시킴

적용방법은 

티스토리 관리자 페이지에서 스킨 항목의 [HTML/CSS] 를 클릭.

해당 항목에서 [##_category_##]를 찾은후,

바로 아랫부분에 

<script language="JavaScript">try{expandTree ();}catch(e){}</script> <!-- 카테고리 펼치기 -->

이란 소스를 삽입 후 저장.


그럼 본 블로그처럼 카테고리가 펼쳐서 보이게 됩니다.


도메인 연결중...

아 드럽게 연결 어렵다.

mrkwon.com 은 연결이 안되고

www.mrkwon.com 만 연결이 되는 상황...

답답해 미치겠네...

티스토리는 왜 DNS서버가 없는 것이여....

요즘 스마트폰이 대세이고, 나 또한 스마트폰을 사용중이기에 스마트폰으로 블로그에 들어올수 있도록
손좀 봤다..
뭐 글이 올라와야 블로그에 들어오는 맛이있겠지만...
자주 접속한다는건 글이 올라올 확률이 있다는 거겠지...

어쨋든, 현재 내 블로그의 플랫폼은 보시다시피 텍스트큐브 1.7.8
텍스트 큐브 1.7 부터 모바일 페이지 지원이 가능하다.

블로그 주소 뒤에 /m 혹은 /i 를 붙여 주면 되는데,
두개의 차이는 /m 은 완전한(?) 모바일 페이지,
/i 는 아이폰에 최적화(?) 스타일...
(개인적으로 /i 가 제일 깔끔하다고 생각)
어찌되었던 간에, 둘다 모두 접속이 가능하다.

하지만 트위터에 http://www.MrKwon.com/tc/i  로 등록하기엔 트위터를 PC 로 접속하는 사람들에겐 미안한일..
그렇다고 그냥 mrkwon.com/tc 로 쓰기엔 화면의 확대 축소와, 쓸데없는 플래쉬를 로딩하게 해야하는 번거로움이 따르니... 이또한 패스...

그래서 찾은게, 브라우저를 자동 검색하여, 접속 브라우저가 모바일일경우 자동으로 모바일 페이지로 넘겨주는 기능이다.
이걸 찾을려고 개고생을 했었다. 어디서는 뭐 유료 솔루션이라면서 돈을 내야 서비스를 제공해 준다는데...
(알고보니 홈페이지를 모바일 페이지로 변환해주는 솔루션임.)

뭐 어찌되었던 간에 검색중에 찾은것이 자바스크립트...
일단 적용해 보니 잘된다.
갤럭시로 http://www.mrkwon.com 으로 접속하니 자동으로 모바일페이지로 넘어간다.

코드 참조

<script>
if (navigator.userAgent.match(/iPad/) == null && navigator.userAgent.match(/iPhone|Mobile|UP.Browser|Android|BlackBerry|Windows CE|Nokia|webOS|Opera Mini|SonyEricsson|opera mobi|Windows Phone|IEMobile|POLARIS/) != null)
    location.href = "http://m." + location.host + location.pathname;
</script>


위 코드를 해석하면 일단 모바일 핸드폰인 아이패드/아이폰.안드로이드/블랙베리/윈도우CE/노키아/webOS/오페라미니/소니에릭슨/오페라모빌/윈도우폰/IEMobile/폴라리스
(모르는게 많네..)
아무튼 그것들이 접속을 하면 로케이션... 즉 도메인 앞에 m 을 붙인다는거...
만약 도메인이 http://naver.com 이면 http://m.naver.com 으로 해준다는거...

하지만 텍스트 큐브의 모바일은 이런 m. 으로 시작하는게 아님...
도메인/텍스트큐브설치위치(메인이라면 생략)/I 이므로....
(필자는 mrkwon.com의 도메인서버에 tc 폴더안에 설치되어있음 즉 mrkwon.com/tc 가 블로그주소)
마지막 location.href 구문을...
location.href = "http://" + location.host + location.pathname +"tc/i";
으로 바꿔야 한다.
그외 다른 플랫폼의 홈페이지들은 알아서....

이로서 MrKwon.com 의 모바일 최적화 1단계 완성.
그다음 리뉴얼을 계획없음.

제일 중요한 출처~!
출처(원본)보기
* 링크색 관련 html태그입니다.
:: <body> :: html문서의 전반적인 내용입니다.
 - link : 한 번도 방문하지 않은 링크의 색을 설정합니다.
 - vlink : 한 번이라도 방문했던 링크의 색을 설정합니다.
 - alink : 링크를 클릭했을 때의 링크색을 설정합니다.

* 링크색 관련 css속성입니다.
 - link : 한 번도 방문하지 않은 링크를 설정합니다.
 - visited : 한 번이라도 방문했던 링크를 설정합니다.
 - active : 링크를 클릭했을 때 링크를 설정합니다.
 - hover : 마우스 커서가 링크에 위치했을 경우를 설정합니다.

 - text-decoration : 글자의 속성을 변경합니다.
  -- blink : 글자를 깜박이는 글자로 설정합니다.
  -- line-through : 최소선을 그은 글자로 설정합니다.
  -- none : 효과가 없는 글자로 설정합니다.
  -- overline : 위줄 그은 글자로 설정합니다.
  -- underline : 밑줄 그은 글자로 설정합니다.

<예제>
a.b1:link {font-family:굴림; text-decoration:none; color:blue;}
a.b1:alink {font-family:굴림; text-decoration:none; color:blue;}
a.b1:visited {font-family:굴림; text-decoration:none; color:blue;}
a.b1:hover {font-family:굴림; text-decoration:none; color:black;}

a href="주소" target="" class="b1"

페이지 이동이 있어도 주소를 고정시키는 방법~!

가상프레임을 만들면 간단히 해결됩니다.

페이지(예를 들면 index.html)를 프레임으로 나누면 됩니다.

프레임을 나눌때 프레임셋에서 하단부분을 0 프레임으로 만들어 넣고
메인프레임에 실제 내용(태그 등)을 넣어면 간단히 해결되죠

그리고 링크의 타겟을 target="_self" 로 처리하면 됩니다.

예)
<html>
<frameset rows="0,*" frameborder="NO" border="0" framespacing="0">
<frame name="top" src="">
<frame name="main" scrolling="yes" noresize src="메인 주소">
</frameset>
<body>
</body>
</html>

한마디로 얘기하자면 실제보이는 페이지와 내용들어가는 페이지가 다르다는 말입니다.
주소창에 보이는 페이지는 전체 프레임셑을 가지고 있고 링크가 걸리는 실제페이지만 안에서 돌기 때문에 그렇습니다.

+ Recent posts