웹서버에 부담을 주지않고 홈페이지에 음악넣기 팁(프레임 이용)
제로보드나 티티보드등의 원프레임홈페이지에는 이 방법이 가장 좋습니다
프레임으로 분리해서 상단이나 하단에 뮤직플레이어를 넣고 메인프레임에는 홈페이지를 넣는 방법입니다
====================================================================
*이 방법은 제로보드 등으로 만든 원프레임(한개의 프레임으로 이루어진 사이트)홈페이지를 프레임셋으로
분리해서 끊김없는 음악재생이 가능하게 하는 방법입니다(원프레임 홈페이지에 아이프레임 방식으로 뮤직플레이
어를 넣을 경우는 사이트내에서 다른 페이지를 보려고 클릭할 때마다 음악이 잠시 끊기는 현상이 있는데
그것을 없애는 방법입니다.)
홈페이지의 메인 index.htm 페이지를 프레임셋 소스를 이용해서 만들어 주고, 메인 index 파일 이름을 변경해주면
됩니다. 아래의 설명을 따라서 한번 해보세요
-------------------------------------------------------------------------------------------
1.원래의 홈페이지 메인 index.html 파일의 이름을 main.html ( htm 이 아니고 html 임)로 바꾸고 나서
2.첨부파일을 다운 받아 압축 푸시면 나오는 index.html 파일을 메모장으로 열어서
아래의 설명과 같은 위치에 main.html (위에서 이름을 바꾸어 두었던 것)의
인터넷 주소를 써넣고 저장시킨다.
3.위의 2번에서 수정한 그 index.html 파일을 웹서버( 원래의 메인 index.html 파일 있어야
할 곳) 에 대신 복사해 넣는다
-----------------------------------------------------------------------------------------
이하 2번 설명 관련
첨부파일을 압축풀면 나오는 index.html을 메모장으로 열면 아래와 같이 나옵니다.
<html>
<head>
<title>환영합니다</title>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
</head>
<frameset rows="30,*" rows1="30,*" rows2_disabled="60,*" frameborder="0" framespacing="0" name="fst">
<frame src="
http://bgm.music24.kr/aquamp/index.html" name="aquamp" frameborder="0" noresize>
<frame src="http://이곳에 자신의 홈페이지 main.html의 주소를 넣습니다or카페주소" frameborder="0" noresize>
</frameset>
</html>
-----------------------------------------------------------------------------------------
첨부파일
---------------------------------------------------------------------
위와 같이 하시고 홈페이지로 접속해 보시면, 맨위에 음악이 나오는 아쿠아 엠프가 생겼을 겁니다.
미리보기는 여기를 눌러보세요-->
http://11sadan.kr ===========================================================================================
홈페이지 하단에 뮤직플레이어를 위치시키려면 아래의 소스로 대신하시면 됩니다
<html>
<head>
<title>환영합니다</title>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
</head>
<frameset rows="*,30" rows1="*,30" rows2_disabled="60,*" frameborder="0" framespacing="0" name="fst">
<frame src="http://이곳에 자신의 홈페이지 main.html의 주소를 넣습니다or카페주소" frameborder="0" noresize>
<frame src=http://bgm.music24.kr/aquamp/footer.php name="aquamp" frameborder="0" noresize>
</frameset>
</html>
===========================================================================================
---------------
뮤직플레이어를 하단프레임에 넣을 때 스크롤바가 생기는 현상이 있더군요..
그 해결방법은 별도의 footer 프레임페이지를 만들어서 그곳에 아이프레임 방식으로 뮤직플레이어를 삽입하고
프레임셋 소스에서는 footer 페이지를 불러들이게 하면 됩니다.
아래에 프레임셋 과 푸터 프레임의 소스를 예제로 공개합니다.
---------------
프레임셋 소스
---------------
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title>환영합니다.</title>
<base target="_self">
</head>
<frameset rows="100%, 30" border="0">
<frame src="이곳에 자신의 홈페이지 메인창 주소를 넣습니다" marginwidth="0" marginheight="0">
<frame src="http://bgm.music24.kr/aquamp/footer.php" scrolling="no" marginwidth="0" marginheight="0">
<noframes>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
<p>이 페이지를 보려면, 프레임을 볼 수 있는 브라우저가 필요합니다.</p>
</body>
</noframes>
</frameset>
</html>
--------------------
푸터(footer)소스
---------------------
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title>환영합니다</title>
</head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
<table align="center" style="WIDTH: 100%; HEIGHT: 30px" cellSpacing=0 >
<tr>
<td width="100%" height="30">
<IFRAME src="http://bgm.music24.kr/aquamp/index.html" width="100%" height="30" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></IFRAME>
</td>
</tr>
</table>
</body>
</html>
실제 적용된 사이트 --> http://11sadan.kr
============================================================
아래와 같은 모양으로 넣으시려면 아래의 소스로 대체하시면 됩니다.. 주황색글 부분이 바뀌는 것입니다
<html>
<head>
<title>환영합니다</title>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
</head>
<frameset rows="30,*" rows1="30,*" rows2_disabled="60,*" frameborder="0" framespacing="0" name="fst">
<frame src="
http://bgm.music24.kr/bgm/50.php" name="aquamp" frameborder="0" noresize>
<frame src="http://이곳에 자신의 홈페이지 main.html의 주소를 넣습니다or카페주소" frameborder="0" noresize>
</frameset>
</html>
============================================================
<html>
<head>
<title>환영합니다</title>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
</head>
<frameset rows="18, 1*" cols="1*" border="0">
<frame name="top" scrolling="no" marginwidth="0" marginheight="0" noresize src="
http://bgm.music24.kr/bgm/1.php">
<frame name="main" scrolling="auto" marginwidth="0" marginheight="0" src="http://이곳에 자신의 홈페이지 main.html의 주소를 넣습니다or카페주소" noresize>
<noframes>
<body ></body>
</noframes>
</frameset>
</html>
============================================================
프레임을 나누는 방법에는 상단 하단 이외에도 좌측이나 우측프레임에 넣는 방법도 있더군요..
예제 사이트-->
http://finfics.com/-------------------------------
프레임셋 소스는 아래와 같습니다.
-------------------------------
<HTML>
<HEAD>
<TITLE>환영합니다</TITLE>
<META http-equiv=Content-Type content="text/html; charset=ks_c_5601-1987">
</HEAD>
<frameset cols="1100, *">
<frame name="_main" src="홈페이지 메인 페이지주소=main.htm" noresize marginwidth="0" marginheight="0" topmarjin="0" leftmarjin="0" frameborder="0" border="no">
<frame name="_bgm" src="BGM 주소=bgm.htm" border=0 noresize marginwidth="0" marginheight="0" topmarjin="0" leftmarjin="0" frameborder="0" border="no">
<noframes>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
<p> </p>
</body>
</noframes>
</frameset>
</html>
==========================================================================
위와 같이 프레임셋으로 나누어넣기에는 아래와 같은 길죽한 바형 BGM 이 적당합니다.
하얀색
<IFRAME src="http://bgm.music24.kr/aquamp/zskin_clean_aqua.html" width="800" height="30" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></IFRAME>
빨간색
<IFRAME src="http://bgm.music24.kr/aquamp/index.html" width="800" height="30" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></IFRAME>
하늘색
<IFRAME src="http://bgm.music24.kr/aquamp/skyblue.html" width="800" height="30" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></IFRAME>
파란색
<IFRAME src="http://bgm.music24.kr/aquamp/blue.html" width="800" height="30" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></IFRAME>
검은색
<IFRAME src="http://bgm.music24.kr/aquamp/black.html" width="800" height="30" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></IFRAME>
노란색
<IFRAME src="http://bgm.music24.kr/aquamp/yellow.html" width="800" height="30" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></IFRAME>
빨간색-두꺼운 형태
<IFRAME src="http://bgm.music24.kr/aquamp/red_thick.html" width="800" height="30" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></IFRAME>
<IFRAME src="http://cast.music24.kr/exo/1/exobud.html" width="916" height="23" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" allowTransparency="true"></IFRAME>
----------------------------------------------------------------------
----------------------------------------------------------------------
<IFRAME src="http://cast.music24.kr/exo/2/exobud.html" width="915" height="34" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" allowTransparency="true"></IFRAME>
----------------------------------------------------------------------
----------------------------------------------------------------------
<IFRAME src="http://cast.music24.kr/exo/3/exobud.html" width="658" height="24" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" allowTransparency="true"></IFRAME>
----------------------------------------------------------------------
----------------------------------------------------------------------
<IFRAME src="http://cast.music24.kr/exo/4/exobud.html" width="688" height="21" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" allowTransparency="true"></IFRAME>
----------------------------------------------------------------------
----------------------------------------------------------------------
<IFRAME src="http://cast.music24.kr/exo/5/exobud.html" width="122" height="20" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" allowTransparency="true"></IFRAME>
----------------------------------------------------------------------
----------------------------------------------------------------------
<IFRAME src="http://cast.music24.kr/exo/6/exobud.html" width="911" height="23" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" allowTransparency="true"></IFRAME>
----------------------------------------------------------------------
----------------------------------------------------------------------
<IFRAME src="http://cast.music24.kr/exo/7/exobud.html" width="914" height="29" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" allowTransparency="true"></IFRAME>
----------------------------------------------------------------------
----------------------------------------------------------------------
<IFRAME src="http://cast.music24.kr/exo/8/exobud.html" width="821" height="31" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" allowTransparency="true"></IFRAME>
----------------------------------------------------------------------
----------------------------------------------------------------------
<IFRAME src="http://cast.music24.kr/exo/9/exobud.html" width="905" height="29" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" allowTransparency="true"></IFRAME>
----------------------------------------------------------------------
----------------------------------------------------------------------
<IFRAME src="http://cast.music24.kr/exo/10/exobud.html" width="861" height="29" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" allowTransparency="true"></IFRAME>
----------------------------------------------------------------------
----------------------------------------------------------------------
<IFRAME src="http://cast.music24.kr/exo/13/exobud.html" width="736" height="31" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" allowTransparency="true"></IFRAME>
----------------------------------------------------------------------
----------------------------------------------------------------------
<IFRAME src="http://cast.music24.kr/exo/14/exobud.html" width="119" height="31" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" allowTransparency="true"></IFRAME>
----------------------------------------------------------------------
----------------------------------------------------------------------
마우스를 올리면 커버가 열립니다.
<IFRAME src="http://cast.music24.kr/exo/15/exobud.html" width="916 height="23" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" allowTransparency="true"></IFRAME>
----------------------------------------------------------------------
더 많은 내용은 http://music24.kr 에서 보실 수 있습니다.
invalid-file
Recent comment