Osx Zip Directory
Description
A featured plugin to add 360 degrees and 3d animate view in wordpress using shortcodes
Responsive Web Design
Displays 3D model on wordPress page, post, or custom page
3D model Rotation enabled
Based on a sequence of images (jpg or png) to animate and display the product
Transparency available for png images
Zoom option (best viewed on fullscreen)
Images can be generated with Blender animation
Photography turntable ready
Looking for a 3D model (obj, stl, wrl, fbx format) full rotation & zoom plugin?
Try the Vrm360 wordpress 3D plugin
Demo
Download WordPress Plugin page: wordpress plugins spin360 page
GitHub WordPress Plugin: https://github.com/easyw/spin360
Full screen (fix for osx, chrome both desktop and mobile), no more need to have ‘/’ at the end of folder name, subset of font-awesome and ionicons buttons. Basic version with shortcode and multiple shows, relative upload folder path and Play button with natural sense of interaction, font-awesome buttons, speed parameter, tooltips. ApacheDS is an extensible and embeddable directory server entirely written in Java, which has been certified LDAPv3 compatible by the Open Group.
jQuery plugin page: http://spritespin.ginie.eu/
Plugin Features
- 3D model Display
- 360 deg and 3D view enabled
- Photography turntable ready
- ShortCodes System
- Very Lightweight
Installation
- Upload the plugin files to the
your_wordpress_plugins_dir/spin360
directory, or Install as a regular WordPress plugin - Go your Plugins page via WordPress Dashboard and activate it
Use these shortcodes to post or page
[spin360 canvas_name='s1' imgs_folder='my_product/' imgs_nbr=100 aspect_ratio=1.33333 speed=1.0 loop=true]
[spin360 canvas_name='s1' imgs_folder='spin360demo/' imgs_nbr=48 aspect_ratio=1.33333]
[spin360 canvas_name='s1' imgs_folder='spin360demo/' imgs_nbr=100 autostart=false gesture=vertical]
[spin360 canvas_name='s1' imgs_folder='spin360demo/' imgs_nbr=36 hide_cmds=all]
defaults:
canvas_name='s1', aspect_ratio=1.33333, speed=-1.0, loop=true hide_cmds=zoom,fullscreen
Be sure to use the HTML editor when inserting shortcodes!
check that your Quotation marks are exactly the correct symbol (Alt 34)
Use
jpg
orpng
image files to display your model as a dynamic sequence;Name your images as following:
0001.jpg, 0002.jpg, ..., 0048.jpg (4 digits name)
for
png
as following:0001.png, 0002.png, ..., 0048.png (4 digits name)
and addimg_type=png
to your shortcodeNB
.jpg
or.png
extension MUST be lowercase[spin360 canvas_name='s1' imgs_folder='spin360demo/' imgs_nbr=36 img_type=png]
for 3D models the image sequence can be generated using Blender turntable animation
upload your project image files in a
your_wordpress_uploads_dir/spin360show
subfolder(i.e
'your_wordpress_uploads_dir/spin360show/my_product/'
) via a standard FTP accessNB: for multisite add
/sites/#blog_id/
to pathyour_wordpress_uploads_dir/sites/2/spin360show
Modify the css style to adapt some features
- change
css/spin-style.css
to change some style aspect
- change
click to stop animation, click and hold to drag, double click to restart or invert sense of animation
Shortcode Parameters:
- canvas_name = canvas name needed in case of multiple shows on the same page (required)
- imgs_folder = folder of image sequence project; i.e.:
'spin360demo/'
or'my_product'
(required) imgs_nbr = any number > 1; i.e.: 100 image screenshots (required)
Note: name your images as following:
0001.jpg, 0002.jpg, ..., 0100.jpg (4 digits name)
or for png as following:0001.png, 0002.png, ..., 0100.png (4 digits name)
and addimg_type=png
to your shortcode
Don’t mix up jpg with png image types on the same project folder.- speed = any number > 0.1 and < 10; i.e.: 1.5; Negative values will start the animation reversed
- aspect_ratio = any number i.e.: 1.3333 for 4/3 aspect ratio
- change
css/spin-style.css
to adapt some style aspect (as loading image or button font color) - loop = true or false (default is true)
- autostart = true or false (default is true) auto start the animation on load
- gesture = ‘horizontal’ (default) will make animation on mouse left/right movement; ‘vertical’ value will make animation on mouse up/dowm movement
- hide_cmds = all, fullscreen, reverse, zoom or false (default is false)
- button_color = ‘#00ABFF’ (default) HTML color values
Osx Zip Exclude Directory
FAQ
3D model Rotation, 360 view enabled, based on image sequences
Osx Zip Directory Tree
- Fully Responsive design; works on mobile devices;
- click to STOP;
- click and hold to DRAG;
- doubleclick to RESTART;
speed parameter, loop=true/false, full screen optimization
in case you have trouble in FTP your image folders under the folder
your_wordpress_uploads_dir/spin360show
, check thespin360show
folder permissions or just delete it and make a new one- for multisite add
/sites/#blog_id/
to pathyour_wordpress_uploads_dir/sites/2/spin360show
- shortcode support for alternative location of your 360 product images; valuable when you need to host image assets on a dedicated file server or CDN; just place your full folder location path in
'imgs_folder'
shortcode variable - be sure to use the HTML editor when inserting shortcodes
- to have many spinning images or to resize the image in the page, it is possible to use the shortcode inside i.e. a table and set the cell dimension of the table. That will force the plugin to resize itself to the cell size
- Check if your Quotation marks are exactly the correct symbol (Alt 34) https://usefulshortcuts.com/alt-codes/punctuation-alt-codes.php
- clear your site cache after a plugin update
- in case of use of “minify HTML” plugin, don’t enable compression for inline scripts