Skip Navigation
Expand
Creating thumbnail graphics (screenshots) for answers
Answer ID 1399   |   Last Review Date 02/12/2020

How can I create thumbnail graphics similar to those used in the Oracle B2C Service knowledge base?

Environment:

Answers, Knowledge Base
Oracle B2C Service

Resolution:

You can create thumbnail graphics to be used with your answers. For each graphic, we create two graphics: a small version of the graphic, which is used as the thumbnail and links to a larger version of the graphic. Then using standard HTML, you can use the graphics to construct a standard link using the <a href> and <img> tags. The smaller graphic is used with the <img> tag.

You can add text to display along with the image tag (and smaller graphic). All of the content within the The <a href> and </a> tags become part of the link.

Images used in published answers should be stored on your own servers and referenced accordingly.

General HTML Used: 

<a href="http://URL_of_larger_graphic_here" target="new"><img src="http://URL_of_smaller_graphic_here"> <br />Text Under Graphic</a>

Using this format, the smaller graphic becomes a link which opens a new window with the larger graphic displayed. From there, you can then specify dimensions or additional attributes (such as an "alt" attribute) as you wish.

When using the HTML editor, you can add a hyperlink (which creates the overall expression) and for the Text field of the hyperlink, enter the <img src="http://xyz"> (which uses the image for the link.


For example: The code below is used to generate the thumbnail graphic at the bottom of this answer.

<a href="https://cx.rightnow.com/euf/assets/cc_resources/screenshots/
8x_basic_report.pps" target="new">
<img src="https://cx.rightnow.com/euf/assets/cc_resources/screenshots/
8x_basic_report_s.gif" width="145" border="0" height="100" alt="Click to Enlarge" />
<br />Click to Enlarge:<br />Report Slideshow</a>

Actual thumbnail generated: 

Example of a thumbnail graphic for a slideshow of creating a new report in version 8.x
Click to Enlarge:
Report Slideshow