How to embed a mind map into your website as a widget?

You can embed maps on your website.

Example

Try here to move the platform or minimize branches:

Manual

The code builder is currently under development. However, you can make the code manually.

To do this:

1. Create a mind map and share it

You can create a mind map at this link: https://ivvi.dev/new

2. Copy the link into notepad and add the required parameters to it

For example:

https://ioctopus.online/____Widget__read-only____ae06464c14af8a4449d1bac198678ba1?panelMain=0&menubar=0&freezePanels=1&scrollable=0

Please note

• A link is followed by ? then the parameters
• Parameters are separated by a sign &

Available options

• menubar=0 - remove menubar
• panelMain=0 - remove main bar
• panelThemes=0 - remove theme bar
• panelIcons=0 - remove icon bar
• panelIcons=open - force the icon bar to open (for shared as editable)
• panelColors=0 - remove color bar
• panelColors=open - force the color bar to open (for shared as editable)
• freezePanels=1 - prohibit opening/closing bars
• roundedPanels=1 - rounded corners on bars
• scrollable=0 - turn off map scrolling
• isolate=1 - users will each edit a different version of your file, otherwise users will edit the same file
• platformMask=IMAGE_URL - a mask that can be used to trim the map. Example of a picture mask, Example of a cropped mind map.

 

3. Insert the link in a <iframe> tag and place it on your website

Tag template:

<iframe
	width="100%"
	height="500"
	border="0"
	scrolling="no"
	style="border: none;"
	src="THE_LINK"
></iframe>

Where THE_LINK - is a link you made in notepad.

For example:

<iframe
	width="100%"
	height="500"
	border="0"
	scrolling="no"
	style="border: none;"
	src="https://ioctopus.online/____How_to_make_a_mind_map__editable____b5f8cb61b9742e7723e635a7e4d23e57?menubar=0&panelMain=0&panelThemes=0&panelIcons=0&panelColors=open&freezePanels=1&isolate=1&scrollable=0&roundedPanels=1&platformMask=https://ioctopus.online/wp-content/themes/app/blog/how-to-make-a-mind-map/mask4.svg"
></iframe>