AgileApps Support Wiki Pre Release

Difference between revisions of "Web Tabs"

From AgileApps Support Wiki
imported>Aeric
imported>Aeric
Β 
(29 intermediate revisions by the same user not shown)
Line 1: Line 1:
'''Designer > Presentation > Web Tabs'''
'''[[File:GearIcon.png]] > Customization > Developer Resources > Web Tabs'''


Web tabs enable you to extend the platform by adding custom pages to your application that display web pages from another server. For example, you can display a page from your company's intranet site, or another company's website, as a web tab in your application. Β 
Web tabs let you add custom web pages that display as tabs in your application.


Web tabs can be based on any of these elements:
==About Web Tabs==
*URL - Create a web tab based on a web page URL; The full web page appears in the web tab
Web tabs can display web pages from another server. For example, you can display a page from your company's intranet site, or another company's website, as a web tab in your application. Or a Web Tab can display a custom [[Page]] created on the platform.
*Page - Create custom, personalized [[Pages]]
*Widget - Create pages (tabs) that contain collections of [[Widgets]]
*Database View - Create pages (tabs) that contain [[Database View]]s


:''Compare to [[Data Tab]]''
==Working with Web Tabs==
{{permissionRef|Customize Objects|create Web Tabs}}


==Manage Web Tabs==
===Create a Web Tab===
{{permissions|Customize Objects|create Web Tabs}}
#Click '''[[File:GearIcon.png]] > Customization > Developer Resources > Web Tabs'''
Β 
#Click the '''[New Web Tab]''' button and complete the following information:
==Create a Web Tab==
#*Enter the Name
#Click '''Designer > Data > Web Tabs'''
#Click the [New Web Tab] button and complete the following information:
#*Enter the Display Title
#*Select the Web Tab Type
#*Select the Web Tab Type
#:;URL:Enter the URL of a website you want to appear in the web tab; www.google.com for example
#:;URL:Enter the URL of a website you want to appear in the web tab.<br>For, example display your RSS feeds using http://google.com/reader
#::'''Note:'''
#::These days, many browsers (and virtually all mobile apps) block that kind of page switching, so the preferred way to create a web tab to display a URL is to create a JSP page with an iFrame in it, display the content of the URL in the iFrame, and use the ''Page'' option, below.
#:;Page:Choose from existing [[Pages]] or build your own
#:;Page:Choose from existing [[Pages]] or build your own
#:;Widget:Set up the [[Widget]] layout and access permissions
#:::Choose the preferred layout, with one, two or three columns
#::*Choose the preferred layout, with one, two or three columns
#::*Choose [[Role Based Access Permissions]]
#:;Database View:Choose the [[Database View]] to use as the basis of this web tab
#Choose the appropriate [[Role Based Access Permissions]]
#Click '''[Save]'''
#Click '''[Save]'''


===Try it Out===
===Edit a Web Tab===
Add a web tab:
#Click '''[[File:GearIcon.png]] > Customization > Developer Resources > Web Tabs'''
:[[Image:Webtab.gif|none|thumb]]
Β 
The result is a tab that displays the specified newsfeed:
:[[Image:Webtab1.gif|none|thumb]]
Β 
==Edit a Web Tab==
#Click '''Designer > Data > Web Tabs'''
#Click the link for the Web Tab you want to edit
#Click the link for the Web Tab you want to edit
#Click the [Edit] button to open the Web Tab for editing
#Click the '''[Edit]''' button to open the Web Tab for editing
#Update Web Tab Information as required:
#Update Web Tab Information as required:
#*Use the List of Available Template Fields to lookup variable names to use in the Web Tab
#* Use the [[Template Variable Tool]] to get the names of variables you can use in the page:
#*Change the Title
#*:[[File:TemplateVariableTool.jpg]]
#*Change the Name
#*Select the Tab Type
#*Select the Tab Type
#*Choose the Web Tab Height
#*Choose the Web Tab Height
#*Edit the Web URL as needed
#*Edit the Web URL as needed
#*Change the [[Role Based Access Permissions]] as needed
#Click '''[Save]'''
#Click '''[Save]'''
:[[Image:Webtab-edit.gif|none|thumb]]


==Delete a Web Tab==
===Delete a Web Tab===
{{:Delete a Web Tab}}
{{:Delete a Web Tab}}
==Displaying a Web Tab==
:* When you create a web tab, it is available for display in the current application.
:* To make it appear in your current display:
::* Go to '''{login name} > My Settings > Workspace Preference'''
::* Move the tab to the list of ''visible elements''<br>(the objects and platform elements that are displayed as tabs)
::* Refresh your browser window
:* To make it available for display in other applications:
::* Go to '''[[File:GearIcon.png]] > Customization > Resource Sharing'''
::* Click '''[Edit]'''
::* Set '''Resource Type''' to Web Tab
::* Move the new web tab to the list of visible elements
<noinclude>
<noinclude>


[[Category:Presentation | 3]]
[[Category:Presentation | 3]]
[[Category:Applications| 3]]
[[Category:Core Concepts]]
[[Category:Core Concepts]]
</noinclude>
</noinclude>

Latest revision as of 22:13, 14 July 2015

GearIcon.png > Customization > Developer Resources > Web Tabs

Web tabs let you add custom web pages that display as tabs in your application.

About Web Tabs

Web tabs can display web pages from another server. For example, you can display a page from your company's intranet site, or another company's website, as a web tab in your application. Or a Web Tab can display a custom Page created on the platform.

Working with Web Tabs

Lock-tiny.gif

Users that have the Customize Objects permission can create Web Tabs. 

Create a Web Tab

  1. Click GearIcon.png > Customization > Developer Resources > Web Tabs
  2. Click the [New Web Tab] button and complete the following information:
    • Enter the Name
    • Select the Web Tab Type
    URL
    Enter the URL of a website you want to appear in the web tab.
    For, example display your RSS feeds using http://google.com/reader
    Note:
    These days, many browsers (and virtually all mobile apps) block that kind of page switching, so the preferred way to create a web tab to display a URL is to create a JSP page with an iFrame in it, display the content of the URL in the iFrame, and use the Page option, below.
    Page
    Choose from existing Pages or build your own
    Choose the preferred layout, with one, two or three columns
  3. Click [Save]

Edit a Web Tab

  1. Click GearIcon.png > Customization > Developer Resources > Web Tabs
  2. Click the link for the Web Tab you want to edit
  3. Click the [Edit] button to open the Web Tab for editing
  4. Update Web Tab Information as required:
    • Use the Template Variable Tool to get the names of variables you can use in the page:
      TemplateVariableTool.jpg
    • Change the Name
    • Select the Tab Type
    • Choose the Web Tab Height
    • Edit the Web URL as needed
  5. Click [Save]

Delete a Web Tab

To delete a web tab:

  1. Click GearIcon.png > Customization > Developer Resources > Web Tabs
  2. Click the Web Tab you want to delete
  3. Click the [Delete] button. A confirmation message opens.
  4. Click [OK] to delete the web tab
Learn more: Recycle Bin

Displaying a Web Tab

  • When you create a web tab, it is available for display in the current application.
  • To make it appear in your current display:
  • Go to {login name} > My Settings > Workspace Preference
  • Move the tab to the list of visible elements
    (the objects and platform elements that are displayed as tabs)
  • Refresh your browser window
  • To make it available for display in other applications:
  • Go to GearIcon.png > Customization > Resource Sharing
  • Click [Edit]
  • Set Resource Type to Web Tab
  • Move the new web tab to the list of visible elements