Install Timba Box in your Org

1. Login to Salesforce as a System Administrator and access the following links to install the package in your org: 

- Production: 

https://login.salesforce.com/packaging/installPackage.apexp?p0=04t360000015wFH

- Sandbox: 

https://test.salesforce.com/packaging/installPackage.apexp?p0=04t360000015wFH

 

The package will install a static resource and create the following visualforce page named 'TimbaBoxForAccounts'.

 

<apex:page standardStylesheets="false" standardController="Account" sidebar="false" showheader="false">
    <link rel="stylesheet" type="text/css" href="{!URLFOR($Resource.TimbaBoxSR,'timbaboxes/css/timbaBoxes.css')}" />
    <!-- TimbaBox_Container-->
   <body>
       
   <div id="timbaBox_Container"> 
   </div>
    <script>
      var currentObjId = "{!Account.id}";
      var FirstName = "{!$User.FirstName}";
      var LastName = "{!$User.LastName}";
      var CompanyName = "{!$User.CompanyName}";
      var sessionId = "{!$Api.Session_ID}";
      var URL = "{!$CurrentPage.URL}";
      var pic1 = "{!URLFOR($Resource.TimbaBoxSR,'timbaboxes/images/drag_upload.png')}";
      var pic2 = "{!URLFOR($Resource.TimbaBoxSR,'timbaboxes/images/timbabox.png')}";
      var pic3 = "{!URLFOR($Resource.TimbaBoxSR,'timbaboxes/images/uploading.gif')}";
   </script>
   
   
    <script language="javascript" src="{!URLFOR($Resource.TimbaBoxSR,'timbaboxes/js/jquery-1.4.2.js')}"></script>
    <script language="javascript" src="{!URLFOR($Resource.TimbaBoxSR,'timbaboxes/js/google-gear.js')}"></script>
    <script language="javascript" src="{!URLFOR($Resource.TimbaBoxSR,'timbaboxes/js/gears_init.js')}"></script>
    <script language="javascript" src="/soap/ajax/18.0/connection.js"></script>
    <script language="javascript" src="{!URLFOR($Resource.TimbaBoxSR,'timbaboxes/js/timbaBoxes.js')}"></script>
   </body>

</apex:page>
 

7. Go to the Accounts Tab and click on any Account record

8. On the record detail page click on the “Edit Layout” link at the top of the page

9. Click on Visualforce Pages and then drag and drop the TimbaBoxForAccounts page into the layout.

10. Click on the “Save” button

 

How to use Timba Box with other Salesforce objects

If you want to use Timba Box with other Salesforce Objects what you need to do is create a new visualfoce page and apply a few changes to it. Below we show how to create the new page for the object contacts. 

1. Go to Setup > Develop > Pages

2. Click on “New”

3. On the Label and Name fields type “TimbaBoxForContacts”

4. Copy and Paste the following code into the Visualforce Markup area:

 

<apex:page standardStylesheets="false" standardController="Contact" sidebar="false" showheader="false">
    <link rel="stylesheet" type="text/css" href="{!URLFOR($Resource.AltimetrikBox__TimbaBoxSR,'timbaboxes/css/timbaBoxes.css')}" />
    <!-- TimbaBox_Container-->
   <body>
       
   <div id="timbaBox_Container"> 
   </div>
    <script>
      var currentObjId = "{!Contact.id}";
      var FirstName = "{!$User.FirstName}";
      var LastName = "{!$User.LastName}";
      var CompanyName = "{!$User.CompanyName}";
      var sessionId = "{!$Api.Session_ID}";
      var URL = "{!$CurrentPage.URL}";
      var pic1 = "{!URLFOR($Resource.AltimetrikBox__TimbaBoxSR,'timbaboxes/images/drag_upload.png')}";
      var pic2 = "{!URLFOR($Resource.AltimetrikBox__TimbaBoxSR,'timbaboxes/images/timbabox.png')}";
      var pic3 = "{!URLFOR($Resource.AltimetrikBox__TimbaBoxSR,'timbaboxes/images/uploading.gif')}";
   </script>
   
   
    <script language="javascript" src="{!URLFOR($Resource.AltimetrikBox__TimbaBoxSR,'timbaboxes/js/jquery-1.4.2.js')}"></script>
    <script language="javascript" src="{!URLFOR($Resource.AltimetrikBox__TimbaBoxSR,'timbaboxes/js/google-gear.js')}"></script>
    <script language="javascript" src="{!URLFOR($Resource.AltimetrikBox__TimbaBoxSR,'timbaboxes/js/gears_init.js')}"></script>
    <script language="javascript" src="/soap/ajax/18.0/connection.js"></script>
    <script language="javascript" src="{!URLFOR($Resource.AltimetrikBox__TimbaBoxSR,'timbaboxes/js/timbaBoxes.js')}"></script>
   </body>

</apex:page>

6. Click on “Save”

If you want to use it for another page follow the previous steps and name the page to match the object that you want to use, then after copying and pasting the code on step 4 and modifying the highlighted parts (AltimetrikBox__TimbaBoxSR) of the code to match the Object that you want to use click save and add the page to the object record.

Have more questions? Submit a request

3 Comments

Please sign in to leave a comment.
Powered by Zendesk