나만의 시작페이지 만드는 방법 2가지

나만의 시작페이지 만드는 방법 2가지에 대해서 알아보겠습니다. 인터넷을 매일 사용하면서 네이버, 구글 등을 시작페이지로 해서 사용하기도 하고 빈페이지를 사용해보기도 했는데요. 불편한 점들이 있어 나만의 시작페이지가 있으면 편하겠다는 생각이 들어 방법을 찾아봤습니다.

Table of contents 숨기기

1) 나만의 시작페이지 만들기 왜?

2) 나만의 시작페이지 Start Page by zivallh

3) 나만의 개인화 페이지 cox.kr

4) 추천 게시글

4.1) 연관된 글

나만의 시작페이지 만들기 왜?

인터넷을 이용하면서 매일 방문하는 사이트 들이 있습니다. 예를 들어 워드프레스 블로그를 운영하면서 관리자 페이지라던지 이미지 최적화 사이트 같은 곳은 매일 방문하는 경우가 있습니다. 물론 몇 일에 한번 방문하는 사이트도 있는데요.

시작페이지를 네이버, 구글, 빈페이지 등을 사용하다가 자주 이용하는 사이트들을 일일이 열기 귀찮아서 자주 들어가는 사이트들을 크롬 시작페이지에 등록해서 크롬을 열면 여러 페이지들이 자동으로 열리게 해뒀는데 문제는 그렇게 사용하니 인터넷 창이 열리는게 느리더라고요. 그래서 내가 자주 들어가는 사이트만 북마크(즐겨찾기)해 둔 곳을 시작페이지로 설정하면 편할듯해서 방법을 찾아봤습니다.

간단하게는 크롬 화면에 8개인가 표시할 수 있던데 등록할 수 있는 사이트가 너무 적더라고요. 자주 사용하는 사이트로 변경되는 것도 같고 그래서 더 찾아보니 많은 방법은 아니지만 제가 할 수 있을 만한 방법이 2가지 정도 되길래 정리해봤습니다.

나만의 시작페이지 Start Page by zivallh

첫 번째 방법은 Start Page by zivallh 입니다. 이거는 상당히 예전에 올려둔 자료 같던데 html을 약간만 사용할 줄 알면 이용하기 편리합니다. 직관적으로 깔끔하게 보이기도 합니다. 타이틀 별로 하단에 내용들이 적용되고 오른쪽 상단엔 검색할 수 있는 메뉴가 오른쪽 하단엔 시계랑 날짜가 표시됩니다. 이름을 클릭해서 사이트로 이동해 로그인하고 다운로드 받으시면 됩니다.

위에 사이트에서 자료를 다운로드하면 압축파일이 하나 받아지는데 그 압축파일을 해제해서 index.html을 수정해서 자신만의 시작페이지를 만들 수 있습니다. 메모장같은 곳에서 수정해도 됩니다.

Social
http://www.facebook.com || Facebook
http://www.twitter.com || Twitter
http://www.myspace.com || myspace
http://www.youtube.com || Youtube
http://www.google.com/ncr || Google.com

index.html을 열어보면 중간에 위와 같이 적혀있는 곳이 있는데 Social 이 타이틀로 표시되고 마우스를 올리면 아래 있는 적혀있는 내용들이 표시됩니다.

http://www.facebook.com || Facebook

이렇게 적혀있는 부분에서 http://www.facebook.com 은 연결 될 즐겨찾기 주소를 입력하고 || 표시로 구분하고 Facebook 표시 될 이름을 적어두면 Social 타이틀에 마우스를 올려두면 Facebook이 아래 표시되고 클릭하면 사이트로 이동이 됩니다. 타이틀과 아래 내용은 자신이 편한데로 자주 이용하는 곳으로 변경하면 됩니다. 한글로 적어도 잘 되네요.

<div id="date">
<script type="text/javascript">

function makeArray() {
for (i = 0; i<makeArray.arguments.length; i++)
this[i + 1] = makeArray.arguments[i];
}

var months = new makeArray('1월','2월','3월','4월','5월',
'6월','7월','8월','9월','10월','11월','12월');
var date = new Date();
var day = date.getDate();
var month = date.getMonth() + 1;
var yy = date.getYear();
var year = (yy < 1000) ? yy + 1900 : yy;

document.write(year + "년 " + months[month] + " " + day + "일");

</script>
</div>

기존에 적혀있는 날짜도 위와 같이 바꿔주면 16 JULY 2023으로 표시되던 날짜가 2023년 7월 16일 이런 식으로 표기가 변경됩니다.

function updateClock() {
	var currentTime = new Date ();
	var currentHours = currentTime.getHours ();
	var currentMinutes = currentTime.getMinutes ();
	var currentSeconds = currentTime.getSeconds ();

	// Pad the minutes and seconds with leading zeros, if required
	currentMinutes = (currentMinutes < 10 ? "0" : "") + currentMinutes;
	currentSeconds = (currentSeconds < 10 ? "0" : "") + currentSeconds;

	// Choose either "AM" or "PM" as appropriate
	var timeOfDay = (currentHours < 12) ? "오전" : "오후";

	// Convert the hours component to 12-hour format if needed
	currentHours = (currentHours > 12) ? currentHours - 12 : currentHours;

	// Convert an hours component of "0" to "12"
	currentHours = (currentHours == 0) ? 12 : currentHours;

	// Compose the string for display
	var currentTimeString = timeOfDay + currentHours + ":" + currentMinutes + ":" + currentSeconds ;

	// Fill '#clock' div with time
	$("#clock").html(currentTimeString);
}

script.js 파일에서는 AM,PM을 오전,오후로 변경할 수 도 있습니다. 그리고 currentTimeString부분을 수정해서 시계 순서를 변경해서 오후 7:56:16 이런식으로 표시도 가능합니다.

	/*  Animation Time!  *\
	\*===================*/
	
	/*  Hide lists  *\
	\*==============*/
	$('ul').slideUp();

	/*  Show on hover  *\
	\*=================*/
	$('.block').mouseenter(function() {
		$('ul', this).slideDown();
	});

	/*  Hide on unhover  *\
	\*===================*/
	$('.block').mouseleave(function() {
		$('ul', this).slideUp();
	});

또 타이틀 부분에 마우스를 가져가면 아래로 슬라이딩되면서 안에 내용들을 표시해주는게 이쁘기는 한데 한눈에 안보여서 불편하다면 위에 애니메이션 부분을 삭제하면 그냥 나열되서 표시됩니다.

style.css 파일을 수정해서 글자 크기, 배경 색상, 글자 색상 등을 변경해서 본인에게 맞춰서 시작페이지를 조절할 수 있습니다. 장점은 html을 수정하는 방법이라 약간 불편하기는 하지만 하드디스크에 저장되어 있으니 어디 다른데 노출될 일도 없고 인터넷이 연결되지 않는 순간에도 수정하거나 어떤게 저장되어 있는지 확인 할 수 있습니다. 수정하고 싶을 때 index.html파일만 열어서 수정하면 됩니다. 단점은 만들어둔 시작페이지는 다른 곳에서 다른 컴퓨터로 사용하려면 클라우드 서비스 등을 이용해야 하지 않을까 합니다.

나만의 개인화 페이지 cox.kr

두 번째 방법은 cox.kr이라는 사이트를 이용한 방법입니다. 위에 방법처럼 HTML을 알아야 하는건 아니고 그냥 사이트에 가입해서 여러가지 템플릿을 이용해서 북마크(즐겨찾기)를 자신이 보기 편하게 정리하고 꾸밀 수 있습니다. 색상, 텍스트, 배경, 그림, 위젯 등을 변경해서 사용할 수 있습니다. 장점은 언제 어디서나 인터넷만 연결되면 사이트로 들어가서 즐겨찾기 해둔 사이트들을 이용할 수 있습니다. 단점은 인터넷이 연결이 안되면 혹은 로그인이 안되거나 사이트가 사라지면 꾸며놓은 사이트도 사라지겠죠?

나만의 시작페이지 만드는 방법 2가지에 대해서 알아봤습니다. 저는 위에 첫 번째 방법을 사용하고 있습니다. html을 수정해야 하지만 저도 html을 잘 아는건 아니여서 수정하고 확인해 보고 없어진게 있거나 잘못 수정이 되면 전 상태로 되돌려가면서 수정해서 이용하고 있습니다. 간단하게 표시되는 것도 마음에 들고 제가 지우지 않으면 사라지고 하는 것도 아니라 이용 중입니다. 다만 컴퓨터를 하나로 쓰는게 아니라 PC방이나 학교, 학원, 회사 등 여러곳에서 사용하려면 아래 방법도 괜찮아 보입니다.

나만의 시작페이지 만들기 왜?

나만의 시작페이지 Start Page by zivallh

나만의 개인화 페이지 cox.kr

추천 게시글

연관된 글

답글 남기기 응답 취소