HTML & CSS how do I pull an image from one website to another

[Orenthal]

Hey guys I'm unsure of how to pull information from one website to another

 

[Malcolm]

Hello,

Are you familiar with the <img> tag? So I'm assuming what you mean is that you want to display an image that is hosted on another website. In order to do this, you can edit the img src to something like https://codeforum.org/styles/uix_pro/images/logo.png.

But, I want you to do some research.. I want you to take a look at this and see if you can figure this out https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img

Spoiler: Answer

<img src="https://codeforum.org/styles/uix_pro/images/logo.png">

Or do you mean like pulling information via API like @Mathematical mentioned down below?

 

[Mathematical]

Well, we'll need you to define what information. You specify an image in the title but in the post you just say, "information".

So, is it just an image, an image with a caption underneath it, or is it both images, captions, and text?

In regards to pulling and gathering information from one site to another, sites like Reddit provide APIs that you can use to display content from their sites. You'll need to create an account to use their APIs though unfortunately, then go through the process of actually creating an API that you can use for work inside your site.

I take it that an API is what you're currently after anyway.

 

[Orenthal]

You guys are amazing didn't think anyone would reply .
Okay For example on amazon when ordering an item you can choice the quantity, colour and style if I was to select this how could I get that same information displayed on a completely separate page, automatically?

 

[Tealk]

But what you should also keep in mind: Are you allowed to use the picture or do you have the copyright to the picture?

 

[Mathematical]

Okay For example on amazon when ordering an item you can choice the quantity, colour and style if I was to select this how could I get that same information displayed on a completely separate page, automatically?

I believe that something like this could be achieved using an OOP(Object-Oriented-Programming) language such as PHP, Python, Ruby, or Java.

You'll be using objects("Instances") to contain this data. But the class(We'll call it "Item"), will also contain methods that get this data from the user, and then return that data to be displayed on the next page before confirming the order.

Working off of your example, here's how you'd be doing what I mentioned above in Java:

public class DataExample {
     public static void main(String args[]) {
          /*
           * Note that these are just values that I've assigned for this example.
           * Your own code may or may not have the ability for the user to assign their own
           * values(If getting input is what your program will be doing).
          */
          Item Item1 = new Item("Chair", "Brown", 1);
          
          System.out.println("Item Name: " + Item1.ReturnItemName());
          System.out.println("Item Colour: " + Item1.ReturnItemColour());
          System.out.println("Quantity: " + Item1.ReturnQuantity());
     }
}

class Item {
     // Instance-Fields
     private String ItemName;
     private String ItemColour;
     
     private int Quantity;

     // Constructor
     public Item(String IName, String IColour, int Quantity) {
          ItemName = IName;
          ItemColour = IColour;
          this.Quantity = Quantity;
          /*
           * ^^^ Note that "this.Quantity" refers to the instance-fields part of the class. Not the
           * "Quality" declared in the constructor parameters.
          */
     }

     public String GetItemName() {
          //...
          return ItemName;
     }
     
     public String GetItemColour() {
          //...
          return ItemColour;
     }

     public int GetQuantity() {
          //...
          return Quantity;
     }

     public String ReturnItemName() {
          return ItemName;
     }

     public String ReturnItemColour() {
          return ItemColour;
     }

     public int ReturnQuantity() {
          return Quantity;
     }
}

Again, this is just an example piece of code working off of your example.

Mind you, the handling of images would be completely different and so, your code would look completely different from this example.

Now as stated, trying to get an image from one website to your own, would more than likely involve the use of OOP. I don't see traditional procedural-programming(So just things like functions and structures. There is no such thing as classes or objects in procedural-languages), being able to work. It might, but I don't see it happening.

Languages like PHP and Ruby support OOP, so if possible, perhaps invest a little bit of time into learning them. Although, a language like PHP may actually stop you from needing to use OOP, and in the end you can still use procedural-programming in PHP for the end result.

 

[Orenthal]

woooooow thank youuuuu!!!!