Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Kintone Customization Tutorial by Gusuku Customine en01

Kintone Customization Tutorial by Gusuku Customine en01

R3 institute

October 30, 2018
Tweet

More Decks by R3 institute

Other Decks in Technology

Transcript

  1. Kintone Customization Tutorial

    View full-size slide

  2. What is “Customine”
    A no-code customization platform for Kintone.
    It automatically generats JavaScript and send it to Kintone App by one click.

    View full-size slide

  3. Menu & Document Information
    Action Box
    “Do” field “Condition” field
    Add another Action Box

    View full-size slide

  4. Let’s try some quick customization.
    “Change the color of some certain fields”

    View full-size slide

  5. Kintone App:
    “Costumer database”
    Goal1:
    Color the fields whose status is
    “Not handled yet”
    Goal2:
    Apply the same customization to
    the field “Organization Name”.

    View full-size slide

  6. Step1: Set up your Kintone app
    Install “Sales CRM+Support Pack” from Kintone’s sample Apps

    View full-size slide

  7. Here are the Apps that we have installed from
    the package.
    We are going to customize these 2 Apps in this
    tutorial.
    “Customer database” & “Inquiry Management”

    View full-size slide

  8. Download the sample data(Excel file) here.
    http://bit.ly/customine-handson-en01
    Import the sample data to each apps.

    View full-size slide

  9. Go to the setting menu of the App “Customer Database”
    Set the field of “Contact Name”
    Make sure “Prohibit duplicate values” are checked

    View full-size slide

  10. Set the fields “Sales” to match the data of the related app“Inquiry Management”

    View full-size slide

  11. Step2: Set up your Customine
    Access customine.gusuku.io

    View full-size slide

  12. Sign up or sign up with your Customine account

    View full-size slide

  13. Fill and set up your Kintone domain information.
    Make sure your Kintone account is authorized.

    View full-size slide

  14. Register the Kintone Apps to Customine.

    View full-size slide

  15. Add a new Customization and choose your Kintone app to customize.
    (It will automatically create a new document when there’s no docs in the drive.)

    View full-size slide

  16. Tips for Customizaton
    Make sure your Kintone Apps are almost completed.
    Take care of the naming of ”field code" &”field name” in your Kintone App
    Because we are using “field code” to identify in Customine, make sure your field code is
    easy to understand (e.g. using the same/similar name with the field name)
    Trial and error.

    View full-size slide

  17. Okay, you’re all set and
    let’s go Customine!

    View full-size slide

  18. Menu & Document Information
    Action Box
    “Do” field “Condition” field
    One Action
    DO CONDITION(s)
    “when…” “If…”
    “Then…”

    View full-size slide

  19. Click the “DO” field to open the action list.
    Set up the “Action Box”

    View full-size slide

  20. Find the “Change the Field Background Color” command and set it

    View full-size slide

  21. Set the target field as "Status"

    View full-size slide

  22. Set any color you like

    View full-size slide

  23. Go to the “CONDITION” field.
    Click the "Add" button to add one more Condition to the Action Box.

    View full-size slide

  24. Find “If Field Value is Specified" at the list and set it

    View full-size slide

  25. Set the target field as [Status], Criteria as [Equals] and compared
    value as [Not handled yet]

    View full-size slide

  26. You're all set!
    Let’s apply it to your Kintone App and check out how your customization work.
    Apply to the Kintone App

    View full-size slide

  27. Go to the Kintone App.
    The fields whose status is “Not handled yet” have been colored!

    View full-size slide

  28. Try coloring the fields of "Company Name" with the same color that you have done.

    View full-size slide

  29. 2nd Stage
    “Calculate and display the total related
    record counts at the record list”

    View full-size slide

  30. Goal : Count the amount of
    inquiries and display “Inquiry
    Count” at the record page

    View full-size slide

  31. Go to your Kintone App’s settings,
    add a Blank Space and set its Element ID as “InquiryCount”
    Set up your Kintone app

    View full-size slide

  32. If you are a free plan user and don’t have enough App Slot,
    check it out here and release your current App.
    Option: Release your App Slot

    View full-size slide

  33. Create a new customize from the menu and
    choose “Customer Database” as the target App
    Let’s go Customine!

    View full-size slide

  34. Set up the “Action Boxes”
    Set “Retrieve Records by Reference Table Condition” command at the “DO” field

    View full-size slide

  35. Create another Action Box of “Count Rows of Records” and set the
    Condition field as “When Another Action Complete” to make sure the 2nd
    action works right after the 1st action.

    View full-size slide

  36. Caution
    The Actions are NOT running with the order of Action number.
    They normally run parallelly.
    We have to specify the order of the action list with this command.

    View full-size slide

  37. Set the displayed text as “Result of another Action” referred to the result of Action 2.

    View full-size slide

  38. Check out your Customine again to make sure the order of the Actions
    2 runs after 1
    3 runs after 2

    View full-size slide

  39. The “Inquiry Count” with the number is displayed at the record page.
    Apply to the Kintone App

    View full-size slide

  40. Check out here for more samples at
    support.gusuku.io

    View full-size slide