BBcode for 360 Photos with Kuula
Posted: Sat Sep 28, 2019 10:37 am
I looked at both Momento360 and Kuula to support display of 360 photos (aka "photospheres"). Preferring Kuula, I came up with some BBcode for it that preserves a desired aspect ratio.
Usage:
HTML:
If you don't want JavaScript you can instead use this:
Help line:
The "56%" in the HTML above represents an aspect ratio of approximately 16:9 which I like, but it might alternatively be a variable parameter.
Here's an example photo:
Usage:
Code: Select all
[kuula]{SIMPLETEXT}[/kuula]Code: Select all
<style>.ku-embed {position: absolute; width: 100%; height: 100%; left: 0; top: 0; border: none; max-width: 100%;}</style>
<div style="position: relative; width: 100%; height: 0; padding-bottom: 56%;">
<script src="https://static.kuula.io/embed.js" data-kuula="https://kuula.co/share/{SIMPLETEXT}?fs=1&vr=0&zoom=1&thumbs=1&alpha=0.60&logopos=bl&chromeless=0&logo=0" data-css="ku-embed"></script>
</div>Code: Select all
<div style="position: relative; width: 100%; height: 0; padding-bottom: 56%;">
<iframe style="position: absolute; width: 100%; height: 100%; left: 0; top: 0; border: none; max-width: 100%;" frameborder="0" allow="vr,gyroscope,accelerometer,fullscreen" scrolling="no" allowfullscreen="true" src="https://kuula.co/share/{SIMPLETEXT}?fs=1&vr=0&zoom=1&thumbs=1&alpha=0.60&logopos=bl&chromeless=0&logo=0"></iframe>
</div>Code: Select all
Example: [kuula]7qCvv[/kuula]Here's an example photo: