{"componentChunkName":"component---smooth-doc-smooth-doc-src-templates-doc-js","path":"/docs/share-links/embedding-an-image/","result":{"data":{"mdx":{"fields":{"pageType":"doc","title":"Embedding an Image","editLink":""},"body":"var _excluded = [\"components\"];\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nfunction _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }\nfunction _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }\n/* @jsxRuntime classic */\n/* @jsx mdx */\n\nvar _frontmatter = {\n  \"title\": \"Embedding an Image\",\n  \"description\": \"embedding an image\",\n  \"section\": \"Share Links\",\n  \"order\": 25\n};\nvar layoutProps = {\n  _frontmatter: _frontmatter\n};\nvar MDXLayout = \"wrapper\";\nreturn function MDXContent(_ref) {\n  var components = _ref.components,\n    props = _objectWithoutProperties(_ref, _excluded);\n  return mdx(MDXLayout, _extends({}, layoutProps, props, {\n    components: components,\n    mdxType: \"MDXLayout\"\n  }), mdx(\"h1\", {\n    \"id\": \"embedding-an-image\"\n  }, mdx(\"a\", {\n    parentName: \"h1\",\n    \"href\": \"#embedding-an-image\",\n    \"aria-label\": \"embedding an image permalink\",\n    \"className\": \"anchor\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Embedding an Image\"), mdx(\"br\", null), mdx(\"p\", null, \"The embed feature of share links may be used to create interactive experiences with images on your own web pages or to simply show notable images and annotations. To embed an image into a webpage, copy the \", mdx(\"abbr\", {\n    parentName: \"p\",\n    \"title\": \"HyperText Markup Language\"\n  }, \"HTML\"), \" snippet provided in the share link properties dialog into your own website. Image embedding uses the \", mdx(\"abbr\", {\n    parentName: \"p\",\n    \"title\": \"HyperText Markup Language\"\n  }, \"HTML\"), \" <iframe\", \">\", \" tag and behaves like embedded maps that are commonly used on many websites.\"), mdx(\"p\", null, \"Embedded images are powered by share links and have the same restrictions and behave in a similar fashion. The embed code retrieved from the Viewer provides additional flexibility \", \"\\u2014\", \" primarily the ability to control the recipient's initial view. However, the initial view for embedded images may be affected by the size of the <iframe\", \">\", \" window that renders the image.\"), mdx(\"div\", {\n    className: \"info\"\n  }, \"Embedded images may not work in browsers that restrict third-party cookies.\"), mdx(\"br\", null), mdx(\"div\", {\n    className: \"info\"\n  }, \"Images embedded in local HTML files do not work in Apple Safari. This limitation does not apply to webpages served over a network.\"), mdx(\"details\", null, mdx(\"summary\", null, \" To retrieve the embed code for an image from the Repository \"), mdx(\"ol\", null, mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Navigate to any folder in the Repository (click on the \", mdx(\"img\", {\n    parentName: \"p\",\n    \"src\": \"/flow/manual/latest/fed1477a03484982152f045fee98b862/nav-folder.svg\",\n    \"alt\": \"Folder\"\n  }), \" \", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"Repository\"), \" button from the \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/flow/manual/latest/docs/repository/repository-overview/#navigation-menu\"\n  }, \"Navigation Menu\"), \" then navigate to a folder)\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Bring up the \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/flow/manual/latest/docs/repository/repository-operations/#context-menu\"\n  }, \"context menu\"), \" for the image\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Click \", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"Share\"))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"In the popup dialog, click on the name of the share link or click on the \", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"New Share Link\"), \" button to create a new one\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Click on the \", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"Embed Image\"), \" tab\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"(Optional) Configure the embedded image settings\"), mdx(\"ol\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"(Optional) Set the \", mdx(\"strong\", {\n    parentName: \"li\"\n  }, \"Width\"), \" (may include units such as % and px)\"), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"(Optional) Set the \", mdx(\"strong\", {\n    parentName: \"li\"\n  }, \"Height\"), \" (may include units such as % and px)\"))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Click on the \", mdx(\"img\", {\n    parentName: \"p\",\n    \"src\": \"/flow/manual/latest/251d1bb819c35da01264f72a9985335a/dialog-clipboard.svg\",\n    \"alt\": \"Copy to Clipboard\"\n  }), \" button to the right of the \", mdx(\"abbr\", {\n    parentName: \"p\",\n    \"title\": \"HyperText Markup Language\"\n  }, \"HTML\"), \" snippet to copy it to the clipboard\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Paste the \", mdx(\"abbr\", {\n    parentName: \"p\",\n    \"title\": \"HyperText Markup Language\"\n  }, \"HTML\"), \" snippet into your webpage\")))), mdx(\"details\", null, mdx(\"summary\", null, \" To retrieve the embed code for an image from within the Viewer \"), mdx(\"ol\", null, mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"If the left sidebar is not displayed, toggle it by clicking on the \", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"Menu \", \">\"), \" button at the bottom left of the Viewer\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Hover or click on the \", mdx(\"img\", {\n    parentName: \"p\",\n    \"src\": \"/flow/manual/latest/d3d9c41e964cecbff0933a041274620e/viewer-nav-share.svg\",\n    \"alt\": \"Share\"\n  }), \" button in the left sidebar\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Click on the name of the share link or click on the \", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"New Share Link\"), \" button to create a new one\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Click on the \", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"Embed Image\"), \" tab\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"(Optional) Configure the embedded image settings\"), mdx(\"ol\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"(Optional) Set the \", mdx(\"strong\", {\n    parentName: \"li\"\n  }, \"Width\"), \" (may include units such as % and px)\"), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"(Optional) Set the \", mdx(\"strong\", {\n    parentName: \"li\"\n  }, \"Height\"), \" (may include units such as % and px)\"), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"(Optional) Enable the \", mdx(\"strong\", {\n    parentName: \"li\"\n  }, \"Start at current location\"), \" toggle to use the current view as the initial view for the embedded image\"))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Click on the \", mdx(\"img\", {\n    parentName: \"p\",\n    \"src\": \"/flow/manual/latest/251d1bb819c35da01264f72a9985335a/dialog-clipboard.svg\",\n    \"alt\": \"Copy to Clipboard\"\n  }), \" button to the right of the \", mdx(\"abbr\", {\n    parentName: \"p\",\n    \"title\": \"HyperText Markup Language\"\n  }, \"HTML\"), \" snippet to copy it to the clipboard\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Paste the \", mdx(\"abbr\", {\n    parentName: \"p\",\n    \"title\": \"HyperText Markup Language\"\n  }, \"HTML\"), \" snippet into your webpage\")))));\n}\n;\nMDXContent.isMDXComponent = true;","tableOfContents":{"items":[{"url":"#embedding-an-image","title":"Embedding an Image"}]}}},"pageContext":{"id":"1143c4df-ca36-5973-8a59-3aaddb49db7d"}},"staticQueryHashes":["1086510573","1106176283","1122327541","2140385554","2719290676","3597609067","4027383558"]}