"틀:동영상스와이퍼"의 두 판 사이의 차이
광주문화예술인문스토리플랫폼
| (같은 사용자의 중간 판 15개는 보이지 않습니다) | |||
| 16번째 줄: | 16번째 줄: | ||
width="100%" | width="100%" | ||
height="100%" | height="100%" | ||
| − | src="{{#replace:{{{1|}}}|watch?v-|embed/}}" | + | src="{{#explode:{{#replace:{{#replace:{{{1|}}}|watch?v=|embed/}}|watch?v-|embed/}}|&|0}}" |
frameborder="0" | frameborder="0" | ||
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | ||
| 30번째 줄: | 30번째 줄: | ||
width="100%" | width="100%" | ||
height="100%" | height="100%" | ||
| − | src="{{#replace:{{{2|}}}|watch?v-|embed/}}" | + | src="{{#explode:{{#replace:{{#replace:{{{2|}}}|watch?v=|embed/}}|watch?v-|embed/}}|&|0}}" |
frameborder="0" | frameborder="0" | ||
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | ||
| 44번째 줄: | 44번째 줄: | ||
width="100%" | width="100%" | ||
height="100%" | height="100%" | ||
| − | src="{{#replace:{{{3|}}}|watch?v-|embed/}}" | + | src="{{#explode:{{#replace:{{#replace:{{{3|}}}|watch?v=|embed/}}|watch?v-|embed/}}|&|0}}" |
frameborder="0" | frameborder="0" | ||
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | ||
| 58번째 줄: | 58번째 줄: | ||
width="100%" | width="100%" | ||
height="100%" | height="100%" | ||
| − | src="{{#replace:{{{4|}}}|watch?v-|embed/}}" | + | src="{{#explode:{{#replace:{{#replace:{{{4|}}}|watch?v=|embed/}}|watch?v-|embed/}}|&|0}}" |
frameborder="0" | frameborder="0" | ||
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | ||
| 72번째 줄: | 72번째 줄: | ||
width="100%" | width="100%" | ||
height="100%" | height="100%" | ||
| − | src="{{#replace:{{{5|}}}|watch?v-|embed/}}" | + | src="{{#explode:{{#replace:{{#replace:{{{5|}}}|watch?v=|embed/}}|watch?v-|embed/}}|&|0}}" |
frameborder="0" | frameborder="0" | ||
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | ||
| 86번째 줄: | 86번째 줄: | ||
width="100%" | width="100%" | ||
height="100%" | height="100%" | ||
| − | src="{{#replace:{{{6|}}}|watch?v-|embed/}}" | + | src="{{#explode:{{#replace:{{#replace:{{{6|}}}|watch?v=|embed/}}|watch?v-|embed/}}|&|0}}" |
frameborder="0" | frameborder="0" | ||
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | ||
| 100번째 줄: | 100번째 줄: | ||
width="100%" | width="100%" | ||
height="100%" | height="100%" | ||
| − | src="{{#replace:{{{7|}}}|watch?v-|embed/}}" | + | src="{{#explode:{{#replace:{{#replace:{{{7|}}}|watch?v=|embed/}}|watch?v-|embed/}}|&|0}}" |
frameborder="0" | frameborder="0" | ||
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | ||
| 114번째 줄: | 114번째 줄: | ||
width="100%" | width="100%" | ||
height="100%" | height="100%" | ||
| − | src="{{#replace:{{{8|}}}|watch?v-|embed/}}" | + | src="{{#explode:{{#replace:{{#replace:{{{8|}}}|watch?v=|embed/}}|watch?v-|embed/}}|&|0}}" |
frameborder="0" | frameborder="0" | ||
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | ||
| 128번째 줄: | 128번째 줄: | ||
width="100%" | width="100%" | ||
height="100%" | height="100%" | ||
| − | src="{{#replace:{{{9|}}}|watch?v-|embed/}}" | + | src="{{#explode:{{#replace:{{#replace:{{{9|}}}|watch?v=|embed/}}|watch?v-|embed/}}|&|0}}" |
frameborder="0" | frameborder="0" | ||
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | ||
| 142번째 줄: | 142번째 줄: | ||
width="100%" | width="100%" | ||
height="100%" | height="100%" | ||
| − | src="{{#replace:{{{10|}}}|watch?v-|embed/}}" | + | src="{{#explode:{{#replace:{{#replace:{{{10|}}}|watch?v=|embed/}}|watch?v-|embed/}}|&|0}}" |
frameborder="0" | frameborder="0" | ||
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | ||
| 202번째 줄: | 202번째 줄: | ||
if (iframe.src) { | if (iframe.src) { | ||
if (!iframe.src.includes("youtu")) return; | if (!iframe.src.includes("youtu")) return; | ||
| − | // & | + | |
| − | + | // 기존 URL에서 ?와 & 모두 제거하고 깨끗한 embed URL만 추출 | |
| − | if (ampIndex !== -1) { | + | let cleanUrl = iframe.src; |
| − | + | const questionIndex = cleanUrl.indexOf("?"); | |
| + | const ampIndex = cleanUrl.indexOf("&"); | ||
| + | |||
| + | if (questionIndex !== -1) { | ||
| + | cleanUrl = cleanUrl.substring(0, questionIndex); | ||
| + | } else if (ampIndex !== -1) { | ||
| + | cleanUrl = cleanUrl.substring(0, ampIndex); | ||
} | } | ||
| + | |||
// enablejsapi=1 파라미터 추가 | // enablejsapi=1 파라미터 추가 | ||
| − | + | iframe.src = cleanUrl + "?enablejsapi=1"; | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
} | } | ||
}); | }); | ||
| 291번째 줄: | 293번째 줄: | ||
{{#tag:html| | {{#tag:html| | ||
<script src="https://unpkg.com/swiper@8/swiper-bundle.min.js"></script> | <script src="https://unpkg.com/swiper@8/swiper-bundle.min.js"></script> | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
}} | }} | ||
| − | |||
| − | |||
== 템플릿 사용 예제 == | == 템플릿 사용 예제 == | ||
{{동영상스와이퍼 | {{동영상스와이퍼 | ||
| − | | https://www.youtube.com/embed/MlM1fbaHZTQ&list-RDMlM1fbaHZTQ&start_radio-1? | + | | https://www.youtube.com/watch?v=MlM1fbaHZTQ&list=RDMlM1fbaHZTQ&start_radio=1 |
| + | | https://www.youtube.com/embed/MlM1fbaHZTQ&list-RDMlM1fbaHZTQ&start_radio-1 | ||
| + | | https://www.youtube.com/watch?v-nN6hHjH2O-c | ||
| + | | https://www.youtube.com/watch?v-nN6hHjH2O-c | ||
| + | }} | ||
| + | <pre> | ||
| + | == 템플릿 사용 예제 == | ||
| + | {{동영상스와이퍼 | ||
| + | | https://www.youtube.com/watch?v=MlM1fbaHZTQ&list=RDMlM1fbaHZTQ&start_radio=1 | ||
| + | | https://www.youtube.com/embed/MlM1fbaHZTQ&list-RDMlM1fbaHZTQ&start_radio-1 | ||
| https://www.youtube.com/watch?v-nN6hHjH2O-c | | https://www.youtube.com/watch?v-nN6hHjH2O-c | ||
| https://www.youtube.com/watch?v-nN6hHjH2O-c | | https://www.youtube.com/watch?v-nN6hHjH2O-c | ||
}} | }} | ||
| + | * = 가 있을때 아래와 같이 | ||
| + | {{동영상스와이퍼 | ||
| + | | 1=https://www.youtube.com/watch?v=MlM1fbaHZTQ&list=RDMlM1fbaHZTQ&start_radio=1 | ||
| + | | 2=https://www.youtube.com/embed/MlM1fbaHZTQ&list-RDMlM1fbaHZTQ&start_radio-1 | ||
| + | | 3=https://www.youtube.com/watch?v-nN6hHjH2O-c | ||
| + | | 4=https://www.youtube.com/watch?v-nN6hHjH2O-c | ||
| + | }} | ||
| + | 1. 위 예제는 동영상 스와이퍼 템플릿 사용 예시입니다. watch?v- 형식의 유튜브 URL을 입력하면 자동으로 embed 형식으로 변환됩니다. | ||
| + | 2. 위 예제와 같이 = 가 있으면 노출이 안됩니다. = 가 있을때 순번= 이 필요합니다. | ||
| + | </pre> | ||
| − | |||
| − | |||
| − | |||
| − | |||
</noinclude> | </noinclude> | ||
2025년 12월 29일 (월) 11:31 기준 최신판
템플릿 사용 예제
== 템플릿 사용 예제 ==
{{동영상스와이퍼
| https://www.youtube.com/watch?v=MlM1fbaHZTQ&list=RDMlM1fbaHZTQ&start_radio=1
| https://www.youtube.com/embed/MlM1fbaHZTQ&list-RDMlM1fbaHZTQ&start_radio-1
| https://www.youtube.com/watch?v-nN6hHjH2O-c
| https://www.youtube.com/watch?v-nN6hHjH2O-c
}}
* = 가 있을때 아래와 같이
{{동영상스와이퍼
| 1=https://www.youtube.com/watch?v=MlM1fbaHZTQ&list=RDMlM1fbaHZTQ&start_radio=1
| 2=https://www.youtube.com/embed/MlM1fbaHZTQ&list-RDMlM1fbaHZTQ&start_radio-1
| 3=https://www.youtube.com/watch?v-nN6hHjH2O-c
| 4=https://www.youtube.com/watch?v-nN6hHjH2O-c
}}
1. 위 예제는 동영상 스와이퍼 템플릿 사용 예시입니다. watch?v- 형식의 유튜브 URL을 입력하면 자동으로 embed 형식으로 변환됩니다.
2. 위 예제와 같이 = 가 있으면 노출이 안됩니다. = 가 있을때 순번= 이 필요합니다.