--- title: "Insert an image in a Flow step" slug: "inserting-an-image-in-a-flow-step" updated: 2026-08-06T15:17:49Z published: 2026-08-06T15:17:49Z canonical: "support.whatfix.com/inserting-an-image-in-a-flow-step" --- > ## Documentation Index > Fetch the complete documentation index at: https://support.whatfix.com/llms.txt > Use this file to discover all available pages before exploring further. # Insert an image in a Flow step Use the following steps to include any image in a Flow step: 1. Open the desktop application where you would like to create the Flow and then launch the Whatfix Desktop Studio. ![desktop_studio.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/desktop_studio.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A43%3A40Z&se=2026-11-12T09%3A43%3A40Z&sr=c&sp=r&sig=M5O92niU5%2BO%2FrbY9JJYqXbotMOUbdGfeymCoe%2B4tNkc%3D) 2. Click **Flow**. ![Studio_Click_Flow](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Click_Flow%281%29.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A43%3A40Z&se=2026-11-12T09%3A43%3A40Z&sr=c&sp=r&sig=M5O92niU5%2BO%2FrbY9JJYqXbotMOUbdGfeymCoe%2B4tNkc%3D) 3. Enter the name of the Flow as you want it displayed to the users. ![Studio_Enter_Flow_Name](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Enter_Flow_Name.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A43%3A40Z&se=2026-11-12T09%3A43%3A40Z&sr=c&sp=r&sig=M5O92niU5%2BO%2FrbY9JJYqXbotMOUbdGfeymCoe%2B4tNkc%3D) 4. Click **+ Add Step**. ![Studio_Click_Add_Step](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Click_Add_Step.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A43%3A40Z&se=2026-11-12T09%3A43%3A40Z&sr=c&sp=r&sig=M5O92niU5%2BO%2FrbY9JJYqXbotMOUbdGfeymCoe%2B4tNkc%3D) 5. Under **Choose step type**, select the Flow step type. ![Switch over to the Flow step types from the dialog box that appears ](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Studio_Flow_Step%20Types_Switch.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A43%3A40Z&se=2026-11-12T09%3A43%3A40Z&sr=c&sp=r&sig=M5O92niU5%2BO%2FrbY9JJYqXbotMOUbdGfeymCoe%2B4tNkc%3D) Note: - With the Flow enhancement feature, you have the option to select two types of Flow steps, and not just element latching Flows. A dialog box appears on the application to highlight the two types of Flows. Under **Choose step type**, select a Flow step based on your requirements: either **Attached to element** or **Free-floating**. ![Studio switcher enables you to switch between 2 flow types: element-attached flow types and free-floating flow types](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Studio_Switcher_Flow_Types.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A43%3A40Z&se=2026-11-12T09%3A43%3A40Z&sr=c&sp=r&sig=M5O92niU5%2BO%2FrbY9JJYqXbotMOUbdGfeymCoe%2B4tNkc%3D) | Attached to element | Free-floating | | --- | --- | | When you select this type of Flow step, it remains attached to an element on your application. | When you select this type of Flow step, it remains flexibly positioned devoid of any element attachment. | - You also have the option to select a default template by clicking **Set as Default** for all the subsequent steps in a Flow. If you change the default step at an enterprise (ENT) level, it appears the same for all the users using that ENT. - For more information, see [Free-floating steps in Flows](/desktop/docs/clone-free-floating-steps-in-flows) and [Create a Flow with Free-floating steps](/desktop/docs/create-free-floating-flows). - Free-floating Flows is currently Beta. Contact [support@whatfix.com](mailto:support@whatfix.com?subject=Enable%20Flows%20with%20Free-floating%20steps%20&body=Hi%0A%0ACould%20you%20please%20enable%20the%20Flows%20with%20Free-floating%20steps%20on%20my%20ENT.%0A%0AThanks) for more information. 1. Click the desired element on the page that the user needs to select. 2. Review or edit the auto generated action text on the step. ![Enter_description.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Enter_description.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A43%3A40Z&se=2026-11-12T09%3A43%3A40Z&sr=c&sp=r&sig=M5O92niU5%2BO%2FrbY9JJYqXbotMOUbdGfeymCoe%2B4tNkc%3D) 3. Click the **Description** section of the tooltip and select the **Insert Image** icon from the Rich text editor. ![Insert_image.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Insert_image%281%29.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A43%3A40Z&se=2026-11-12T09%3A43%3A40Z&sr=c&sp=r&sig=M5O92niU5%2BO%2FrbY9JJYqXbotMOUbdGfeymCoe%2B4tNkc%3D) 4. Click the **Browse** icon and browse the Image from your Image Library. ![insert_image(1)](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/insert_image%281%29.gif?sv=2026-02-06&spr=https&st=2026-11-12T08%3A43%3A40Z&se=2026-11-12T09%3A43%3A40Z&sr=c&sp=r&sig=M5O92niU5%2BO%2FrbY9JJYqXbotMOUbdGfeymCoe%2B4tNkc%3D) Note: - When you want to insert an image in a Flow step using the browse option, you must first upload the image to your Dashboard. For more information on uploading Images to your Dashboard, see [Upload Images to your Dashboard](/desktop/docs/upload-images-to-your-dashboard). Info: Images can be added to your content by inserting their link either from your Dashboard or from an online image platform as an URL. **Insert Image link from your Dashboard** If you have uploaded images to your Dashboard, and you want to insert them in your Whatfix content, copy and paste the image link in the URL field. ![insert image(1)](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/insert%20image%281%29.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A43%3A40Z&se=2026-11-12T09%3A43%3A40Z&sr=c&sp=r&sig=M5O92niU5%2BO%2FrbY9JJYqXbotMOUbdGfeymCoe%2B4tNkc%3D) - To find the link of the image you uploaded to your Dashboard, see [Upload Images to your Dashboard](/desktop/docs/upload-images-to-your-dashboard). --- **Insert Image link from an online image platform** If you have image links hosted on various platforms, and you want to embed these in your Whatfix content, copy and paste the URL of the image in the URL field. ![image link editor](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/image%20link%20editor.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A43%3A40Z&se=2026-11-12T09%3A43%3A40Z&sr=c&sp=r&sig=M5O92niU5%2BO%2FrbY9JJYqXbotMOUbdGfeymCoe%2B4tNkc%3D) - When you want to insert an image in a Flow step using the URL from an online image platform, you must host the image first in an online image-sharing website like Imgur, ImgBB, and more. - The URL format must end with the image format, such as png, jpg, or jpeg. * **Correct**: https://imgur.com/jpJkjqs.png * **Incorrect**: https://imgur.com/jpJkjqs 1. Click the inserted image to see the following customization options. ![Editor_audio_options](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Editor_audio_options.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A43%3A40Z&se=2026-11-12T09%3A43%3A40Z&sr=c&sp=r&sig=M5O92niU5%2BO%2FrbY9JJYqXbotMOUbdGfeymCoe%2B4tNkc%3D) - **Change size:** Enables you to change the dimension of the image in terms of pixels. - **Align:** Enables you to align the image to the left, right, or center. - **Insert link:** Enables you to add link URLs to the image. - **Alternative text:** Enables you to add alternative text to the image. - **Replace:** In case you added the wrong image, you can replace it using this option. - **Remove:** Enables you to remove the image. 2. Click **Save Flow**. ![Save_Flow_Studio.png](https://cdn.document360.io/a268766e-d74d-4619-9613-e2472f809ffb/Images/Documentation/Save_Flow_Studio.png?sv=2026-02-06&spr=https&st=2026-11-12T08%3A43%3A40Z&se=2026-11-12T09%3A43%3A40Z&sr=c&sp=r&sig=M5O92niU5%2BO%2FrbY9JJYqXbotMOUbdGfeymCoe%2B4tNkc%3D)