Embedding a Share Link Within a Web Page
Share links can be embedded within web pages, allowing you to present a white-label, interactive share link within your own web sites. There are two segments of HTML code that need to be placed into your web page's HTML.
The first segment should be placed at the beginning of the <BODY> element of your web page:
<div id="filescom-root"></div>
<script async defer src="https://jssdk.files.com/sdk/sdk.js"></script>
The second segment is placed anywhere within the <BODY> element of your web page, including within sub-elements such as <P> paragraphs and <TABLE> tables:
<div class="filescom-sharelink" data-key="URL_KEY" data-site="SUBDOMAIN.files.com"></div>
Replace URL_KEY with the corresponding URL key of the Share Link and replace SUBDOMAIN with your site's subdomain.
You can also embed multiple Share Links in a single HTML page, using multiple instances of the second code segment. For example:
<BODY>
<H2>First Share Link</H2>
<P><div class="filescom-sharelink" data-key="FIRST_URL_KEY" data-site="SUBDOMAIN.files.com"></div></P>
<H2>Second Share Link</H2>
<P><div class="filescom-sharelink" data-key="SECOND_URL_KEY" data-site="SUBDOMAIN.files.com"></div></P>
</BODY>
When embedding multiple share links, do not include multiples copies of the first code segment.
You can access the code snippets, options for embedding, and an interactive preview of a Share Link through the Web UI. Navigate to the list of Share Links, select your link, and then navigate to the Embedding sub-tab.
On this tab, you can change several of the display settings, which will immediately update both the preview of your Share Link and the code snippets you can copy for your own site.
Un-checking the Show title checkbox will update the preview of your Share Link to hide the title.
You can change the main color used for certain buttons on the Share Link page by typing in a hex code value or clicking on the color swatch to select a new color.
The Height setting defines a minimum height, in pixels, for the embedded Share Link div element. If you do not specify a height, the contents will take up 100% of the height of the div element's container.
The Width setting defines a minimum width, in pixels, for the embedded Share Link div element. If you do not specify a width, the contents will take up 100% of the width of the div element's container.
Get Instant Access to Files.com
The button below will take you to our Free Trial signup page. Click on the white "Start My Free Trial" button, then fill out the short form on the next page. Your account will be activated instantly. You can dive in and start yourself or let us help. The choice is yours.
Start My Free Trial