Adding images.

alexandros123
22 May 2017, 11:04

So,i am really new around here and i was wondering if it is possible to add images next to the text (or maybe above it). I have seen some examples where people use images and it looks beautiful but i just cant seem to understand how. I have searched all the documentation and even searched for tutorial video and found nothing.
*I want to point out that i'm not using any intense JavaScript,just some simple sections and passages to make a story.

Thanks for your time!


manowar
22 May 2017, 15:53

To use images you can use the html img tag, you can use this between words or in a new line.

 <img src="https://media.textadventures.co.uk/coverart/109ed488-1b68-4175-b34e-555cd0dad75a">

More info in https://www.w3schools.com/tags/tag_img.asp


alexandros123
22 May 2017, 18:14

I tried it because im using the
tags but id didnt work. It is probably because i didnt put a link in the src atribute(i put image.png which was saved on my desktop). Works very well not thanks alot!

(https://www.youtube.com/watch?v=P1GibafcYVU)


manowar
22 May 2017, 19:05

Yes, are you editing your game in online editor?, if correct for use images you may host the images in any free server y after link it with src attribute.

If you is editing your game in the desktop edition is same, host the images in online server or place it in the directory of the default history installation. I dont know now what is this directory, give me a moment and i tell you this.


manowar
22 May 2017, 19:10

In my case, when i use

<img src="hello.jpg"> 

i will place the image in the directory:

C:\Program Files (x86)\Squiffy\resources\app

Can you try this? Works fine for my in the desktop version.


alexandros123
22 May 2017, 22:09

Thank you very much!


IFforClassroom
24 May 2017, 02:33

If you're new to programming and Squiffy, and if you just want to put the image above or below the text without any fancy formatting, Markdown works.

![ImageTitle](http://www.WhereEverTheImageIs.com/ImageName)

story10
24 May 2017, 11:51

To IFforClassroom,
As far as I know, Image markdown tag does not work in Squiffy because it conflicts with passage tag of Squiffy.
Have you ever tried it in your Squiffy? Did it really work????? I can't believe it.


alexandros123
24 May 2017, 22:12

It does work for me.


story10
24 May 2017, 23:18

To IFforClassroom,
Give me your actual codes. I want to try it.


story10
25 May 2017, 23:21

To Manowar,
Is it possible to use image markdown tag in Squiffy?
image markdown tag use [ ] which is used in Squiffy to display passage text.
As such, it conflicts each other. So we can't use image markdown tag in Squiffy.
Right?

IFforClassroom,
Have you ever used image markdown tag in Squiffy?
or you just say the markdown tag you know without testing it in Squiffy?


IFforClassroom
26 May 2017, 08:14

Yes, story10, I'm putting the following picture into a game I'm slowly writing:

![Hugupo](http://3.im.guokr.com/u0IzGc-__1dyivNeOfGRvXKQMCVQo1axuh8TA1MROfz0AQAA9AEAAEpQ.jpg)

For a full working example, I'm using this method for some of the smaller images in my ESL game, May I ask you a story? which you can find in the Work In Progress section.


IFforClassroom
26 May 2017, 08:18

That said, it only works for online images, not for images in your zipped game folder. So you'll want to check licensing information or put your own images online to avoid copyright infringement.


story10
26 May 2017, 12:29

Thank you for explanation. I could correct my misunderstanding of markdown in Squiffy.


Bond, James bond
29 May 2017, 15:50

you see. that is how u do it
1/ go on google and find the picture u like. Note: do not save it to ur computer
2/ enter this into the script<img src="
3/ go back to the picture you want to put and just copy it. just copy it don't save it
4/ go back to the script and paste it
it gonna look something like this<img src="https://digiday.com/wp-content/uploads/2013/05/gatsby.gif
5/ ADD the " sign
make it look like this<img src="https://digiday.com/wp-content/uploads/2013/05/gatsby.gif" instead of <img src="https://digiday.com/wp-content/uploads/2013/05/gatsby.gif
6/ copy this style="width:600px;height:279px;">
now if u don't like the size of the picture. what do u do? easy adjust it. how
play with these two numbers the height and the width style="width:600px;height:279px;">

it does not get easier
ohhhh yeah baby its me. I am Ryan from fort Hamilton. Mr. G is the best


Alone walker
31 May 2017, 23:23

Ryan(james bond it helped thanx👍🏼