85 Community-Gadgets: Analyzing Community Widget Tags

Each community widget has its own deployment screen which displays the widget's tag. This chapter provides information about the parameters defined in each widget tag.

This chapter contains the following sections:

85.1 Comments Widget Tags

The widget tags related to adding commenting functionality to your website are the following:

85.1.1 Comments Widget Tag

The Comments Deployment screen (which you can access from the menu bar by selecting Comments, Deploy, and then Comments) provides designers with the Comments widget tag. This section analyzes the parameters defined in the Comments widget tag:

Comments widget tag

  1. <div id="comments_container"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.comments",

  6. version: "1.5",

  7. elementID: "comments_container",

  8. attributes: {"site_id":"FirstSiteII"}});

  9. setTimeout(

  10. function(){if ((typeof(wsdk) == 'undefined') || (typeof(wsdk.comments) == 'undefined')) {document.getElementById('comments_container').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Comments is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.comments');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Comments widget tag

  • Line 1 defines the container that holds the Comments widget on the page. If you assign a resource ID to this instance of the Comments widget, the widget's resource ID is also specified in this line. For example:

    <div id= "comments_container[resource_id]"></div>
    

    Where [resource_id] is the resource ID assigned to this instance of the Comments widget.

    Note:

    If you do not specify a resource ID for this widget tag, the encrypted URL of the page on which this widget tag is deployed is assigned as the widget's resource ID.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Comments widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Comments widget inside the container defined in line 1.

  • Lines 9 through 11 check if the Comments widget is rendered on the page. If the Comments widget is not rendered after 30 seconds, users are informed that there is an error and should contact the site administrator.

  • Line 12 defines the list of scripts deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Comments widget tag (wsdk.comments) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page that starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag on the page, including a list of all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-1 Comments widget displayed on a web page

Description of Figure 85-1 follows
Description of "Figure 85-1 Comments widget displayed on a web page"

85.1.2 Comments Summary Widget Tag

The Comments Summary Deployment screen (which you can access from the menu bar by selecting Comments, Deploy, and then Comments Summary) provides designers with the Comments Summary widget tag. This section analyzes the parameters defined in the Comments Summary widget tag:

Comments Summary widget tag

  1. <div id="comments_summary_container[resource_id]"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "comments-summary",

  6. version: "0.1",

  7. elementID: "comments_summary_container[resource_id]",

  8. attributes: {"site_id":"FirstSiteII","resource_id":"[resource_id]","show_last_comment_date":"false"}});

  9. setTimeout(

  10. function(){if ((typeof(cos) == 'undefined')||(typeof(comments_summary) == 'undefined')) {document.getElementById('comments_summary_container').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Comments Summary is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('comments-summary');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Comments Summary widget tag

  • Line 1 defines the container that holds the Comments Summary widget on the page. When you specify the resource ID of a Comments widget tag in the Resource ID field, that resource ID is also specified in this line. For example:

    <div id= "comments_summary_container[resource_id]"></div>
    

    Where [resource_id] is the resource ID of the desired Comments widget.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Comments Summary widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Comments Summary widget inside the container defined in line 1.

  • Lines 9 through 11 check if the Comments Summary widget is rendered on the page. If the Comments Summary widget is not rendered after 30 seconds, users are informed that there is an error and they should contact the site administrator.

  • Line 12 defines the list of scripts deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Comments Summary widget tag (comments-summary) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag on the page, including a list of all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-2 Comments Summary widget displayed on a web page

Description of Figure 85-2 follows
Description of "Figure 85-2 Comments Summary widget displayed on a web page"

85.1.3 Links to Topics Widget Tag

The Links to Topics Deployment screen (which you can access from the menu bar by selecting Comments, Deploy, and then Links to Topics) provides designers with the Links to Topics widget tag. This section analyzes the parameters defined in the Links to Topics widget tag:

Links to Topics widget tag

  1. <a href="[resource_url]#comments_link&resource_id=[resource_id]" ></a>

  2. <div id="comments_link_div[random]"></div>

  3. <script type="text/javascript">

  4. cos = window.cos || {};

  5. cos.pageWidgets = cos.pageWidgets || [];

  6. cos.pageWidgets.push({name: "comments-link",

  7. version: "0.1",

  8. elementID: "comments_link_div[random]",

  9. attributes: {"site_id":"FirstSiteII"}});

  10. cos.pageScripts = cos.pageScripts || [];

  11. cos.pageScripts.push('comments-link');

  12. (function()

  13. {

  14. var oldOnloadHandler = window.onload || function()

  15. {

  16. };

  17. if (!oldOnloadHandler.alreadyProcessed)

  18. {

  19. window.onload = function()

  20. {

  21. var script = document.createElement('script');

  22. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  23. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  24. script.type = 'text/javascript';

  25. script.charset = 'utf-8';

  26. document.getElementsByTagName("head").item(0) .appendChild(script);

  27. oldOnloadHandler.apply(this, arguments);

  28. };

  29. window.onload.alreadyProcessed = true;

  30. }

  31. })();

  32. </script>

Analyzing the Links to Topics widget tag

  • Line 1 is a link to the web page on which the desired Comments widget tag is deployed, and is added to the tag automatically when you enter values into the Resource ID and Resource URL fields in the Links to Topics Deployment screen.

  • Line 2 defines the container that holds the Links to Topics widget on the page.

  • Line 3 opens the bootstrapping JavaScript code needed for the widget.

  • Line 4 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 5 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 6 through 9 define the Links to Topics widget tag and add the new element to the list of widget tags (defined in line 5). Line 8 contains a link that is used to render the Links to Topics widget inside the container defined in line 2.

  • Line 10 defines the list of scripts deployed on the page. If there are no scripts deployed, then the list's value is left empty.

  • Line 11 adds the Links to Topics widget tag (comments-link) to the list of page scripts (defined in line 10).

  • Line 14 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 17 checks if the onload function is already processed.

  • Line 19 overrides the code that runs when the page is loaded.

  • Lines 21 through 26 add the JavaScript tag on the page, including a list of all the scripts that need to be deployed.

  • Line 27 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 29 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 32 closes the bootstrapping JavaScript code needed for the widget.

85.1.3.1 Deploying the Links to Topics Widget Tag (for Comments)

To configure the Links to Topics widget to display summarized information about and links to multiple web pages on which Comments (and Reviews) widgets are deployed, you will have to insert the resource ID and resource URL of each Comments (and/or Reviews) widget deployed on the desired web pages into the Links to Topics widget tag.

Note:

You can specify Comments widgets and Reviews widgets in the same Links to Topics widget tag. For information about specifying a Reviews widget in the Links to Topics tag, see Section 85.2.3.1, "Deploying the Links to Topics Widget Tag (For Reviews)."

For example:

  1. In the menu bar, select Comments, Deploy, and then select Links to Topics.

  2. In the Links to Topics Deployment screen, copy (Ctrl+C) the Links to Topics widget tag.

  3. Access the WebCenter Sites Admin interface and insert the Links to Topics widget tag into the desired template. For instructions, see the Oracle Fusion Middleware WebCenter Sites User's Guide.

  4. In line 1 of the Links to Topics widget tag, specify the resource ID of each deployed Comments (and/or Reviews) widget that the Links to Topics widget should display summarized information about and link to. For example:

    Add the following line for each Comments widget you wish to specify in the Links to Topics widget tag:

    <a href="http://URL#comments_link&resource_id=CommentsID"></a>
    

    Where http://URL is the path to the web page on which the desired Comments widget is deployed.

  5. Click Save Changes.

  6. Preview the page and then publish the template to the website. For instructions, see the Oracle Fusion Middleware WebCenter Sites User's Guide and the Oracle Fusion Middleware WebCenter Sites Administrator's Guide.

Figure 85-3 Links to Topics widget displayed on a web page

Description of Figure 85-3 follows
Description of "Figure 85-3 Links to Topics widget displayed on a web page"

Note:

When the Links to Topics widget is deployed, it does not display a title. For the Links to Topics widget to display a title, you will have to insert the title into the template to which you copied the Links to Topics widget tag.

85.1.4 Recently Commented Widget Tag

The Recently Commented Deployment screen (which you can access from the menu bar by selecting Comments, Deploy, and then Recently Commented) provides designers with the Recently Commented widget tag. This section analyzes the parameters defined in the Recently Commented widget tag:

Recently Commented widget tag

  1. <div id="topics_container_recently_commented_other"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.topics",

  6. version: "1.5",

  7. elementID: "topics_container_recently_commented_other",

  8. attributes: {"content_type":"recently_commented","site_id":"FirstSiteII","resource_type":"other"}});

  9. setTimeout(

  10. function(){if ((typeof(wsdk) == 'undefined') || (typeof(wsdk.topics) == 'undefined')) {document.getElementById('topics_container_recently_commented_other').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Topics is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.topics');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Recently Commented widget tag

  • Line 1 defines the container that holds the Recently Commented widget on the page.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Recently Commented widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Recently Commented widget inside the container defined in line 1. Line 8 specifies the Recently Commented widget tag's settings, including the type of topics the Recently Commented widget will list. If you want the Recently Commented widget to include topics of all types in its list, remove the "resource_type":"other" parameter.

  • Lines 9 through 11 check if the Recently Commented widget is rendered on the page. If the Recently Commented widget is not rendered after 30 seconds, users are informed that there is an error and they should contact the site administrator.

  • Line 12 defines the list of scripts deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Recently Commented widget tag (wsdk.topics) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through28 add the JavaScript tag on the page, which includes all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-4 Recently Commented widget displayed on a web page

Description of Figure 85-4 follows
Description of "Figure 85-4 Recently Commented widget displayed on a web page"

Note:

When the Recently Commented widget is deployed, it does not display a title (as shown in Figure 85-4). For the Recently Commented widget to display a title, you will have to insert the title into the template to which you copied the Recently Commented widget tag.

85.1.5 Most Commented Widget Tag

The Most Commented Deployment screen (which you can access from the menu bar by selecting Comments, Deploy, and then Most Commented) provides designers with the Most Commented widget tag. This section analyzes the parameters defined in the Most Commented widget tag:

Most Commented widget tag

  1. <div id="topics_container_most_commented_other"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.topics",

  6. version: "1.5",

  7. elementID: "topics_container_most_commented_other",

  8. attributes: {"content_type":"most_commented","site_id":"FirstSiteII","resource_type":"other"}});

  9. setTimeout(

  10. function(){if ((typeof(wsdk) == 'undefined') || (typeof(wsdk.topics) == 'undefined')) {document.getElementById('topics_container_most_commented_other').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Topics is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.topics');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Most Commented widget tag

  • Line 1 defines the container that holds the Most Commented widget on the page.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Most Commented widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Most Commented widget inside the container defined in line 1. Line 8 specifies the Most Commented widget tag's settings, including the type of topics the Most Commented widget will list. If you want the Most Commented widget to include topics of all types in its list, remove the "resource_type":"other" parameter.

  • Lines 9 through 11 check if the Most Commented widget is rendered on the page. If the Most Commented widget is not rendered after 30 seconds, users are informed that there is an error and they should contact the site administrator.

  • Line 12 defines the list of page scripts deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Most Commented widget tag (wsdk.topics) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag on the page, including a list of all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-5 Most Commented widget displayed on a web page

Description of Figure 85-5 follows
Description of "Figure 85-5 Most Commented widget displayed on a web page"

Note:

When the Most Commented widget is deployed, it does not display a title (as shown in Figure 85-5). For the Most Commented widget to display a title, you will have to insert the title into the template to which you copied the Most Commented widget tag.

85.2 Reviews Widget Tags

The widget tags related to adding reviewing functionality to your website are the following:

85.2.1 Reviews Widget Tag

The Reviews Deployment screen (which you can access from the menu bar by selecting Reviews, Deploy, and then Reviews) provides designers with the Reviews widget tag. This section analyzes the parameters defined in the Reviews widget tag:

Reviews widget tag

  1. <div id="reviews_container"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.reviews",

  6. version: "1.5",

  7. elementID: "reviews_container",

  8. attributes: {"site_id":"FirstSiteII"}});

  9. setTimeout(

  10. function(){if ((typeof(wsdk) == 'undefined') || (typeof(wsdk.reviews) == 'undefined')) {document.getElementById('reviews_container').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Reviews is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.reviews');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Reviews widget tag

  • Line 1 defines the container that holds the Reviews widget on the page. If you assign a resource ID to this instance of the Reviews widget tag, the widget's resource ID is also specified in this line. For example:

    <div id= "reviews_container[resource_id]"></div>
    

    Where [resource_id] is the resource ID assigned to this instance of the Reviews widget.

    Note:

    If you do not specify a resource ID for this widget, the encrypted URL of the page on which this widget tag is deployed is assigned as the widget's resource ID.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Reviews widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Reviews widget inside the container defined in line 1.

  • Lines 9 through 11 check if the Reviews widget is rendered on the page. If the Reviews widget is not rendered after 30 seconds, users are informed that there is an error and they should contact the site administrators.

  • Line 12 defines the list of page scripts deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Reviews widget tag (wsdk.reviews) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag to the page, which includes all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-6 Reviews widget displayed on a web page

Description of Figure 85-6 follows
Description of "Figure 85-6 Reviews widget displayed on a web page"

85.2.2 Reviews Summary Widget Tag

The Reviews Summary Deployment screen (which you can access from the menu bar by selecting Reviews, Deploy, and then Reviews Summary) provides designers with the Reviews Summary widget tag. This section analyzes the parameters defined in the Reviews Summary widget tag:

Reviews Summary widget tag

  1. <div id="reviews_summary_container[resource_id]"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "reviews-summary",

  6. version: "0.1",

  7. elementID: "reviews_summary_container[resource_id]",

  8. attributes: {"site_id":"FirstSiteII","resource_id":"[resource_id]","show_last_comment_date

  9. setTimeout(

  10. function(){if ((typeof(cos) == 'undefined')||(typeof(cos.reviews-summary) == 'undefined')) {document.getElementById('reviews_summary_container').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Reviews Summary is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('reviews-summary');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Reviews Summary widget tag

  • Line 1 defines the container that holds the Reviews Summary widget on the page. If you specify the resource ID of a Reviews widget in this instance of the Reviews Summary widget tag, the resource ID for that Reviews widget is also specified in this line. For example:

    <div id= "reviews_summary_container[resource_id]></div>
    

    Where [resource_id] is the resource ID of the desired Reviews widget.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Reviews Summary widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Reviews Summary widget inside the container defined in line 1.

  • Lines 9 through 11 check if the Reviews Summary widget is rendered on the page. If the Reviews Summary widget is not rendered after 30 seconds, users are informed that there is an error and they should contact the site administrator.

  • Line 12 defines the list of scripts deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Reviews Summary widget tag (reviews-summary) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag to the page, which includes all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-7 Reviews Summary widget displayed on a web page

Description of Figure 85-7 follows
Description of "Figure 85-7 Reviews Summary widget displayed on a web page"

85.2.3 Links to Topics Widget Tag

The Links to Topics Deployment screen (which you can access from the menu bar by selecting Reviews, Deploy, Links to Topics) provides designers with the Links to Topics widget tag. This section analyzes the parameters defined in the Links to Topics widget tag:

Links to Topics widget tag

  1. <a href="[resource_url]#reviews_link&resource_id=[resource_id]" ></a>

  2. <div id="comments_link_div[random]"></div>

  3. <script type="text/javascript">

  4. cos = window.cos || {};

  5. cos.pageWidgets = cos.pageWidgets || [];

  6. cos.pageWidgets.push({name: "comments-link",

  7. version: "0.1",

  8. elementID: "comments_link_div[random]",

  9. attributes: {"site_id":'FirstSiteII'}});

  10. cos.pageScripts = cos.pageScripts || [];

  11. cos.pageScripts.push('comments-link');

  12. (function()

  13. {

  14. var oldOnloadHandler = window.onload || function()

  15. {

  16. };

  17. if (!oldOnloadHandler.alreadyProcessed)

  18. {

  19. window.onload = function()

  20. {

  21. var script = document.createElement('script');

  22. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  23. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  24. script.type = 'text/javascript';

  25. script.charset = 'utf-8';

  26. document.getElementsByTagName("head").item(0) .appendChild(script);

  27. oldOnloadHandler.apply(this, arguments);

  28. };

  29. window.onload.alreadyProcessed = true;

  30. }

  31. })();

  32. </script>

Analyzing the Links to Topics widget tag

  • Line 1 is a link to the web page on which the desired Reviews widget tag is deployed, and is added to the tag automatically when you enter values into the Resource ID and Resource URL fields in the Links to Topics Deployment screen.

  • Line 2 defines the container that holds the Links to Topics widget on the page.

  • Line 3 opens the bootstrapping JavaScript code needed for the widget.

  • Line 4 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 5 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 6 through 9 define the Links to Topics widget tag and add the new element to the list of widget tags (defined in line 5). Line 8 contains a link that is used to render the Links to Topics widget inside the container defined in line 2.

  • Line 10 defines the list of scripts deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 11 adds the Links to Topics widget tag (comments-link) to the list of page scripts (defined in line 10).

  • Line 14 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic, then the function is left empty.

  • Line 17 checks if the onload function is already processed.

  • Line 19 overrides the code that runs when the page is loaded.

  • Lines 21 through 26 add the JavaScript tag to the page, which includes all the scripts that need to be deployed.

  • Line 27 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 29 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 32 closes the bootstrapping JavaScript code needed for the widget.

85.2.3.1 Deploying the Links to Topics Widget Tag (For Reviews)

To configure the Links to Topics widget to display summarized information about and links to multiple web pages on which Reviews (and/or Comments) widgets are deployed, you will have to insert the resource ID and resource URL of each Reviews (and/or Comments) widget deployed on the desired web pages into the Links to Topics widget tag.

Note:

You can specify Reviews widgets and Comments widgets in the same Links to Topics widget tag. For information about specifying a Comments widget, see Section 85.1.3.1, "Deploying the Links to Topics Widget Tag (for Comments)."

For example:

  1. In the menu bar, select Reviews, Deploy, and then select Links to Topics.

  2. In the Links to Topics Deployment screen, copy (Ctrl+C) the Links to Topics widget tag.

  3. Access the WebCenter Sites Admin interface and insert the Links to Topics widget tag into the desired template. For instructions, see the Oracle Fusion Middleware WebCenter Sites User's Guide.

  4. In line 1 of the Links to Topics widget tag, specify the resource ID and resource URL of each deployed Reviews (and/or Comments) widget that the Links to Topics widget should display summarized information about and link to. For example:

    Add the following line for each Reviews widget you wish to specify in the Links to Topics widget tag:

    <a href="http://URL#reviews_link&resource_id+ReviewsID"></a>
    

    Where http://URL is the path to the web page on which the desired Reviews widget is deployed.

  5. Click Save Changes.

  6. Preview the page and then publish the template to the website. For instructions, see the Oracle Fusion Middleware WebCenter Sites User's Guide and the Oracle Fusion Middleware WebCenter Sites Administrator's Guide.

Figure 85-8 Links to Topics widget displayed on a web page

Description of Figure 85-8 follows
Description of "Figure 85-8 Links to Topics widget displayed on a web page"

Note:

When the Links to Topics widget is deployed, it does not display a title. For the Links to Topics widget to display a title, you will have to insert the title into the template to which you copied the Links to Topics widget tag.

85.2.4 Reviews Average Rating Widget Tag

The Reviews Average Rating Deployment screen (which you can access from the menu bar by selecting Reviews, Deploy, and then Average Rating) provides designers with the Reviews Average Rating widget tag. This section analyzes the parameters defined in the Reviews Average Rating widget tag:

Reviews Average Rating widget tag

  1. <divid="reviews_average_container[resource_id]"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.reviews_average",

  6. version: "1.5",

  7. elementID: "reviews_average_container[resource_id]",

  8. attributes: {"site_id":"FirstSiteII","resource_id":"[resource_id]"}});

  9. setTimeout(

  10. function(){if ((typeof(wsdk) == 'undefined')||(typeof(wsdk.reviews_average) == 'undefined')) {document.getElementById('reviews_average_container[resource_id]').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Reviews Average Rating is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.reviews_average');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Reviews Average Rating widget tag

  • Line 1 defines the container that holds the Reviews Average Rating widget on the page. You must specify the resource ID of the Reviews widget that is deployed on the web page whose average rating the Reviews Average Rating widget should display. For example:

    <div id="reviews_average_container[resource_id]"></div>
    

    Where [resource_id] is the resource ID of the desired Reviews widget.

  • Line 2 opens the bootstrapping JavaScript code that is needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Reviews Average Rating widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Reviews Average Rating widget inside the container defined in line 1.

  • Lines 9 through 11 check if the Reviews Average Rating widget is rendered on the page. If the Reviews Average Rating widget is not rendered after 30 seconds, users are informed that there is an error and they should contact the site administrator.

  • Line 12 defines the list of scripts deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Reviews Average Rating widget tag (wsdk.reviews_average) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add a JavaScript tag to the page, which includes a list of all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

85.2.5 Top Ranked Reviews Widget Tag

The Top Ranked Reviews Deployment screen (which you can access from the menu bar by selecting Reviews, Deploy, and then Top Ranked Topics) provides designers with the Top Ranked Reviews widget tag. This section analyzes the parameters defined in the Top Ranked Topics widget tag:

Top Ranked Reviews widget tag

  1. <div id="topics_container_top_ranked_other"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.topics",

  6. version: "1.5",

  7. elementID: "topics_container_top_ranked_other",

  8. attributes: {"content_type":"top_ranked","site_id":"FirstSiteII","resource_type":"other","rating_type":"stars"}});

  9. setTimeout(

  10. function(){if ((typeof(wsdk) == 'undefined') || (typeof(wsdk.topics) == 'undefined')) {document.getElementById('topics_container_top_ranked_other').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Topics is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.topics');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Top Ranked Reviews widget tag

  • Line 1 defines the container that holds the Top Ranked Reviews widget on the page.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Top Ranked Reviews widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Top Ranked Reviews widget inside the container defined in line 1. Line 8 specifies the Top Ranked Reviews widget tag's settings, including the type of topics the Top Ranked Reviews widget will list. If you want the Top Ranked Reviews widget to include topics of all types in its list, remove the "resource_type":"other" parameter.

  • Lines 9 through 11 check if the Top Ranked Reviews widget is rendered on the page. If the Top Ranked Reviews widget is not rendered after 30 seconds, users are informed that there is an error and they should contact the site administrator.

  • Line 12 defines the list of scripts deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Top Ranked Reviews widget tag (wsdk.topics) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag on the page, including a list of all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-9 Top Ranked Reviews widget displayed on a web page

Description of Figure 85-9 follows
Description of "Figure 85-9 Top Ranked Reviews widget displayed on a web page"

85.2.6 Recently Reviewed Widget Tag

The Recently Reviewed Deployment screen (which you can access from the menu bar by selecting Reviews, Deploy, and then Recently Reviewed) provides designers with the Recently Reviewed widget tag. This section analyzes the parameters defined in the Recently Reviewed widget tag:

Recently Reviewed widget tag

  1. <div id="topics_container_recently_reviewed_other"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.topics",

  6. version: "1.5",

  7. elementID: "topics_container_recently_reviewed_other",

  8. attributes: {"content_type":"recently_reviewed","site_id":"FirstSiteII","resource_type":"other"}});

  9. setTimeout(

  10. function(){if ((typeof(wsdk) == 'undefined') || (typeof(wsdk.topics) == 'undefined')) {document.getElementById('topics_container_recently_reviewed_other').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Topics is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.topics');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Recently Reviewed widget tag

  • Line 1 defines the container that holds the Recently Reviewed widget tag on the page.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widget tags deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Recently Reviewed widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Recently Reviewed widget inside the container defined in line 1. Line 8 specifies the Recently Reviewed widget tag's settings, including the type of topics the Recently Reviewed widget will list. If you want the Recently Reviewed widget to include topics of all types in its list, remove the "resource_type":"other" parameter.

  • Lines 9 through 11 check if the Recently Reviewed widget is rendered on the page. If the Recently Reviewed widget is not rendered after 30 seconds, users are informed that there is an error and they should contact the site administrator.

  • Line 12 defines the list of scripts deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Recently Reviewed widget tag (wsdk.topics) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag to the page, including a list of all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-10 Recently Reviewed widget displayed on a web page

Description of Figure 85-10 follows
Description of "Figure 85-10 Recently Reviewed widget displayed on a web page"

Note:

When the Recently Reviewed widget is deployed, it does not display a title (as shown in Figure 85-10). For the Recently Reviewed widget to display a title, you will have to insert the title into the template to which you copied the Recently Reviewed widget tag.

85.2.7 Most Reviewed Widget Tag

The Most Reviewed Deployment screen (which you can access from the menu bar by selecting Reviews, Deploy, and then Most Reviewed) provides designers with the Most Reviewed widget tag. This section analyzes the parameters defined in the Most Reviewed widget tag:

Most Reviewed widget tag

  1. <div id="topics_container_most_reviewed_other"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.topics",

  6. version: "1.5",

  7. elementID: "topics_container_most_reviewed_other",

  8. attributes: {"content_type":"most_reviewed","site_id":"FirstSiteII","resource_type":"other"}});

  9. setTimeout(

  10. function(){if ((typeof(wsdk) == 'undefined') || (typeof(wsdk.topics) == 'undefined')) {document.getElementById('topics_container_most_reviewed_other').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Topics is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.topics');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Most Reviewed widget tag

  • Line 1 defines the container that holds the Most Reviewed widget on the page.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Most Reviewed widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Most Reviewed widget inside the container defined in line 1. Line 8 specifies the Most Reviewed widget tag's settings, including the type of topics the Most Reviewed widget will list. If you want the Most Reviewed widget to include topics of all types in its list, remove the "resource_type":"other" parameter.

  • Lines 9 through 11 check if the Most Reviewed widget is rendered on the page. If the Most Reviewed widget is not rendered after 30 seconds, users are informed that there is an error and they should contact the site administrator.

  • Line 12 defines the list of scripts deployed on the page. If there are no such scripts deployed, then the list's value is empty.

  • Line 13 adds the Most Reviewed widget tag (wsdk.topics) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag to the page, including a list of scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-11 Most Reviewed widget displayed on a web page

Description of Figure 85-11 follows
Description of "Figure 85-11 Most Reviewed widget displayed on a web page"

Note:

When the Most Reviewed widget is deployed, it does not display a title (as shown in Figure 85-11). For the Most Reviewed widget to display a title, you will have to insert the title into the template to which you copied the Most Reviewed widget tag.

85.3 Ratings Widget Tags

The widget tags related to adding rating functionality to your website are the following:

85.3.1 Stars Ratings Widget Tag

The Stars Ratings Deployment screen (which you can access from the menu bar by selecting Ratings, Deploy, and then Stars Ratings) provides designers with the Stars Ratings widget tag. This section analyzes the parameters defined in the Stars Ratings widget tag:

Stars Ratings widget tag

  1. <div id="ratingsstars_container"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.ratings",

  6. version: "1.5",

  7. elementID: "ratingsstars_container",

  8. attributes: {"rating_type":"stars","site_id":"FirstSiteII"}});

  9. setTimeout(

  10. function(){if ((typeof(wsdk) == 'undefined') || (typeof(wsdk.ratings) == 'undefined')) {document.getElementById('ratings_stars_container').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Ratings is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.ratings');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Stars Ratings widget tag

  • Line 1 defines the container that holds the Stars Ratings widget on the page. If you assign a resource ID to this instance of the Stars Ratings widget tag, the widget's resource ID is also specified in this line. For example:

    <divid="ratingsstars_container[resource_id]"></div>
    

    Where [resource_id] is the resource ID assigned to this instance of the Stars Ratings widget.

    Note:

    If you do not specify a resource ID for this widget tag, the encrypted URL of the page on which this widget tag is deployed is assigned as the widget's resource ID.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Stars Ratings widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Stars Ratings widget inside the container defined in line 1.

  • Lines 9 through 11 check if the Stars Ratings widget is rendered on the page. If the Stars Ratings widget is not rendered after 30 seconds, users are informed that there is an error and that they should contact the site administrator.

  • Line 12 defines the list of scripts that are deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Stars Ratings widget tag (wsdk.ratings) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag on the page, including a list of all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-12 Stars Ratings widget deployed on a web page

Description of Figure 85-12 follows
Description of "Figure 85-12 Stars Ratings widget deployed on a web page"

85.3.2 Thumbs Up/Down Ratings Widget Tag

The Thumbs Up/Down Ratings Deployment screen (which you can access from the menu bar by selecting Ratings, Deploy, and then Thumbs Up/Down Ratings) provides designers with the Thumbs Up/Down Ratings widget tag. This section analyzes the parameters defined in the Thumbs Up/Down Ratings widget tag:

Thumbs Up/Down Ratings widget tag

  1. <div id="ratingsthumbs_container"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.ratings",

  6. version: "1.5",

  7. elementID: "ratingsthumbs_container",

  8. attributes: {"rating_type":"thumbs","site_id":"FirstSiteII"}});

  9. setTimeout(

  10. function(){if ((typeof(wsdk) == 'undefined') || (typeof(wsdk.ratings) == 'undefined')) {document.getElementById('ratings_thumbs_container').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Ratings is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.ratings');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Thumbs Up/Down Ratings widget tag

  • Line 1 defines the container that holds the Thumbs Up/Down Ratings widget on the page. If you assign a resource ID to this instance of the Thumbs Up/Down Ratings widget, the resource ID is also specified in this line. For example:

    <div id="ratingsthumbs_container[resource_id]"></div>
    

    Where [resource_id] is the resource ID assigned to this instance of the Thumbs Up/Down Ratings widget.

    Note:

    If you do not specify a resource ID for this widget tag, the encrypted URL of the page on which this widget tag is deployed is assigned as the widget's resource ID.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Thumbs Up/Down Ratings widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Thumbs Up/Down Ratings widget inside the container defined in line 1.

  • Lines 9 through 11 check if the Thumbs Up/Down Ratings widget is rendered on the page. If the Thumbs Up/Down Ratings widget is not rendered after 30 seconds, users are informed that there is an error and that they should contact the site administrator.

  • Line 12 defines the list of scripts that are deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Thumbs Up/Down Ratings widget tag (wsdk.ratings) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag on the page, including a list of all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-13 Thumbs Up/Down Ratings widget displayed on a web page

Description of Figure 85-13 follows
Description of "Figure 85-13 Thumbs Up/Down Ratings widget displayed on a web page"

85.3.3 Like It Ratings Widget Tag

The Like It Ratings Deployment screen (which you can access from the menu bar by selecting Ratings, Deploy, and then Like It Ratings) provides designers with the Like It Ratings widget tag. This section analyzes the parameters defined in the Like It Ratings widget tag:

Like It Ratings widget tag

  1. <div id="ratingslike_it_container"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.ratings",

  6. version: "1.5",

  7. elementID: "ratingslike_it_container",

  8. attributes: {"rating_type":"like_it","site_id":"FirstSiteII"}});

  9. setTimeout(

  10. function(){if ((typeof(wsdk) == 'undefined') || (typeof(wsdk.ratings) == 'undefined')) {document.getElementById('ratingslike_it_container').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Ratings is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.ratings');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Like It Ratings widget tag

  • Line 1 defines the container that holds the Like It Ratings widget on the page. If you assign a resource ID to this instance of the Like It Ratings widget, the widget's resource ID is also specified in this line. For example:

    <div id="ratingslike_it_container[resource_id]"></div>
    

    Where [resource_id] is the resource ID assigned to this instance of the Like It Ratings widget.

    Note:

    If you do not specify a resource ID for this widget tag, the encrypted URL of the page on which this widget tag is deployed is assigned as the widget's resource ID.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Like It Ratings widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Like It Ratings widget tag inside the container defined in line 1.

  • Lines 9 through 11 check if the Like It Ratings widget is rendered on the page. If the Like It Ratings widget is not rendered after 30 seconds, users are informed that there is an error and that they should contact the site administrator.

  • Line 12 defines the list of scripts that are deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Like It Ratings widget tag (wsdk.ratings) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag on the page, including a list of all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-14 Like It Ratings widget displayed on a web page

Description of Figure 85-14 follows
Description of "Figure 85-14 Like It Ratings widget displayed on a web page"

85.3.4 Recommend Ratings Widget Tag

The Recommend Ratings Deployment screen (which you can access from the menu bar by selecting Ratings, Deploy, and then Recommend Ratings) provides designers with the Recommend Ratings widget tag. This section analyzes the parameters defined in the Recommend Ratings widget tag:

Recommend Ratings widget tag

  1. <div id="ratingsrecommend_container"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.ratings",

  6. version: "1.5",

  7. elementID: "ratingsrecommend_container",

  8. attributes: {"rating_type":"recommend","site_id":"FirstSiteII"}});

  9. setTimeout(

  10. function(){if ((typeof(wsdk) == 'undefined') || (typeof(wsdk.ratings) == 'undefined')) {document.getElementById('ratingsrecommend_container').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Ratings is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.ratings');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Recommend Ratings widget tag

  • Line 1 defines the container that holds the Recommend Ratings widget on the page. If you assign a resource ID to this instance of the Recommend Ratings widget, the widget's resource ID is also specified in this line. For example:

    <div id="ratingsrecommend_container[resource_id]"></div>
    

    Where [resource_id] is the resource ID assigned to this instance of the Recommend Ratings widget.

    Note:

    If you do not specify a resource ID for this widget tag, the encrypted URL of the page on which this widget tag is deployed is assigned as the widget's resource ID.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Recommend Ratings widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Recommend Ratings widget inside the container defined in line 1.

  • Lines 9 through 11 check if the Recommend Ratings widget is rendered on the page. If the Recommend Ratings widget is not rendered after 30 seconds, users are informed that there is an error and that they should contact the site administrator.

  • Line 12 defines the list of scripts that are deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Recommend Ratings widget tag (wsdk.ratings) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag on the page, including a list of all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-15 Recommend Ratings widget displayed on a web page

Description of Figure 85-15 follows
Description of "Figure 85-15 Recommend Ratings widget displayed on a web page"

85.3.5 Ratings Average Rating Widget Tag

The Ratings Average Rating Deployment screen (which you can access from the menu bar by selecting Ratings, Deploy, and then Average Rating) provides designers with the Ratings Average Rating widget tag. This section analyzes the parameters defined in the Ratings Average Rating widget tag:

Ratings Average Rating widget tag

  1. <div id="ratings_average_container[resource_id]"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.ratings_average",

  6. version: "1.5",

  7. elementID: "ratings_average_container[resource_id]",

  8. attributes: {"site_id":"FirstSiteII","resource_id":"[resource_id]"}});

  9. setTimeout(

  10. function(){if ((typeof(wsdk) == 'undefined')||(typeof(wsdk.ratings_average) == 'undefined')) {document.getElementById('ratings_average_container').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Average Rating is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.ratings_average');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Ratings Average Rating widget tag

  • Line 1 defines the container that holds the Ratings Average Rating widget on the page. You must specify the resource ID of the Stars Ratings widget tag deployed on the web page whose average rating the Ratings Average Ratings widget should display. For example:

    <div id="ratings_average_container[resource_id]"></div>
    

    Where [resource_id] is the resource ID of the Stars Ratings widget deployed on the web page whose average rating the Ratings Average Rating widget should display.

  • Line 2 opens the bootstrapping JavaScript code that is needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Ratings Average Rating widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Ratings Average Rating widget tag inside the container defined in line 1.

  • Lines 9 through 11 check if the Ratings Average Ratings widget is rendered on the page. If the Ratings Average Rating widget is not rendered after 30 seconds, users are informed that there is an error and they should contact the site administrator.

  • Line 12 defines the list of scripts deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Ratings Average Rating widget tag (wsdk.ratings_average) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag to the page, which includes a list of all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

85.3.6 Recently Rated Widget Tag

The Recently Rated Deployment screen (which you can access from the menu bar by selecting Ratings, Deploy, and then Recently Rated) provides designers with the Recently Rated widget tag. This section analyzes the parameters defined in the Recently Rated widget tag:

Recently Rated widget tag

  1. <div id="topics_container_recently_rated_other"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.topics",

  6. version: "1.5",

  7. elementID: "topics_container_recently_rated_other",

  8. attributes: {"content_type":"recently_rated","site_id":"FirstSiteII","resource_type":"other"}});

  9. setTimeout(

  10. function(){if ((typeof(wsdk) == 'undefined') || (typeof(wsdk.topics) == 'undefined')) {document.getElementById('topics_container_recently_rated_other').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Topics is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.topics');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Recently Rated widget tag

  • Line 1 defines the container that holds the Recently Rated widget on the page.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Recently Rated widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Recently Rated widget inside the container defined in line 1. Line 8 specifies the Recently Rated widget tag's settings, including the type of topics the Recently Rated widget will list. If you want the Recently Rated widget to include topics of all types in its list, remove the "resource_type":"other" parameter.

  • Lines 9 through 11 check if the Recently Rated widget is rendered on the page. If the Recently Rated widget is not rendered after 30 seconds, then users are informed that there is an error and they should contact the site administrator.

  • Line 12 defines the list of scripts deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Recently Rated widget tag (wsdk.topics) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag to the page, including a list of all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-16 Recently Rated widget displayed on a web page

Description of Figure 85-16 follows
Description of "Figure 85-16 Recently Rated widget displayed on a web page"

Note:

When the Recently Rated widget is deployed, it does not display a title (as shown in Figure 85-16). For the Recently Rated widget to display a title, you will have to insert the title into the template to which you copied the Recently Rated widget tag.

85.3.7 Most Rated Widget Tag

The Most Rated Deployment screen (which you can access from the menu bar by selecting Ratings, Deploy, and then Most Rated) provides designers with the Most Rated widget tag. This section analyzes the parameters defined in the Most Rated widget tag:

Most Rated widget tag

  1. <div id="topics_container_most_rated_other"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.topics",

  6. version: "1.5",

  7. elementID: "topics_container_most_rated_other",

  8. attributes: {"content_type":"most_rated","site_id":"FirstSiteII"'"resource_type":"other"}});

  9. setTimeout(

  10. function(){if ((typeof(wsdk) == 'undefined') || (typeof(wsdk.topics) == 'undefined')) {document.getElementById('topics_container_most_rated_other').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Topics is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.topics');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Most Rated widget tag

  • Line 1 defines the container that holds the Most Rated widget on the page.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Most Rated widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Most Rated widget inside the container defined in line 1. Line 8 specifies the Most Rated widget tag's settings, including the type of topics the Most Rated widget will list. If you want the Most Rated widget to include topics of all types in its list, remove the "resource_type":"other" parameter.

  • Lines 9 through 11 check if the Most Rated widget is rendered on the page. If the Most Rated widget is not rendered after 30 seconds, users are informed that there is an error and they should contact the site administrator.

  • Line 12 defines the list of scripts deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Most Rated widget tag (wsdk.topics) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag on the page, including a list of all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-17 Most Rated widget displayed on a web page

Description of Figure 85-17 follows
Description of "Figure 85-17 Most Rated widget displayed on a web page"

Note:

When the Most Rated widget is deployed, it does not display a title (as shown in Figure 85-17). For the Most Rated widget to display a title, you will have to insert the title into the template to which you copied the Most Rated widget tag.

85.4 Login Bar Widget Tag

The "Login Bar Deployment" screen (which you can access from the menu bar by selecting Login Bar and then Deploy) provides designers with the Login Bar widget tag. This section analyzes the parameters defined in the Login Bar widget tag:

Login Bar widget tag

  1. <div id="session_box_container"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "wsdk.session",

  6. version: "0.1",

  7. elementID: "session_box_container",

  8. attributes:{"view_type":"short","site_id":"FirstSiteII"}});

  9. setTimeout(

  10. function(){if ((typeof(session_box) == 'undefined') || (typeof(session_box.v0_1) == 'undefined')) {document.getElementById('session_box_container').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Login Bar is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('wsdk.session');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0).appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Login Bar widget tag

  • Line 1 defines the container that holds the Login Bar widget on the page.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Login Bar widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Login Bar widget inside the container defined in line 1.

  • Lines 9 through 11 check if the Login Bar widget is rendered on the page. If the Login Bar widget is not rendered after 30 seconds, users are informed that there is an error and they should contact their site administrator.

  • Line 12 defines the list of scripts deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Login Bar widget tag (session-box) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag on the page, including a list of all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-18 Standalone login bar widget displayed on a web page

Description of Figure 85-18 follows
Description of "Figure 85-18 Standalone login bar widget displayed on a web page"

85.5 Poll Widget Tags

The Deploy Poll Name Poll screen (which you can access from the menu bar by selecting Polls, All Polls, and then navigating to the desired poll and selecting Deploy) provides designers with a given poll's Poll and Results widget tags. This section analyzes the parameters defined in the following widget tags:

85.5.1 Main Poll Widget Tag

The Poll Tag is the main Poll widget tag which contains all of the configurations for the poll you are deploying.

Poll Tag widget tag

  1. <div id="poll_container1322111446303"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "poll",

  6. version: "1.0",

  7. elementID: "poll_container1322111446303",

  8. attributes: {"poll_id":"1322111446303","uid":"35b48e18-f1c7-4e97-ab1a-98cea2564f66","site_id":"FirstSiteII"}});

  9. setTimeout(

  10. function(){if ((typeof(poll) == 'undefined') || (typeof(poll.v1_0) == 'undefined')) {document.getElementById('poll_container1322111446303').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Poll is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('poll');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg/wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Poll Tag widget tag

  • Line 1 defines the container that holds the Poll widget on the page. This line also specifies the unique identifier of the Poll widget you are deploying. Each poll is automatically assigned a unique identifier upon creation.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Poll widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Poll widget inside the container defined in line 1.

  • Lines 9 through 11 check if the Poll widget is rendered on the page. If the Polls widget is not rendered after 30 seconds, users are informed that there is an error and they should contact the site administrator.

  • Line 12 defines the list of scripts deployed on the page. If there are no scripts deployed, then the list's value is empty.

  • Line 13 adds the Poll widget tag (poll) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag on the page, including a list of all the scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-19 Poll widget displayed on a web page

Description of Figure 85-19 follows
Description of "Figure 85-19 Poll widget displayed on a web page"

85.5.2 Poll Results Widget Tag

The Results Tag contains a summary of the main poll's results (Section 85.5.1, "Main Poll Widget Tag"), which dynamically change with each poll vote submitted by a site visitor.

Results widget tag

  1. <div id="poll_summary_container1322111446303"></div>

  2. <script type="text/javascript">

  3. cos = window.cos || {};

  4. cos.pageWidgets = cos.pageWidgets || [];

  5. cos.pageWidgets.push({name: "poll-summary",

  6. version: "1.0",

  7. elementID: "poll_summary_container1322111446303",

  8. attributes: {"poll_id":"1322111446303","uid":"35b48e18-f1c7-4e97-ab1a-98cea2564f66","site_id":"FirstSiteII"}});

  9. setTimeout(

  10. function(){if ((typeof(poll) == 'undefined') || (typeof(poll.v1_0) == 'undefined')) {document.getElementById('poll_summary_container1322111446303').innerHTML = "<div style='font-family: Tahoma, Verdana, Geneva, sans-serif;font-size: 12px;color: #333333;border: 1px solid #dbdfe1;padding-left: 5px;padding-top: 4px;height: 22px;'>Poll is unavailable right now. Please contact the site administrator.</div>";}}

  11. ,30000);

  12. cos.pageScripts = cos.pageScripts || [];

  13. cos.pageScripts.push('poll');

  14. (function()

  15. {

  16. var oldOnloadHandler = window.onload || function()

  17. {

  18. };

  19. if (!oldOnloadHandler.alreadyProcessed)

  20. {

  21. window.onload = function()

  22. {

  23. var script = document.createElement('script');

  24. script.src = 'http://prod-cg.example.com:8080/cg//wsdk/widget/'

  25. + cos.pageScripts.join(':') + '.js?site_id=FirstSiteII';

  26. script.type = 'text/javascript';

  27. script.charset = 'utf-8';

  28. document.getElementsByTagName("head").item(0) .appendChild(script);

  29. oldOnloadHandler.apply(this, arguments);

  30. };

  31. window.onload.alreadyProcessed = true;

  32. }

  33. })();

  34. </script>

Analyzing the Results widget tag

  • Line 1 defines the container that holds the Results widget on the page. This line also specifies the unique identifier of the poll with which the Results widget is associated. The Results widget displays the results of the poll whose unique identifier is specified in this line.

  • Line 2 opens the bootstrapping JavaScript code needed for the widget.

  • Line 3 defines the cos object on the page. The cos object contains all Community application functionality. If there are no community widget tags deployed on the page, then the cos object's value is empty.

  • Line 4 defines the list of widget tags that are deployed on the page. If there are no widgets deployed on the page, then the list's value is empty.

  • Lines 5 through 8 define the Results widget tag and add the new element to the list of widget tags (defined in line 4). Line 7 contains a link that is used to render the Results widget inside the container defined in line 1.

  • Lines 9 through 11 check if the poll results widget is rendered on the page. If the poll results widget is not rendered after 30 seconds, users are informed that there is an error and they should contact the site administrators.

  • Line 12 defines the list of scripts deployed on the page. If there are no scripts deployed, then the list's values is empty.

  • Line 13 adds the Results widget tag (poll) to the list of page scripts (defined in line 12).

  • Line 16 checks if there is any logic deployed on the page, which starts after the page has been loaded. If there is logic deployed on the page, this line defines the function that implements it. If there is no such logic deployed, then the function is left empty.

  • Line 19 checks if the onload function is already processed.

  • Line 21 overrides the code that runs when the page is loaded.

  • Lines 23 through 28 add the JavaScript tag on the page, including a list of scripts that need to be deployed.

  • Line 29 adds a new onload function call to the old onload function, with all the necessary arguments.

  • Line 31 defines the alreadyProcessed variable in order to avoid processing the onload function again.

  • Line 34 closes the bootstrapping JavaScript code needed for the widget.

Figure 85-20 Results widget displayed on a web page

Description of Figure 85-20 follows
Description of "Figure 85-20 Results widget displayed on a web page"