Dropbox

Overview

This Plug-in is a sample kintone integration with "Dropbox", a file hosting service operated by Dropbox, Inc.

https://www.dropbox.com/

Integration Screenshots

Record details page

Click the + button on the Record list page, enter your data, and click Save to save your contents (you will not yet be able to add files from your Dropbox account when on the Edit page).
After saving, you will be directed to the Record details page.
You will be able to add files from your Dropbox account on this page.

dp_1.png

 

dp_2.png

 

Record details page (choosing files)

dp_3.png

 

dp_4.png

Setting up the Dropbox Plug-in

Step 1: Set up your form

2 fields are needed to configure the Dropbox Plug-in.

  • A "Text" field or "Text Area" field
    The shared link for Dropbox files will be set into this field, and the field itself will be hidden from users. Dropbox files will be displayed on this field on the record list page (as the Blank space field cannot be displayed on the record list page).
  • A Blank space field
    This space will be used to display the Dropbox files on the record details page.
    An Element ID will need to be set through the field's settings for this field.

Once these fields are set, you can go ahead to place other fields of your choice onto the canvas. They will not affect the behavior of the Plug-in.

 

dp_5.png

Step 2: Add the Plug-in to your app

Install the Dropbox Plug-in into your kintone environment, and add it to your app.

  1. Download the Dropbox Plug-in file introduced later on this page
  2. Install the Plug-in file into your kintone environment. Check the kintone help page on how to install plugins to your kintone environment.
  3. Add the Dropbox Plug-in to your app. Check the kintone help page on how to add Plug-ins to your app.

Step 3: Configure the app Plug-in settings

Set up the configurations for the Plug-in added to your app in STEP 2.

  1. On the apps settings page, click on "App Settings" -> "Plug-ins", and click on the cog wheel for the Dropbox for kintone Plug-in.
  2. Set up each item in the settings:
    • Dropbox Shared Link Field
      The shared link for the Dropbox files will be set and saved in this field.
      The saved Dropbox files will be displayed in this field on the record list page.
    • Dropbox Files Display Field
      The saved Dropbox files will be displayed in this Space in the record details page.
      The user will be able to click the displayed files to download them.
    • Thumbnail
      Check this to display image files on the records as thumbnails.
  3. Click save.

    dp_6.png

  4. Click on "Settings" on the breadcrumbs, and on "Apply Changes" to apply the Plug-in settings.

STEP 4: Test out the Dropbox Plug-in

  1. Add a new record.
  2. Click on the "Edit" button that appears on the record details page.
  3. Click on the "Choose from Dropbox" button. If you are not yet logged into Dropbox, you will be prompted to fill in your Dropbox credentials.
  4. Choose a file from your Dropbox account and click "Choose".
  5. Click on "Save". The shared link to the chosen file(s) will be displayed on the list.

*Deleting files from this record, or deleting the record itself will not result in the original file being deleted from your Dropbox account.

Plug-in Sample

Packaged Sample

dropbox_v1.1.zip

 

Updates

Date Update Notes
12th September 2017 ver. 1.1
  • Fixed a bug where the "x" would not display next to the file name, when a file on Dropbox was selected.
  • Other minor updates were made
23rd July 2015 ver. 1.0  

Limitations

  • This Plug-in sample will not run on Internet Explorer 8.
  • This Plug-in sample will not run on the smartphone.
  • The Dropbox Shared Link Field will not be displayed while adding or editing records.

Notes

  • We do not guarantee this sample to run.
  • We do not provide any technical support for this sample Plug-in.
  • Some of the code in this Plug-in alters the DOM structure of the app. These altered DOM structures may be affected by future kintone updates. Be sure to note this if you are to use this Plug-in sample as reference.
Was this article helpful?
0 out of 0 found this helpful
Do you have any questions or issues related to this article?
Please share your views with us in the Community forums!