Im new to Inkscape but I have managed to complete several images. Now I want to get those images on to my website. How do I do it?
Loading an svg image is so different to loading a png or jpeg or gif. I simply dont know what to do?? I have a drupal website and when I create content, it asks me, "do you want to create a page or an image?" But what is svg - an image or an.html
Putting an svg image into my website
Re: Putting an svg image into my website
Putting an SVG image into a website is no different from putting a PNG or GIF. But before I explain further, I should say that I only know how to use simple HTML. So I can only give you the bare basics, or general idea. I can't give you specific steps.
When I first was researching how to create a new website (for myself), I looked into Drupal and Joomla both. But honestly, I couldn't make heads or tails out of either one. I could get exactly as far as you got with Drupal. Then the create page or image thing is where I would get stuck. (What does it mean "create an image"? This isn't a graphics program, is it? And clicking on the image option - I don't remember what happened, but it just was not intuitive at all.)
In the end, I decided to use SMF forum (or similar) where the code that creates the website is already done for you. So far, I've found it to be very flexible. With different mods, you can have regular whole webpages, as well as the basic forum. I'm not sure if you could install something like that, and then disable the forum (I realize you didn't mention a forum at all). But there must be programs that provide a website (without a forum) that's already coded, where you only have to customize it.
Ok, so back to your questions. SVG files are both images and XML documents. The XML/SVG code creates the image.
First, the image needs to be uploaded to your server. Once it's uploaded, it will have a URL, which is the address where the image is now living on the internet. I don't know what kind of setup you have, but that should be fairly obvious to you by now, how to find the URL.
[edit - deleted some gibberish, was falling asleep when originally posted]
I hope some of that will help. Good luck!
When I first was researching how to create a new website (for myself), I looked into Drupal and Joomla both. But honestly, I couldn't make heads or tails out of either one. I could get exactly as far as you got with Drupal. Then the create page or image thing is where I would get stuck. (What does it mean "create an image"? This isn't a graphics program, is it? And clicking on the image option - I don't remember what happened, but it just was not intuitive at all.)
In the end, I decided to use SMF forum (or similar) where the code that creates the website is already done for you. So far, I've found it to be very flexible. With different mods, you can have regular whole webpages, as well as the basic forum. I'm not sure if you could install something like that, and then disable the forum (I realize you didn't mention a forum at all). But there must be programs that provide a website (without a forum) that's already coded, where you only have to customize it.
Ok, so back to your questions. SVG files are both images and XML documents. The XML/SVG code creates the image.
First, the image needs to be uploaded to your server. Once it's uploaded, it will have a URL, which is the address where the image is now living on the internet. I don't know what kind of setup you have, but that should be fairly obvious to you by now, how to find the URL.
[edit - deleted some gibberish, was falling asleep when originally posted]
I hope some of that will help. Good luck!
Basics - Help menu > Tutorials
Manual - Inkscape: Guide to a Vector Drawing Program
Inkscape Community - Inkscape FAQ - Gallery
Inkscape for Cutting Design
Manual - Inkscape: Guide to a Vector Drawing Program
Inkscape Community - Inkscape FAQ - Gallery
Inkscape for Cutting Design
Re: Putting an svg image into my website
There are several ways to do this:
- just add the SVG source code into the page or into the CSS
- add an img tag and use the SVG as its source (Internet explorer sometimes has difficulties with keeping the correct aspect ratio)
- use embed or object tags if you have javascript animated SVGs
Also see the Inkscape manual: http://tavmjong.free.fr/INKSCAPE/MANUAL/html/Web.html
and here is an epic guide:
https://css-tricks.com/scale-svg/
- just add the SVG source code into the page or into the CSS
- add an img tag and use the SVG as its source (Internet explorer sometimes has difficulties with keeping the correct aspect ratio)
- use embed or object tags if you have javascript animated SVGs
Also see the Inkscape manual: http://tavmjong.free.fr/INKSCAPE/MANUAL/html/Web.html
and here is an epic guide:
https://css-tricks.com/scale-svg/
Something doesn't work? - Keeping an eye on the status bar can save you a lot of time!
Inkscape FAQ - Learning Resources - Website with tutorials (German and English)
Inkscape FAQ - Learning Resources - Website with tutorials (German and English)
Re: Putting an svg image into my website
Drupal packed a hissy fit, so I took off these first two lines:
... and wella! Up she came. Thanks for the good links and help.
Code: Select all
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
... and wella! Up she came. Thanks for the good links and help.