FM2022 HTML5 unstructured output template - Home file questions

[Robin331864826nc2]

Hello FM community,

I am creating an output template for FM2022 for HTML5 output from unstructured FM books. I have two

issues with output that I have not been able to resolve.

Issue with navigation menu entry for the home page:

We have been using this method in the past (FM2017/FM2019), and I have found that a workaround that was possible in 2017/2019 does not work in 2022.

The entry for the home page in the HTML5 navigation menu is not displaying the correct text for the home page. In past versions of FrameMaker, it was possible to save the FM document for the home page as a MIF file, search for the PDFDocInfo section, edit the Title value, remove a string of nonsensical numbers from PDFDocInfo, and save the MIF back to FM document. After doing so, the correct title would appear in the HTML5 navigation menu.

In FM2022, if I do the same process, the navigation title still does not appear correctly, and additionally, the main title of the entire document disappears completely from the HTML5 output, from the displayed content and from the source HTML pages:

Before:

After:

It also happens if I edit certain variables in the home page fm file. It appears to be irreversible. Once I edit the file in this way, nothing I do makes the title appear again.

Issue with size of the Logo file in the page output:

The size of the company logo always comes out the same--square and very small--regardless of the size and dimensions of the file that I insert in the template. I located the css page where this is controlled, and it is the one that is part of the Azue blue responsive template. I can manually edit the CSS on the output to change the div size that holds this logo, and it displays the way I want it to. However, when I add an override in Options > Override Styles for this Output, it does nothing, even if I make it important (I also tried adding it to the style mapping CSS, but that did not work either). I tried to export and reimport the entire Azure_blue layout, and edit just that stylesheet before reimporting. This ruined the output completely and I could not further edit that sts version. 

Does anyone know a workaround for either of these issues? 

Thanks,

Robin

[Jeff_Coatsworth]

Issue with navigation menu entry for the home page
I'm unsure figuring out just what you're talking about here - maybe some screenshots of what the problem is (without mucking around in MIF files or anything) and why you felt it was necessary to hack them in prior versions?

[Robin331864826nc2]

Hi Jeff, thank you for replying 🙂 

One issue is that the navigation panel does not display the correct text for the first page:

Currently it is picking up a line of variables from the file. The information I have about why it was originally hacked with the MIF washing in FM2017/2019 was that it would sometimes display the filename and you could edit it to display "Home" or your chosen text instead. (I did not work here when the original workaround was documented and I could not find FM documentation about how to troubleshoot these things.) I can edit the PDFDocInfo title field by right clicking the file and choosing File Info, but there must have been some reason why the edits did not "stick" unless made in the MIF file.

If I edit the copyright variable definition that appears in this line, the title of the document disappears from generated HTML5 output.

[Jeff_Coatsworth]

Umm, I'm still not quite following - your screenshot is showing the landing page of your output? And if so, the issue is that you don't want that first TOC item to say "323-1851-165 - Standard Issue..." ?

[Robin331864826nc2]

Yes, that is correct. I want the TOC entry for that page to say "Home" or  something other than the list of variables.

[Robin331864826nc2]

It seems to be taking the first line it finds. But this is the first line of Flow B, not even Flow A.

[Jeff_Coatsworth]

What's the FM TOC look like?

[Robin331864826nc2]

Hi Jeff,

Here is what the TOC looks like. I also included a view of the book file organization.

 

The TOC is second in the order. Among the things I tried was to remove the TOC before generating the HTML output. In this case, the Home file came out named correctly, but a new problem occurred. The new problem was that every chapter came out with a double-nested topic. As in, I had to expand an empty topic to get to the real start topic in each chapter. And when I put the TOC back on, it was no longer identified as a generated topic with the darker icon.

I also tried rearranging the topics before generation, with the TOC first. This did not solve my problem either.

[Matt-Tech Comm Tools]

Fm needs the TOC to properly configure the HTML, so that behavior when you removed the TOC is expected.

Can you reconfigure your file so that the variables are not the first thing found in the flow?

[Robin331864826nc2]

Hi Matt, I did not see this message earlier. All of the cover text is coming from variables. There are 3 flows: Flow A has product name and book name, Flow B is the publishing variables including the date and copyright, and Flow C is a text inset with a long copyright statement. All the flows are in the output document, but for some reason it switched the order of Flows A and B.
I don't know why there are 3 different flows. I assume A and B probably could have been one flow, but why it was set up this way originally might be lost in the mists of time.

I will try your suggestion below to hide a small title variable in white text in flow B and see if that solves my issue.

[Robin331864826nc2]

This all worked in FM2019.

[Jeff_Coatsworth]

And what does the Publish Settings look like?

[Robin331864826nc2]

Hi Jeff, it looks like this:

 

It is set up the same as it was in FM2019 (but started with a fresh settings file). There were some options in 2019 that do not exist in 2022, but we do not appear to have been using them.

[FrameMaker-dk]

Are you adding text in the "File info" section in the FrameMaker documents?  I am not sure that is the fix in this instance, but I have often used it to make the documents name work properly in HTML5 exports.

[Robin331864826nc2]

Hi Bjørn,

Yes, thanks for suggesting this. I expected this to work because it used to work in older FM versions. I tried adding text in this File Info section. I tried both by using the FM interface and I also tried saving it as a MIF and adding the same info to the PDFDocInfo section for Title. It does not seem to work anymore in FM2022, or something else changed that I am missing.

[Matt-Tech Comm Tools]

You mention that you're setting up a template...are you describing the Use HTML Page Template option shown below?

In my experience, when creating/editing an HTML template, any missteps are very difficult to remedy.

You can try resetting your preferences (close Fm, then rename the 17 directory found in your C:\Users\(USERNAME)\AppData\Roaming\Adobe\FrameMaker directory as I did for the 16 directory, and then restart Fm)

I believe that will give you fresh publish settings, including the HTML Template.

If you can't quickly figure out the solution, you can always delete your new 17 directory and rename 17x (or whatever you renamed it to) back to 17 and restart FrameMaker.

[Robin331864826nc2]

Hi Matt,

I did not use this template option. I meant that I am editing these sts settings to create the "template" by which I just meant the sts file with the styles and output options. In case I touched it accidentally, I did what you suggested and reset my user folder by renaming the old one. It did not change anything in the outputs, but at least I have been able to rule this out.

[Robin331864826nc2]

I made a change in the source files to add a line of text before the variables that form the first line of the page. I added what I would like as the "Home" text, and it does display what I put there. I'm not sure I'd want this as a permanent solution, because writers would have to change the cover page back and forth between producing PDF or HTML output and I am sure accidental omissions would happen. But it seems to prove that whatever is the first line on this page is getting put as the navigation text, regardless of what I put in the File Info.

When looking at the whole page though, it is a bit silly because this title also appears further down.

I'm wondering if there is a way to control which flow is coming out first in the HTML5 output. This is Flow B coming out first, but Flow A is first in the source file and in PDF output.

 

[Jeff_Coatsworth]

"writers would have to change the cover page back and forth between producing PDF or HTML output " - easy solution to that is to have 2 books - one for PDF output & one for online output.

[Matt-Tech Comm Tools]

Along with the suggestion from @Jeff_Coatsworth, consider setting the title as conditional text (perhaps a condition labeled HTML bookmark text) and set the visibility as needed when publishing.

Regarding the look/feel, if you only need the NBI Fundamentals for the TOC, you could bury it as 2pt white text at the top. 

I'm not sure about controlling the order of flow. Do you need a B flow in your doc? From memory, I thought only the main flow exported.

[Robin331864826nc2]

I ended up taking some suggestions that Matt and Jeff offered to fix the following items:

• To fix the tiny logo, I exported the slz file of the azure layout, unzipped it, and altered the div size in the layout.css. There were two issues I encountered that I will share in case someone else encounters them.
  • When re-zipping, I think it needs to be a particular method. The one that worked for me was Compress to > Additional Options, then pick archive format ZIP and Compression method Deflate. Then you need to rename the file extension to .slz before trying to reimport it into the Publish settings. I tried zipping to 7z and renaming but had issues (might have been related to next point) and also was getting failure messages when trying to zip just to ZIP file without the additional options.
  • I only got a good result when I selected all the items inside the azure folder, and zipped that. It did not work when I zipped the azure folder itself (I had tried this first, and what came out in the HTML output after reimporting it was a tiny box with my first page inside it).
• To fix the "Home" page text in the navigation menu, I took the suggestion to add a line of text that says "Home" right before the undesired text that was getting picked up in the navigation menu, and then to hide it in some way. In the FM file, I applied a tag to it that was not used elsewhere in the output. I styled that tag as white and xx-small text. It's on the front page of the HTML output before the real text, but you cannot see it, and the "Home" text in the navigation pane is correctly displayed. 
• I will suggest that the owners of the books maintain a second book file + Home page for generating HTML5 output so that they don't need to condition the "Home" text for their regular PDF books or rework variables as described in the next point.
• There was an issue with variable display. The copyright variable contains © and ® symbols. These symbols don't make it through the transformation to HTML5 in FM2022. The variable comes out with the string -1jb5s appended at the end of the variable text, and no symbols. I can get the symbols to display correctly if I use their HTML codes instead: &#169 and &#174. BUT if I do this, the document title disappears from the output (<div class'"title"><span></span><div> has nothing in between the span tags). So, the only solution I could find is to use normal text instead of a variable for the copyright info.

Thanks for offering me so much help with this! I am really glad the community exists.

Robin

[Matt-Tech Comm Tools]

Regarding the logo, I suggest inspecting the published code, and then modifying your CSS (exporting, editing, then reimporting) to address the logo formatting.

However, you may find that switching to a more recent skin gives you more/better options. Azure's a bit long in the tooth.

[Robin331864826nc2]

How does one get new skin options? This FM version includes Azure blue and I did not see other options to select. Do I have to build them myself?

For the logo, I found the CSS that controls the div size for the logo. It's in the CSS file that is generated by the Azure skin. I can edit it in the HTML output and it changes to the desired size. But if I add a CSS file to the "Override Styles for this output" section on the Publish options to make that div larger, it outputs this override CSS file but does not take effect (even if I add importance).

[Robin331864826nc2]

I also did not see anything in the FM documentation about how to change the skin

[Matt-Tech Comm Tools]

That's a great question! So, I went and recorded a quick video for you and added it to my FrameMaker Unstructured Authoring course. This should help you understand how to manage your skin choice.

https://youtu.be/wJrKxl2jacE