There are three ways to add images to your manufacturing app:
- Copying and pasting from your computer's clipboard in Chrome
- Manually uploading from your desktop
- Using an image URL
Copying and Pasting Images
You can copy and paste images into apps using CTRL+C and CTRL+V on Windows, and CMD+C and CMD+V on Mac.
1- Navigate to the Step in the app where you would like to upload an image/picture.
2- Click on “Embed” in the App Builder Tool Bar and choose “Image” from the resulting dropdown.
3- Upload the content by clicking the “upload” arrow under the Widget tab in the Context Pane.
4. Use the “refresh” arrow to “Reset Aspect Ratio” for easy formatting.
You can directly drag images from your desktop or a folder into an individual Step in the App Builder. This works well if you have many images in a folder, and you would like to quickly add them to steps.
Using Image URLs
You can create a variable with type "image" and then store a specific image as a default value. Or, you can update that variable with a new image in the Trigger Editor.
To store an image in a variable by default, choose the Variables menu from the App tab of the Context Pane.
Then, create a variable with type "Image URL".
Then, choose the "Upload" icon in the Default Value column on the right.
You can always update this image via Triggers. Use "Data Manipulation" "Store" to add a new image URL or upload an image to this variable.
Styling/Adding Triggers to Images
You can edit the following properties of images after they are uploaded to Tulip in the Context Pane on the right side of the screen:
- Drop Shadow
- Border Radius
You can also add a trigger to an image or show a fullscreen version of it when clicked. Use the "Click Actions" menu in the Context Pane after selecting the image:
Technical Details of Image Support
We support the following image formats:
GIFs and SVGs can have a maximum size of 5 MB.
JPEG and PNG will be automatically resized to 1920 x 1200 at maximum.
Did you find what you were looking for?
You can also head to community.tulip.co to post your question or see if others have faced a similar question!