How to Add a Google+ Button in WebHelp Responsive Output
To add a Google+ widget to your WebHelp Responsive output, follow these steps:
- Go to the Google Developers website.
- Fill-in the displayed form.The preview area on the right side displays the code and a preview of the widget.
- Copy the code snippet displayed in the preview area and paste it into a
divelement inside an XML file calledgoogle-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>
- In Oxygen XML Developer, click the
Configure Transformation
Scenario(s) action from the toolbar
(or the menu. - Select an existing WebHelp Responsive transformation scenario (depending on your needs, it may be with or without feedback) and click the Duplicate button to open the Edit Scenario dialog box.
- Switch to the Parameters tab. Depending on where you want to
display the button, edit one of the parameters that begin with
webhelp.fragment. Set that parameter to reference thegoogle-plus-button.xmlfile that you created earlier. - Click Ok.
- Run the transformation scenario.