WebHelp customization: Localized text in HTML fragment

Frank Ralf
Posts: 392
Joined: Thu Jan 23, 2014 2:29 pm
Location: Hamburg
Contact:

WebHelp customization: Localized text in HTML fragment

Post by Frank Ralf » Mon Jun 03, 2019 6:02 pm

Hi,

I'm customizing the WebHelp Responsive and want to insert an HTML fragment that contains text that must be localized.

I've read "How to Localize the Interface of WebHelp Responsive Output" and suppose that I must add my string to one of the translation files and then reference it in the HTML fragment, probably using the i18n macro: ${i18n(string.id)}.

Is that correct?

Best regards,
Frank
Frank Ralf
parson AG
www.parson-europe.com

tonra
Posts: 11
Joined: Wed Jun 05, 2019 10:39 am
Location: Germany

Re: WebHelp customization: Localized text in HTML fragment

Post by tonra » Wed Jun 05, 2019 11:47 am

Hello Frank,

I was just going to post a quite similar question when I found your thread.

In my understanding, the localization features provided by Oxygen are limited to the interface of the output (e. g. search field placeholder text etc.).

I use HTML fragments containing localized content, too. It's wrapped in several div elements with the lang attribute.
In a first approach, I used JavaScript to display elements with the relevant language only. However, I would prefer using an XSLT-based solution instead. Unfortunately, I'm currently failing at accessing the HTML fragment file from the XSLT stylesheet (createMainPage.xsl) in order to copy the relevant (localized) content to the target (Main Page, wt_index.html). I've already checked commonComponentsExpander.xsl which seems to be responsible for filling the HTML fragments but haven't found a solution yet.

Best regards,
Anton

ionela
Posts: 294
Joined: Mon Dec 05, 2011 6:08 pm

Re: WebHelp customization: Localized text in HTML fragment

Post by ionela » Fri Jun 07, 2019 3:31 pm

Hi Frank,

Your finding are corrects. This is recommended way to localize that string.

Regards,
Ionela
Ionela Istodor
oXygen XML Editor and Author Support

Frank Ralf
Posts: 392
Joined: Thu Jan 23, 2014 2:29 pm
Location: Hamburg
Contact:

Re: WebHelp customization: Localized text in HTML fragment

Post by Frank Ralf » Tue Jun 11, 2019 3:53 pm

Hi Ionela,

Many thanks for this information.

Best regards,
Frank
Frank Ralf
parson AG
www.parson-europe.com

Frank Ralf
Posts: 392
Joined: Thu Jan 23, 2014 2:29 pm
Location: Hamburg
Contact:

Re: WebHelp customization: Localized text in HTML fragment

Post by Frank Ralf » Tue Jun 11, 2019 4:37 pm

Here's an example for the syntax, taken from com.oxygenxml.webhelp.responsive/oxygen-webhelp/page-templates/wt_search.html:

Code: Select all

<whc:macro value="${i18n(jump.to.results)}" />
The string is defined in com.oxygenxml.webhelp.responsive\oxygen-webhelp\resources\localization\strings-en-us.xml:

Code: Select all

<str name="jump.to.results" js="true" php="false">Jump to search results</str>
Best regards,
Frank
Frank Ralf
parson AG
www.parson-europe.com

tonra
Posts: 11
Joined: Wed Jun 05, 2019 10:39 am
Location: Germany

Re: WebHelp customization: Localized text in HTML fragment

Post by tonra » Tue Aug 13, 2019 1:55 pm

Hi,

thank you for posting an example, Frank. This approach meets my requirements almost perfectly.
There is only one thing I am currently missing: Is there an (elegant) way to add line breaks to a string?
I have tried several ways without success.

Best regards,
Anton

Frank Ralf
Posts: 392
Joined: Thu Jan 23, 2014 2:29 pm
Location: Hamburg
Contact:

Re: WebHelp customization: Localized text in HTML fragment

Post by Frank Ralf » Wed Aug 14, 2019 12:44 pm

Hi Anton,

The usual way in XML is to use one or both of the following entities:

Carriage return: &#xD;
Line feed: &#xA;

I haven't tested this, though.

Best regards,
Frank
Frank Ralf
parson AG
www.parson-europe.com

shudson310
Posts: 137
Joined: Sat Feb 26, 2005 12:09 am
Location: USA
Contact:

Re: WebHelp customization: Localized text in HTML fragment

Post by shudson310 » Thu Sep 26, 2019 10:49 pm

tonra wrote:
Wed Jun 05, 2019 11:47 am
In my understanding, the localization features provided by Oxygen are limited to the interface of the output (e. g. search field placeholder text etc.).

I use HTML fragments containing localized content, too. It's wrapped in several div elements with the lang attribute.
In a first approach, I used JavaScript to display elements with the relevant language only. However, I would prefer using an XSLT-based solution instead. Unfortunately, I'm currently failing at accessing the HTML fragment file from the XSLT stylesheet (createMainPage.xsl) in order to copy the relevant (localized) content to the target (Main Page, wt_index.html). I've already checked commonComponentsExpander.xsl which seems to be responsible for filling the HTML fragments but haven't found a solution yet.
I have a similar problem. I want to override the search field placeholder text. I want to add the publication name to the search placeholder. I tried adding the template from commonComponentsExpander.xsl to my custom.xsl in the publishing template directory:

I tried adding via variable, and via xpath override:

Code: Select all

${map-xpath(/bookmap//mainbooktitle)}

Code: Select all

<!-- Page title -->
                    <xsl:variable 
                        name="mainBookTitle" 
                        select="$mapTitle[contains(@class, 'booktitle')]/*[contains(@class, 'mainbooktitle')]"/>
Neither work in the customized template:

Code: Select all

<!-- 
        Expand the 'webhelp_search_input' place holder. 
    -->
    <xsl:template match="whc:webhelp_search_input" mode="copy_template">
        <!-- EXM-36737 - Context node used for messages localization -->
        <xsl:param name="i18n_context" tunnel="yes" as="element()*"/>
        <div>
            <xsl:call-template name="generateComponentClassAttribute">
                <xsl:with-param name="compClass">wh_search_input</xsl:with-param>
            </xsl:call-template>
            <!-- Copy attributes -->
            <xsl:copy-of select="@* except @class"/>
            
            <xsl:variable name="localizedSearch">
                <xsl:choose>
                    <xsl:when test="exists($i18n_context)">
                        <xsl:for-each select="$i18n_context[1]">
                            <xsl:call-template name="getWebhelpString">
                                <xsl:with-param name="stringName" select="'webhelp.search'"/>
                            </xsl:call-template>
                        </xsl:for-each>
                    </xsl:when>
                    <xsl:otherwise>Search</xsl:otherwise>
                </xsl:choose>
            </xsl:variable>
            <xsl:variable name="localizedSearchQuery">
                <xsl:choose>
                    <xsl:when test="exists($i18n_context)">
                        <xsl:for-each select="$i18n_context[1]">
                            <xsl:call-template name="getWebhelpString">
                                <xsl:with-param name="stringName" select="'search.query'"/>
                            </xsl:call-template>
                        </xsl:for-each>
                    </xsl:when>
                    <xsl:otherwise>Search query</xsl:otherwise>
                </xsl:choose>
            </xsl:variable>
            
            <xsl:variable name="search_comp_output">
                <form id="searchForm"
                    method="get"
                    role="search"                            
                    action="{concat($PATH2PROJ, 'search', $OUTEXT)}">
                    <div>
                        <input type="search" placeholder="{$localizedSearch} ${map-xpath(/bookmap//mainbooktitle)}" class="wh_search_textfield"
                            id="textToSearch" name="searchQuery" aria-label="{$localizedSearchQuery}" required="required"/>
                        <button type="submit" class="wh_search_button" aria-label="{$localizedSearch}"><span><xsl:value-of select="$localizedSearch"/></span></button>
                    </div>
                </form>
            </xsl:variable>
            
            <xsl:call-template name="outputComponentContent">
                <xsl:with-param name="compContent" select="$search_comp_output"/>
                <xsl:with-param name="compName" select="local-name()"/>
            </xsl:call-template>
        </div>
    </xsl:template>
, and added an extension point in the .opt file:

Code: Select all

            <extension 
                file="xsl/Custom.xsl" 
                id="com.oxygenxml.webhelp.xsl.webhelp_search_input"/>
It still doesn't seem to override the placeholder. What am I missing?
Scott Hudson
Content Strategist
Jeppesen
Site: jeppesen.com

radu_pisoi
Posts: 348
Joined: Thu Aug 21, 2003 11:36 am
Location: Craiova
Contact:

Re: WebHelp customization: Localized text in HTML fragment

Post by radu_pisoi » Wed Oct 02, 2019 12:22 pm

Hi,

You are on the right path, but there are two small issues you have to correct:

1. The XSLT extension point is wrong. The search form is displayed in three page templates: main page, search page and topic page. If you want to change the appearance for all pages you have to use the XSLT extension points associated with each page like in the following example:

Code: Select all

<xslt>
  <extension file="xslt/custom_search.xsl" id="com.oxygenxml.webhelp.xsl.createMainPage"/>
  <extension file="xslt/custom_search.xsl" id="com.oxygenxml.webhelp.xsl.createSearchPage"/>
  <extension file="xslt/custom_search.xsl" id="com.oxygenxml.webhelp.xsl.dita2webhelp"/>
</xslt>
2. In the XSLT template that you overwrite, whc:webhelp_search_input, you can use the mapTitle variable defined in the 'commonComponentsExpander.xsl' template. This variable points to the publication title.
Thus, a possible code could be:

Code: Select all

<input type="search" placeholder="{concat($localizedSearch, ' ', $mapTitle)}" class="wh_search_textfield"
    id="textToSearch" name="searchQuery" aria-label="{$localizedSearchQuery}" required="required"/>
Radu Pisoi
<oXygen/> XML Editor, Schema Editor and XSLT Editor/Debugger
http://www.oxygenxml.com

shudson310
Posts: 137
Joined: Sat Feb 26, 2005 12:09 am
Location: USA
Contact:

Re: WebHelp customization: Localized text in HTML fragment

Post by shudson310 » Wed Oct 02, 2019 4:02 pm

That worked very well! Thank you for the troubleshooting assistance! #bestcustomerservice
Scott Hudson
Content Strategist
Jeppesen
Site: jeppesen.com

Post Reply