QR code for this page

Powered by Titania Delivery

How to Add a Google+ Button in WebHelp Classic Output

To add a Google+ widget to your WebHelp output, follow these steps:

  1. Go to the Google Developers website.
  2. Fill-in the displayed form.
    The preview area on the right side displays the code and a preview of the widget.
  3. Copy the code snippet displayed in the preview area and paste it into a div element inside an XML file called google-plus-button.xml.
    Make sure that the content of the file is well-formed.

    The content of the XML file should look like this: 

    <div id="google-plus">
  <!-- Place this tag in your head or just before your close body tag. -->
  <script src="https://apis.google.com/js/platform.js" async defer></script>
  
  <!-- Place this tag where you want the +1 button to render. -->
  <div class="g-plusone" data-annotation="inline" data-width="300"></div>
</div>
  4. In Oxygen XML Developer, click the Configure Transformation Scenario(s) action from the toolbar (or the Document ⇒ Transformation menu.
  5. Select an existing WebHelp transformation scenario (depending on your needs, it may be with or without feedback, or the mobile variant) and click the Duplicate button to open the Edit Scenario dialog box.
  6. Switch to the Parameters tab and edit the webhelp.footer.file parameter to reference the google-plus-button.xml file that you created earlier.
  7. Click Ok.
  8. Run the transformation scenario.

Related information:

DITA Map to WebHelp Output
Parent topic: Integrating Social Media and Google Tools in WebHelp Output

Was this helpful?