Now that we have a fully working app, let’s make it a bit more smooth and glue the interface together. We already prepared a Dashboard layout, and a few working widgets. But we currently don’t have any shortcuts on the Desktop to the widgets, nor in the menu. So let’s add these.
As you can see, the first shortcut (a link to the dashboard) has been already added by AppFlower. To add the editAccount desktop shortcut, right click to Shortcuts -> Add link on the right. A new entry appears in editor. Now we should fill in its properties:
Set name to item1, title to Edit Account, url to /accounts/editAccount and iconCls to icon-plus, then hit the Save button to save your changes.
You may add the remaining links in a similar manner using the following URL values:
Contacts (item2) -> /contacts/editContact Opportunities (item3) -> /opportunity/editDeal Activities (item4) -> /activity/editActivity
That’s it. If you save again, and launch the application using the Run button, you should see something like the screenshot above.
All the shortcuts will be rendered with simple icons. You can add new icons in Editors -> CSS Editor, by editing main.css file and adding some new CSS classes.
The editor is very similar to the previous one. Just like in that case, Dashboard has been added automatically. To add the next listAccounts menu item, right click to Menu -> Add -> item, then fill the properties as follows:
Set name to item1, label to List Accounts, url to /accounts/listAccounts and icon to /images/famfamfam/accept.png, then hit the Save button to save your changes.
Now you should add the rest of the list widgets. The URLs and item names can be found below:
Contacts (item2) -> /contacts/listContacts Opportunities (item3) -> /opportunity/listDeals Activities (item4) -> /activity/listActivities
Again, all these shortcuts will displayed using a default icon. You can change that by specifying another file. You can find hundreds of neat icons to choose from in /your_web_root/crm/web/images/famfamfam