• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

How can I increase the width of graphics exported in Responsive HTML5?

Explorer ,
Jul 19, 2023 Jul 19, 2023

Copy link to clipboard

Copied

I have some graphics in my FrameMaker document which need to fit the width of the page.

When I export the document to HTML5 they seem to be fixed to exactly 642.52px

I would like them to be 800px wide however there doesn't seem to be anywhere to set this.

I looked in the Publish Settings > Edit > Style Mapping > Image Setttings and also

Publish Settings > Edit > Style Mapping > General Settings

but there seems to be no way to adjust the pixel value of the 'full-width' HTML output.

Is there any way to do this other than manually editing the <object width="xxxx"> tag in the HTML?

Views

112

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jul 19, 2023 Jul 19, 2023

Copy link to clipboard

Copied

I don't.... think... you can, actually. I ended up having two pictures. One for mobile output and one for desktop. I gave each version a condition and used the conditions for output to print pdf/html5. I may be wrong here though and if you come up with a better solution I would really like to know 🙂

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Aug 02, 2023 Aug 02, 2023

Copy link to clipboard

Copied

Yes, it seems that way. Whatever I do the maximum width of any exported graphics (or tables) is 640 pixels.

I assume this is to cater for old VGA website layouts but it does seem a bit archaic these days.
The conditional idea won't work as there just doesn't seem to be any way to specify the maximum output width of the page for objects - 640pixels seems to be hard coded!

I will submit this as a bug/feature request.

If they can't fix this we'll have to find another application to produce HTML manuals I think.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Aug 02, 2023 Aug 02, 2023

Copy link to clipboard

Copied

What point version of FM are you using? I don't think you mentioned that.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Aug 02, 2023 Aug 02, 2023

Copy link to clipboard

Copied

I'm using version 17.0.2.431 - the issue also existed in version 16

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Aug 02, 2023 Aug 02, 2023

Copy link to clipboard

Copied

Hm. I just created a file with the FrameMaker default template and created a table with a single row and a single cell. There I inserted one of my EPS files (that was just the first one which I found). Then I scaled the table to the width of the text frame and the graphic to the width of the table (minus 0.05 cm). Then I exported everything to HTML5 (with the FrameMaker default sts file). The resulting PNG files have a width of 4729 px. The same px without table.

Possibly this depends on the source format. What's yours?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Aug 02, 2023 Aug 02, 2023

Copy link to clipboard

Copied

Most of the source images are PNGs - typically 1920pixels wide (or 3840). The actual images are copied unaltered to the destination directory in the generated web site, but the tags in the HTML set the width to about 640px (but not excactly for some reason) - height is auto.
It doesn't matter if I use an image directly in an anchored frame or if I put a frame inside a single-cell table. The image only ever gets a maximum width of 640px.

I have not tried a vector source image - I could try that but it wouldn't help with my screengrabs.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Aug 02, 2023 Aug 02, 2023

Copy link to clipboard

Copied

I just did another test - one graphic is a simple png in an anchored frame, the other has some callouts added in FrameMaker. Both fill the width of the frame which is the full width of the page in FrameMaker.
The first is converted into a standard <img> element whereas the second becomes an SVG object. However in both cases the image is still limited to a fixed width of ~640px:

 

<img align="" alt="workspace_single_UI_16072023" class="imageSettings" height="auto" preserveaspectratio="none" src="../assets/workspace_single_UI_16072023.png" style="display:block;align:left;" width="640.594543" x="0.462036" y="8.447489">


<object class="imageSettings" data="../assets/timeline_example2_28012019_FOM_SVG_238.svg" height="236.976318" style="max-width: 100% ;height: auto;display:block;align:left;" type="image/svg+xml" width="643.094950"></object>

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Aug 02, 2023 Aug 02, 2023

Copy link to clipboard

Copied

Are you using Object Styles for your graphics? Maybe the answer is being set in there?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Aug 02, 2023 Aug 02, 2023

Copy link to clipboard

Copied

LATEST

OK. I understand. I had just checked the width of the resulting PNG file and not the width in the HTML code.

I will see, if I can find something, but not today.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines