Easy way to link SVGs in forum posts

[evansd2]

Sometimes, adding a “clickable” link is nice for new users. Not everyone gets the concept of right click, save as…

I linked to an existing SVG in a thread here:

Snap Together Coaster Box with Lid - Resized the other box offered here

Right click on the image and “save as…” You can also click here.

How I did it:

1. Right click on the uploaded SVG, select “copy image location”.

2. Type your link text, in this case “click here”.

3. Select the link text and click the link button. Paste the svg url into the location field.

4. Save, you’re done. Finish up your post as usual.

Now what if you’re uploading your own new SVG, and want to link in the post in one shot?

1. Drag your SVG into your post:

2. Type your link text.

3. Reach over into your preview panel in the new post interface. Right click and copy image location on your now freshly uploaded SVG.

4. Link your text to that location. (which I did above). Piece of cake, and might head off the inevitable “how do I download”, and bonus: not zipped, so no answering that either.

As we make new posts and want them to be accessible to more people, this might be a thoughtful thing to do if you have a few extra seconds.

[marmak3261]

Hey, great tip. I could have used that when I responded about making something easy for an office desk. I would have just linked to my original file.

[evansd2]

Not too late, go edit your post? I’d love to see “zip svg and upload that” go away, it’s a goofy step.

Now if only discourse would size SVGs reasonably on uploading… that’s one I haven’t figured out how to shortcut. I use the @rbtdanforth method of adding two zeroes to both dimensions. Maybe I should include a link to a post explaining that in this thread too?

[marmak3261]

Yes, I never went back and edited that post. I think this was before Discourse got posting SVGs easier. Used to have to manual mess with the tags.

Personalized Game Pieces

Uploading .svg files in a post is a matter of putting the correct html markers around the file name as it resides on the Glowforge server and putting the tag name in. So first upload the file as normal, which will put it into an img tag and give an white box as an image placeholder since Discourse doesn’t natively display .svg graphics. Manually change the beginning and end of the tag to to a simple href attachment tag, while keeping the URL and upload name. My knowledge of html is limited. so…

@evansd2

post explaining that in this thread too

Yes. I don’t know how many times I have explained that to folks. Guess I could do a search for it.

[jbmanning5]

@evansd2

I’d love to see “zip svg and upload that” go away, it’s a goofy step.

I like zipping them because it maintains the integrity of the file. More than a few SVGs have been uploaded and had content altered by Discourse.

@evansd2

Now if only discourse would size SVGs reasonably on uploading… that’s one I haven’t figured out how to shortcut.

I think is related to where/how CSS is implemented. In Illustrator, I use Presentation Attributes (which isn’t actually CSS but attributes in the SVG tags).

I imagine Discourse strips out the in-line or internal CSS.

[evansd2]

@jbmanning5

content altered by Discourse.

I’m not doubting you, but I haven’t seen this except in cases where embedded images don’t present properly, but downloading them has always made them appear properly.

Has anyone figured out how to reproduce that? Is it browser related or discourse related?

[timjedwards]

@evansd2

adding two zeroes to both dimensions

That works for some images, but when the svg is of a small item on a 20x12 page it still looks diminutive.

[evansd2]

Yeah changing the page dimensions before uploading fixes that of course but in some cases it’s best to export a raster and upload that and then link to your svg either in zip or native form.

It all takes a bit of extra effort, but it does help with accessibility. Ymmv.

[timjedwards]

@evansd2

It all takes a bit of extra effort, but it does help

Agreed, and thanks for spelling out the options. When posting from my phone, “a bit” becomes “a lot” so I get lazy.

[evansd2]

Yeah almost all of this is from a desktop browser… I’ve never even tried to upload an svg from a phone or tablet.