web_360_image Shortcode
The web_360_image shortcode renders an interactive equirectangular panorama using the theme's Pannellum player. Its height remains 300px. The equivalent 360 Image block additionally offers a configurable height through generated page CSS.
The attributes below match the current Page Builder controls and public output. Use raw syntax only for reviewed content that cannot be maintained through the visual controls.
Usage
[web_360_image get_image="123" yaw="0" pitch="0" accessible_name="A panoramic view of the room"]Attributes
| Attribute | Default | Accepted values | Purpose |
|---|---|---|---|
get_image |
— | Library reference or valid HTTP(S) source | Complete equirectangular panorama, normally 2:1. Library sources use current metadata. |
yaw |
0 |
−180 to 180 degrees | Initial horizontal view. Out-of-range values are bounded. |
pitch |
0 |
−90 to 90 degrees | Initial vertical view, also constrained by the player's field of view. |
accessible_name |
Current alt, then title | Plain text | Accessible description of the panorama. |
device_visibility |
— | String unless stated otherwise | Applies the selected responsive visibility rule. |
el_id |
— | Valid unique HTML ID | Enter element ID (Note: make sure it is unique and valid according to w3c specification). |
el_class |
— | String unless stated otherwise | If you wish to style particular content element differently, then use this field to add a class name and then refer to it in your css file. |
Customize the viewer stylesheet
Administrators can replace the complete Pannellum viewer stylesheet under Settings → POM Theme → Advanced → Custom CSS → Shortcode CSS assets → 360 image. Saving publishes an optimized per-site copy but does not add the stylesheet to pages that do not contain the shortcode. Reverting returns the existing web-360-image handle to the current 360-image.min.css supplied by the theme.
This setting changes presentation only. It does not replace the viewer script, select an image, or change the configured yaw and pitch values.
Verification
Check the initial angles, dragging, keyboard zoom, fullscreen and responsive visibility. Mouse-wheel zoom is disabled; compass display is enabled. Closed containers initialize when visible. If WebGL or the source is unavailable, a source-image fallback remains. Keep essential information available as ordinary text too. Shortcode rendering and conditional assets remain available when Page Builder administration is disabled.