X3Photo Gallery Forums

Hello Karl, I have a question about using an SVG as the gallery logo.

I have confirmed that the gallery supports SVG: I tested a completely self-contained SVG (no external images), and it displays perfectly.

I am now trying to use an SVG that contains a PNG via an external

reference. The SVG itself is animated (the airplane banks left and right).

If external images inside SVGs aren't supported, is there a location within this X3 installation where I could place this PNG, so that the SVG can reference it locally? If so, what href= format/path shold I use?

The interesting part is that the SVG displays/animates correctly on my separate (non-X3) test page, and also directly at the above URL. But when I use the same SVG as the logo in this gallery, I can see the logo area/animation, but the externally referenced PNG airplane does not appear.

I don't need help with the SVG animation itself — that part is working. I mainly want to know whether external images referenced from inside an SVG logo are supported.

Thank you in advance and have a great day.

Regards,
John

I did another test that may help narrow this down.

I placed the PNG inside the gallery's logo image folder:

/content/custom/logo/logos_image_folder/

The PNG displays perfectly when I access it directly:

https://x3.NitroWings.me/content/custom/logo/logos_image_folder/US_Navy_030130-N-0226M-002_P-3C_Orion~cropped-40px~tail-fixed_inPixio12.png

However, when I use that exact same URL inside my SVG:

<image
href="https://x3.NitroWings.me/content/custom/logo/logos_image_folder/US_Navy_030130-N-0226M-002_P-3C_Orion~cropped-40px~tail-fixed_inPixio12.png"

...the SVG's banking/animation area displays, but the airplane image does not.

So the PNG is definitely accessible from the gallery, and a standalone SVG works correctly. It appears to be specifically the SVG loading the PNG that is failing.

Does the logo system restrict external/absolute URLs inside SVG elements? If so, is there a specific relative path or {{path}} syntax that I should use instead?

Thanks in advance.

Regards,
John

Sorry with all these reports:

I have 2 more important test results.

The exact same SVG file works perfectly when accessed directly:
https://x3.nitrowings.me/content/custom/logo/P3C-banking-test.svg

It also works when I access the same file directly from the Windows network share.

The SVG contains this external PNG reference:
<image
href="https://x3.nitrowings.me/content/custom/logo/logos_image_folder/US_Navy_030130-N-0226M-002_P-3C_Orion~cropped-40px~tail-fixed_inPixio12.png"

The PNG itself also displays correctly when accessed directly.

So the SVG, the animation, and the external PNG reference all work correctly when the SVG is accessed directly.

The problem occurs ONLY when I use that same SVG as the gallery's logo. In that situation I can see the logo/animation area, but the airplane (the external PNG inside the SVG) does not appear.

Does the gallery's logo-loading code treat SVG files differently from a normal / direct SVG request? Is there any sanitizing, rewriting, or restriction applied specifically to SVG logos?

One other detail occurred to me that may be relevant.

The gallery uses .htaccess rewrite rules to rewrite URLs/locations of files.

Could the URL rewriting be affecting SVG files when they are used as the gallery logo, particularly the way an SVG's resource is resolved or loaded?

The important distinction is that the exact same SVG works perfectly when I access the SVG directly, but the external PNG inside it disappears when that SVG is used as the gallery logo.