x

SVG Support

Weebly does not support SVG images. The implied workaround is to convert to PNG. However, the Apple App Store icon is provided only as SVG and Apple's T&C's do not allow you to convert, edit or modify the file.

I notice that weebly main site uses a modified Apple App store logo on their company page. This is against Apple's rules.

Anyone with a weebly site and an Apple App cannot link to the App Store with the official Apple icon. There is no supported workaround.

Let along that SVG has broad browser support and some good features that make it attractive to use, it is a requirement of the Apple App Store.

2,133 Views
Message 1 of 7
Report
6 REPLIES 6
Square

Using an SVG might be the case for iOS applications, but it doesn't need to be that for an Apple Touch icon for websites:

https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebConte...

2,130 Views
Message 5 of 7
Report

The link provided refers to webapps wrapped as ios apps. It does not apply to websites like weebly.
 
Go to https://developer.apple.com/app-store/marketing/guidelines/

Here is the relevant section to using the App Store Artwork.
1.1 Badge artwork
Badge artwork is provided in .svg format for web or onscreen communications and .eps format for use in printed materials. The .svg scalable vector graphic format is high resolution art and is preferred for onscreen communications including web pages. Use only the artwork provided here. Never create your own App Store badge or alter the artwork in any way.

Here is the license you agree to when downloading
2. You agree that Your use of the Artwork will be in strict compliance with the App Store Marketing and Advertising Guidelines for Developers found at https://developer.apple.com/app-store/marketing/guidelines/, which may be amended from time to time and also with Apple’s Guidelines for Using Apple Trademarks and Copyrights, found at http://www.apple.com/legal/intellectual-property/guidelinesfor3rdparties.html, which may be amended from time to time.
 

2,102 Views
Message 5 of 7
Report
Square

Right - a website isn't an iOS app that would be displayed in the App Store, and wouldn't need to use an SVG.

2,099 Views
Message 5 of 7
Report

.svg should be allowed for images, the conversion workaround isn't a productivity demo, compared to the layout functions for instance.

In fact this missing type support reduce the productivity behind content/section layout. svg is strongly surrounded by standards I don't think it will be a short term buzz... Wee' is scalable graphics ?!...

2,083 Views
Message 6 of 7
Report

Hi @cosmo, I've had no problems using SVG across my Weebly websites with no fallback options.

Using a custom HTML element you can use similar markup:

<img src="http://website.com/files/theme/fileName.svg">

or this

<object type="image/svg+xml" data="http://website.com/files/theme/fileName.svg">
</object>

Regards, Mark

2,038 Views
Message 7 of 7
Report

I had difficulty adding the current Apple App Store badge to my site. I eventually realized this was due to the current SVG badge file not having a XML header. Adding these lines to the top of the SVG file fixes the issue

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

Then you can use the normal weebly unsupported file trick:

1 - Create a page hidden from navigation to hold assets

2 - Drag a File download element onto hidden page

3 - Upload the SVG file into the File download element

4 - Publish site

5 - Get the download URL to the SVG file from the published hidden page

6 - Drag an “Embed Code” custom HTML element onto a visible page

7 - Use  “img” element like this with “src=“ SVG URL from the published site

<img class="centered" src="/uploads/#/#/#/#/########/apple_tv_badge.svg" alt="" data-hires-status="pending">

Alternatively, since SVG is XHTML text, you can just copy the entire contents of the badge SVG file into an  “Embed Code” custom HTML element.

969 Views
Message 8 of 7
Report