1. 게시판에서 텍스트로 쓰거나 아니면 에디터를 쓰거나에 상관없이 mp3 사운드나 mp4 동영상을 게시글의 원하는 영역에 삽입하는 방법입니다. 개수는 원칙적으로 무한입니다. 또한 유튜브도 삽입 가능합니다.
2. 사용방법
1) mp3 사운드
아래처럼 [#mp3_숫자#] 를 양 옆으로 싸고...
그 안에 첨부파일 번호와 가로 퍼센트와 위치를 ** 으로 분기하며 적용합니다.
위치는 left/right/center 3개입니다.
[#mp3_숫자#]첨부파일순서**가로퍼센트**위치[#mp3_숫자#]
[#mp3_1#]1**30**left[#mp3_1#]
[#mp3_2#]2**50**right[#mp3_2#]
[#mp3_3#]3**100**center[#mp3_3#]
.
.
.
일련번호는 중간을 빼 먹으면 안 됩니다.
2) mp4 동영상
[#mp4_숫자#]첨부파일순서**가로퍼센트**위치[#mp4_숫자#]
3) 유튜브
[#ytb_숫자#]유튜브아이디**가로퍼센트**위치[#ytb_숫자#]
4) mp3 와 mp4 와 유튜브는 서로 섞어도 상관없지만 일련번호는 본인들의 수순을 따라주어야 합니다.
3. 주의사항
에디터에서 작성시 [#mp3_1#]1**30**left[#mp3_1#] 등에 불순물 태그가 들어갈 수 있으니 꼭 html 모드에서 다른 글자가 들어가지 않았는지 확인하세요.
4. 링크된 예제 소스는 아래와 같습니다.
[#mp3_1#]1**30**left[#mp3_1#]
[mp3] 유로 2000 주제가 : E-Type - Campione
[#mp4_1#]2**50**right[#mp4_1#]
[mp4] Placebo : Special Needs
[#ytb_1#]GdoNGNe5CSg**100**center[#ytb_1#]
[유튜브] 잔나비 : 주저하는 연인들을 위해
[#mp3_2#]3**50**center[#mp3_2#]
[mp3] Clementine : Season In The Sun
5. 현재 등록 스킨은 basic pc용입니다.
다른 pc용 스킨이나 모바일용 스킨에 미디어 삽입 소스를 사용하고 싶으면...
아래소스를 view.skin.php 의 가장 하단부에 입력해 주세요.
[code]
<script>
<?php for ($mp34 = 1; $mp34 < count($view['file']); $mp34++) { ?>
<?php echo "mp34_".$mp34; ?> = "<?php echo $view['file'][$mp34 - 1]['path'].'/'.$view['file'][$mp34 - 1]['file']; ?>";
<?php } ?>
mp3Total = Math.floor(bo_v_con.innerHTML.split("[#mp3_").length / 2);
mp4Total = Math.floor(bo_v_con.innerHTML.split("[#mp4_").length / 2);
ytbTotal = Math.floor(bo_v_con.innerHTML.split("[#ytb_").length / 2);
function mp3Mode() {
mp3String = bo_v_con.innerHTML;
mp3Split = mp3String.split("[#mp3_" + arguments[0] + "#]")[1].split("**");
if (mp3Split[2] == "left") mp3Margin = 0;
else if (mp3Split[2] == "right") mp3Margin = 100 - mp3Split[1];
else mp3Margin = (100 - mp3Split[1]) / 2;
mp3Html = "<div><audio style=width:" + mp3Split[1] + "%;margin-left:" + mp3Margin + "%;display:block src=" + this['mp34_' + mp3Split[0]] + " controls loop controlsList=nodownload></audio></div>";
bo_v_con.innerHTML = mp3String.split("[#mp3_" + arguments[0] + "#]")[0] + mp3Html + mp3String.split("[#mp3_" + arguments[0] + "#]")[2];
}
function mp4Mode() {
mp4String = bo_v_con.innerHTML;
mp4Split = mp4String.split("[#mp4_" + arguments[0] + "#]")[1].split("**");
if (mp4Split[2] == "left") mp4Margin = 0;
else if (mp4Split[2] == "right") mp4Margin = 100 - mp4Split[1];
else mp4Margin = (100 - mp4Split[1]) / 2;
mp4Html = "<div><video style=width:" + mp4Split[1] + "%;margin-left:" + mp4Margin + "%;display:block src=" + this['mp34_' + mp4Split[0]] + " controls loop controlsList=nodownload></video></div>";
bo_v_con.innerHTML = mp4String.split("[#mp4_" + arguments[0] + "#]")[0] + mp4Html + mp4String.split("[#mp4_" + arguments[0] + "#]")[2];
}
function ytbMode() {
ytbString = bo_v_con.innerHTML;
ytbSplit = ytbString.split("[#ytb_" + arguments[0] + "#]")[1].split("**");
if (ytbSplit[2] == "left") ytbMargin = 0;
else if (ytbSplit[2] == "right") ytbMargin = 100 - ytbSplit[1];
else ytbMargin = (100 - ytbSplit[1]) / 2;
ytbHtml = "<div><iframe id=ytb_" + arguments[0] + " style=width:" + ytbSplit[1] + "%;margin-left:" + ytbMargin + "%;display:block src=https://www.youtube.com/embed/" + ytbSplit[0] + "?loop=1&playlist=" + ytbSplit[0] + " frameborder=0 allowfullscreen></iframe></div>";
bo_v_con.innerHTML = ytbString.split("[#ytb_" + arguments[0] + "#]")[0] + ytbHtml + ytbString.split("[#ytb_" + arguments[0] + "#]")[2];
this["ytb_" + arguments[0]].style.height = this["ytb_" + arguments[0]].offsetWidth * 9 / 16 + 'px';
}
if (("." + bo_v_con.innerHTML).indexOf("[#mp3_") > 0) for (mp3 = 1; mp3 <= mp3Total; mp3++) mp3Mode(mp3);
if (("." + bo_v_con.innerHTML).indexOf("[#mp4_") > 0) for (mp4 = 1; mp4 <= mp4Total; mp4++) mp4Mode(mp4);
if (("." + bo_v_con.innerHTML).indexOf("[#ytb_") > 0) for (ytb = 1; ytb <= ytbTotal; ytb++) ytbMode(ytb);
</script>
[/code]
댓글 19개
저는 이렇게 적용해보았는데 제대로 했는지 모르겠습니다.
mp3, mp4파일을 첨부파일로 가져와서 출력해주는데요.
파일이 많은 경우에 게시판 설정에서 파일 업로드 개수를 적당하게 변경해줍니다.
mp3파일을 여러개 적용할 경우에는
#mp3_1#]1**30**left[#mp3_1#]
[#mp3_2#]2**30**left[#mp3_2#]
[#mp3_3#]3**30**left[#mp3_3#]
[#mp3_4#]4**30**left[#mp3_4#] 의 4**30**left에서 4는 업로드한 파일을 순서를 말합니다.
mp4파일을 적용하는 경우에는
[#mp4_1#]5**50**left[#mp4_1#]
[#mp4_2#]6**50**center[#mp4_2#]
[#mp4_3#]7**50**right[#mp4_3#] 에서 5, 6, 7은 역시 업로드한 파일의 순서를 나타내며, [#mp4_1#]처럼 시작은 mp4_1부터 합니다.
유튜브 파일을 적용하는 경우에는
[#ytb_1#]GdoNGNe5CSg**100**center[#ytb_1#]
[유튜브] 잔나비 : 주저하는 연인들을 위해
<br><br>
[#ytb_2#]CA7dpvEei18**100**center[#ytb_2#]
연기 잘 하는 아이유
GdoNGNe5CSg와 같은 유튜브 재생아이디를 넣어줍니다.
그리고 첨부파일이 맨아래에 나타나고 다운로드가 가능하게 되어있는데, 파일이 거슬리거나 다운로드를 막기위해서는 view.skin.php파일의 150줄 정도의 <section id="bo_v_file"> 이부분을 주석처리하면 됩니다.
mp3파일에 어울리는 이미지나 노래가사를 넣는 경우에는 작성할때 html을 체크하고 html, css를 사용하여 넣으면 됩니다.
[http://sir.kr/data/editor/2108/939b5dde40b0ada93c99c50f72f5c62a_1628627053_3817.png]
http://pws.co.kr/bbs/board.php?bo_table=basic_original&wr_id=2
<code>
<img src="http://pws.co.kr/leejunghee.png" style="width:400px;"><br>
<p><h2>이정희의 "그대여"</h2>
바람도 차가운날 저녁에 그이와 단둘이서 만났네 <br><br>정답던 이시간이 지나면 나혼자 떠나가야해 <br> <br>거리엔 가로등불 하나둘 어둠은 불빛속에 내리고 <br> <br>정답던 이시간이 지나면 나혼자 떠나가야해 <br><br>그대여 그대여 울지말아요 사랑은 사랑은 슬픈거래요 <br><br> 그대여 그대여 나를 보세요 그리고 웃어요 <br><br>거리엔 가로등불 하나둘 어둠은 불빛속에 내리고 <br> <br>정답던 이시간이 지나면 나혼자 떠나가야해 <br> <br>그대여 그대여 울지 말아요 사랑은 사랑은 슬픈거래요 <br> <br>그대여 그대여 나를 보세요 그리고 웃어요 <br><br>거리엔 가로등불 하나둘 어둠은 불빛속에 내리고<br> <br>정답던 이시간이 지나면 나혼자 떠나가야해"
</p>
[#mp3_1#]1**30**left[#mp3_1#]
<br><br>
<img src="http://pws.co.kr/dul5.png" style="width:400px;">
둘다섯의 "긴머리 소녀"
[#mp3_2#]2**30**left[#mp3_2#]
<br><br>
<img src="http://pws.co.kr/kimsehwan.png" style="width:400px;">
김세환의 "길가에 앉아서"
[#mp3_3#]3**30**left[#mp3_3#]
<br><br>
<img src="http://pws.co.kr/fevers.png" style="width:400px;">
휘버스의 "그대로 그렇게"
[#mp3_4#]4**30**left[#mp3_4#]
휘버스의 "그대로 그렇게"
<br><br>
Kimchulyong is the best man in the world !!
[#mp4_1#]5**50**left[#mp4_1#]
<br><br>
Effect Effect video
[#mp4_2#]6**50**center[#mp4_2#]
<br><br>
Text Animation "Tclub"
[#mp4_3#]7**50**right[#mp4_3#]
<br><br>
[#ytb_1#]GdoNGNe5CSg**100**center[#ytb_1#]
[유튜브] 잔나비 : 주저하는 연인들을 위해
<br><br>
[#ytb_2#]CA7dpvEei18**100**center[#ytb_2#]
연기 잘 하는 아이유
말복에 고생 많으셨습니다.
게시판 목록
그누보드5 스킨
| 번호 | 분류 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|---|
| 2000 | 게시판 | 4년 전 | 4036 | ||
| 1999 | 레이아웃 | 4년 전 | 11151 | ||
| 1998 | 갤러리 | 4년 전 | 4989 | ||
| 1997 | 게시판 | 4년 전 | 4828 | ||
| 1996 | 갤러리 | 4년 전 | 3993 | ||
| 1995 | 갤러리 | 4년 전 | 4114 | ||
| 1994 | 갤러리 | 4년 전 | 3871 | ||
| 1993 | 게시판 | 4년 전 | 2165 | ||
| 1992 | 갤러리 | 4년 전 | 4752 | ||
| 1991 | 갤러리 | 4년 전 | 3085 | ||
| 1990 | 게시판 | 4년 전 | 3565 | ||
| 1989 | 게시판 | 4년 전 | 5291 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기