웹페이지(html)에, 혹은 내 웹사이트에 PPT 파일 뷰어 기능을 넣고 싶다면 어떻게 해야 할까요?
이번 포스팅에서는 웹페이지에서 PPT 파일을 출력하는 방법을 알아보겠습니다.
웹 개발 관련 커뮤니티를 돌아다니다 발견한 정보인데, 유용한 것 같아서 정리해봤습니다.
해당 방법은 마이크로소프트사의 웹 오피스(파워포인트) 기능 + HTML 아이프레임 태그를 기반으로 동작합니다.
(마이크로소프트 온라인 오피스 사이트에서는 반드시 로그인을 해야 오피스 기능이 사용 가능하나, 해당 포스팅 내용의 웹 PPT 파일 출력은 별도의 과정이 필요 없습니다)
정말 쉽습니다.
핵심 소스는 딱 1줄입니다.
1
|
<iframe src="https://view.officeapps.live.com/op/embed.aspx?src=PPT파일경로" width="800" height="600"></iframe>
|
cs |
https://view.officeapps.live.com/op/embed.aspx?src=PPT파일경로에서
PPT파일경로는 본인이 PPT 파일을 업로드 한 서버의 경로를 도메인 주소 포함하여 입력.
예시) example.com/file/ppt/sample.pptx
- 결과 화면 -
오른쪽 하단의 버튼을 클릭하면 새 창으로 열기가 됩니다.
- 새 창으로 열기 화면 -
이 상태에서 오른쪽 상단의 '슬라이드 쇼 시작' 또는 오른쪽 하단의 버튼을 클릭하면 슬라이드 쇼로 전환됩니다.
- 슬라이드 쇼 -
웹페이지 상에서 파워포인트 슬라이드 쇼를 하는 것처럼 출력이 가능합니다.
※ PC 브라우저에서는 슬라이드 쇼가 가능하지만, 모바일 브라우저는 슬라이드 쇼 기능이 없는 듯 하니 참고 바랍니다.
- 예제 소스 -
(http://sterster3832.iwinv.net/_dev/pdfppt/test.php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
<?php
if (isset($_FILES['ppt_file']['name'])) {
// 설정
$allowed_ext = array('ppt','pptx');
// 변수 정리
$error = $_FILES['ppt_file']['error'];
$name = $_FILES['ppt_file']['name'];
$ext = array_pop(explode('.', $name));
// 오류 확인
if( $error != UPLOAD_ERR_OK ) {
switch( $error ) {
case UPLOAD_ERR_INI_SIZE:
case UPLOAD_ERR_FORM_SIZE:
echo "파일이 너무 큽니다. ($error)";
break;
case UPLOAD_ERR_NO_FILE:
echo "파일이 첨부되지 않았습니다. ($error)";
break;
default:
echo "파일이 제대로 업로드되지 않았습니다. ($error)";
}
exit;
}
// 확장자 확인
if( !in_array($ext, $allowed_ext) ) {
echo "허용되지 않는 확장자입니다.";
exit;
}
// 파일 이동
move_uploaded_file( $_FILES['ppt_file']['tmp_name'], "./$name");
$ppt_path = $_SERVER['HTTP_HOST'].str_replace(basename(__FILE__), '', $_SERVER['REQUEST_URI']).$name;
$viewer_ppt_url = "https://view.officeapps.live.com/op/embed.aspx?src=".$ppt_path;
echo "<iframe id='viewerIframe' src='". $viewer_ppt_url. "' frameborder='0' width='800' height='600'></iframe>";
}
?>
ppt 파일을 업로드하면 웹페이지에서 바로 출력됩니다.
<form method="post" enctype="multipart/form-data">
<input type="file" name="ppt_file">
<input type="submit" value="확인">
</form>
|
cs |
php로 간단히 예제를 만들어보았습니다.
input file 태그로 ppt 파일을 업로드하면 파일을 서버에 저장 후, ppt를 웹페이지에서 바로 출력하는 소스입니다.
- 예제 소스 파일 업로드 결과 화면 -
- 적용 예시 (사이트 게시판) -
※ 해당 소스는 크롬, 파이어폭스, 엣지, 익스플로러 11, 각종 모바일 브라우저 등에서 이상 없이 동작합니다.
이렇게 웹사이트, 게시판 등에 적용하여, PPT 파일을 바로 웹페이지에 출력시킬 수 있습니다.
이런저런 곳에 활용이 가능하니 유용하게 사용하시기 바랍니다.
- 같이 보면 좋은 포스팅 추천
2020.11.07 - [웹 개발 & 정보/기타] - 웹페이지에서 PDF 파일 보여주기 (PDF 뷰어 넣기)
'웹 개발 & 정보 > 기타' 카테고리의 다른 글
웹페이지에서 PDF 파일 보여주기 (PDF 뷰어 넣기) (6) | 2020.11.07 |
---|---|
Adobe XD 이미지 선택 영역 자르기 (0) | 2020.11.06 |
웹 디자인 참고 사이트 모음 (2) | 2020.07.28 |
구글 이미지 검색에서 사라진 '이미지 보기(view image)' 버튼 되살리기 (0) | 2018.03.13 |
무료 반응형웹 템플릿 사이트 모음 (11) | 2018.02.11 |