https://szeching.com/tags/krpano/ Recent content in Krpano on 瓶子裡的小狐狸 Hugo -- gohugo.io zh-Hant © 2026 Y Cheung Sun, 08 Nov 2015 11:47:15 +0000 https://szeching.com/krpano-video-embed-wordpress-plugin/ Sun, 08 Nov 2015 11:47:15 +0000 https://szeching.com/krpano-video-embed-wordpress-plugin/ <p>krpano 做 Panoramic Video 的時候很麻煩（<a href="https://krpano.com/video/" target="_blank" rel="noreferrer">官網說明太簡單</a>），要自己改一堆東西然後上傳，然後再用iframe的方式在wordpress 文章或者頁面中加載，一整個就煩透了。於是用空閒時間順手做了這個插件，稍微簡化了一下流程。</p> <h2 class="relative group">軟體版本： <div id="軟體版本" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#%e8%bb%9f%e9%ab%94%e7%89%88%e6%9c%ac" aria-label="定位點">#</a> </span> </h2> <ul> <li>Wordpress 版本 4.3.1</li> <li>Krpano 版本 1.18</li> </ul> <h2 class="relative group">插件下載： <div id="插件下載" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#%e6%8f%92%e4%bb%b6%e4%b8%8b%e8%bc%89" aria-label="定位點">#</a> </span> </h2> <ul> <li><a href="https://github.com/amyuki/krpano-video-plugin" target="_blank" rel="noreferrer">Github</a></li> <li><a href="https://app.box.com/s/q8tcx32bql1yewspivzopqr95rs6z97e" target="_blank" rel="noreferrer">BOX</a></li> </ul> <h2 class="relative group">安裝插件： <div id="安裝插件" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#%e5%ae%89%e8%a3%9d%e6%8f%92%e4%bb%b6" aria-label="定位點">#</a> </span> </h2> <ol> <li>文件解壓縮至 <code>/wp-content/plugins/</code></li> <li>將你購買的krpano程序中相應的文件替換掉本插件中的文件，包括 <code>/krpano/krpano.js</code> 和 <code>/krpano/krpano.swf</code> ，（本插件中的文件源自未授權demo版，請自行購買授權）。</li> <li>登錄wordpress後台，並激活插件</li> </ol> <h2 class="relative group">使用插件: <div id="使用插件" class="anchor"></div> <span class="absolute top-0 w-6 transition-opacity opacity-0 -start-6 not-prose group-hover:opacity-100 select-none"> <a class="text-primary-300 dark:text-neutral-700 !no-underline" href="#%e4%bd%bf%e7%94%a8%e6%8f%92%e4%bb%b6" aria-label="定位點">#</a> </span> </h2> <ol> <li>將 Panoramic Video 壓制成 1920x960 和 1024x512 尺寸，推薦WEBM格式或MP4格式</li> <li>製作 Panoramic Video 封面縮略圖兩張，尺寸分別為1920x960 像素 和 1024x512 像素</li> <li>將視頻和圖片通過FTP上傳至 <code>/krpano/video</code> 文件夾中</li> <li>點擊編輯器上的按鈕(如下圖所示）在需要嵌入Panoramic Video的地方插入代碼 <figure><img class="my-0 rounded-md" loading="lazy" decoding="async" fetchpriority="auto" alt="01" width="805" height="500" src="https://szeching.com/images/YUKIMINIPC20151108192756_hu_48ce30cbd5a816da.png" srcset="https://szeching.com/images/YUKIMINIPC20151108192756_hu_48ce30cbd5a816da.png 800w, https://szeching.com/images/YUKIMINIPC20151108192756.png 1280w" sizes="(min-width: 768px) 50vw, 65vw" data-zoom-src="https://szeching.com/images/YUKIMINIPC20151108192756.png"></figure> </li> </ol> <figure><img class="my-0 rounded-md" loading="lazy" decoding="async" fetchpriority="auto" alt="02" width="823" height="582" src="https://szeching.com/images/YUKIMINIPC20151108192959_hu_fa01c6b55d67cc2c.png" srcset="https://szeching.com/images/YUKIMINIPC20151108192959_hu_fa01c6b55d67cc2c.png 800w, https://szeching.com/images/YUKIMINIPC20151108192959.png 1280w" sizes="(min-width: 768px) 50vw, 65vw" data-zoom-src="https://szeching.com/images/YUKIMINIPC20151108192959.png"></figure> <p>務必完整填寫完所有表單（如下圖示） <figure><img class="my-0 rounded-md" loading="lazy" decoding="async" fetchpriority="auto" alt="" width="599" height="337" src="https://szeching.com/images/YUKIMINIPC20151108193956.png" srcset="https://szeching.com/images/YUKIMINIPC20151108193956.png 800w, https://szeching.com/images/YUKIMINIPC20151108193956.png 1280w" sizes="(min-width: 768px) 50vw, 65vw" data-zoom-src="https://szeching.com/images/YUKIMINIPC20151108193956.png"></figure> 5. 如需自定義XML，文件放在 <code>/krpano/xml</code> 中</p>