# Show image on physical phone

**URL:** <https://forum.ionicframework.com/t/show-image-on-physical-phone/116145>\
**Category:** ionic-v3\
**Created:** [December 21, 2017, 11:41pm UTC](https://forum.ionicframework.com/t/show-image-on-physical-phone/116145 "2017-12-21T23:41:10Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![corinekamlo](https://avatars.discourse-cdn.com/v4/letter/c/e19b73/32.png) [@corinekamlo](https://forum.ionicframework.com/u/corinekamlo)\
**Post date:** [December 21, 2017, 11:41pm UTC](https://forum.ionicframework.com/t/show-image-on-physical-phone/116145/1 "2017-12-21T23:41:10Z")

</div>

Hello

in an ionic project, how to make the images appear on the phone.

I put my images in an img folder present in www. when i do ionic serve or ionic lab, my images show up well but when i do ionic cordova build android, no picture is displayed.  
how to arrange that please?

---

<div class="post-metadata">

**Author:** ![user5555](https://avatars.discourse-cdn.com/v4/letter/u/8e7dd6/32.png) [@user5555](https://forum.ionicframework.com/u/user5555)\
**Post date:** [December 22, 2017, 12:27am UTC](https://forum.ionicframework.com/t/show-image-on-physical-phone/116145/2 "2017-12-22T00:27:07Z")

</div>

put your images in `src/assets/img/` and load them with relative paths like `assets/img/img.png` works for me.

---

<div class="post-metadata">

**Author:** ![corinekamlo](https://avatars.discourse-cdn.com/v4/letter/c/e19b73/32.png) [@corinekamlo](https://forum.ionicframework.com/u/corinekamlo)\
**Post date:** [December 22, 2017, 10:48am UTC](https://forum.ionicframework.com/t/show-image-on-physical-phone/116145/3 "2017-12-22T10:48:32Z")

</div>

for me, it works when I use the img tag.  
but when I try to put the same image as the background of a div by doing eg background: url (’./ assets / img / myImage.jpg’), the image is displayed in the browser but when i install the application on my phone, the image is no longer displayed.

---

<div class="post-metadata">

**Author:** ![user5555](https://avatars.discourse-cdn.com/v4/letter/u/8e7dd6/32.png) [@user5555](https://forum.ionicframework.com/u/user5555)\
**Post date:** [December 22, 2017, 1:51pm UTC](https://forum.ionicframework.com/t/show-image-on-physical-phone/116145/4 "2017-12-22T13:51:48Z")

</div>

> [@corinekamlo](#):
>
> url (’ **./** assets / img / myImage.jpg’)

try instead  
`url (’assets/img/myImage.jpg’)`  
without the `./` in the front

---

<div class="post-metadata">

**Author:** ![anna\_liebt](https://avatars.discourse-cdn.com/v4/letter/a/bc8723/32.png) [@anna\_liebt](https://forum.ionicframework.com/u/anna_liebt)\
**Post date:** [December 22, 2017, 2:20pm UTC](https://forum.ionicframework.com/t/show-image-on-physical-phone/116145/5 "2017-12-22T14:20:15Z")

</div>

Hello,  
like @user5555 adviced everything in src is copied at build prozess to the www folder.  
Maybe from foo.scss works url(’…/assets/…  
Maybe from foo.ts works url('assets/…

Best reagrds, anna-liebt

---

<div class="post-metadata">

**Author:** ![corinekamlo](https://avatars.discourse-cdn.com/v4/letter/c/e19b73/32.png) [@corinekamlo](https://forum.ionicframework.com/u/corinekamlo)\
**Post date:** [December 22, 2017, 2:31pm UTC](https://forum.ionicframework.com/t/show-image-on-physical-phone/116145/6 "2017-12-22T14:31:26Z")

</div>

it still does not work @user5555

---

<div class="post-metadata">

**Author:** ![corinekamlo](https://avatars.discourse-cdn.com/v4/letter/c/e19b73/32.png) [@corinekamlo](https://forum.ionicframework.com/u/corinekamlo)\
**Post date:** [December 22, 2017, 2:36pm UTC](https://forum.ionicframework.com/t/show-image-on-physical-phone/116145/7 "2017-12-22T14:36:20Z")

</div>

Anna I can not understand the last 2 lines of your comment.  
I am French speaking, I use a translation software to translate your messages

can you explain again?

---

<div class="post-metadata">

**Author:** ![anna\_liebt](https://avatars.discourse-cdn.com/v4/letter/a/bc8723/32.png) [@anna\_liebt](https://forum.ionicframework.com/u/anna_liebt)\
**Post date:** [December 22, 2017, 3:12pm UTC](https://forum.ionicframework.com/t/show-image-on-physical-phone/116145/8 "2017-12-22T15:12:00Z")

</div>

Hello,  
foo is a placeholder of your filename.

So yourfilename.scss, from where your css will created, need as far as I know (because I am a bloody beginner on web things) a path, for example for background

```auto
.myclass{
    background-image: url('../assets/backgrounds/hotthings.png');
  }

```

and is in html used as

```auto
<ion-content class='myclass'></ion-content>

```

If you will set background in yourfilename.html you set for example

```auto
<ion-content style='background-image: url(assets/backgrounds/hotthings.png'>

```

If you set it to a image it looks like

```auto
<img src='assets/backgrounds/hotthings.png'>

```

So depending where you set it und to what you set it, it will look a little bit different.

I often set things from yourfilename.ts and here I use the path like in .html will needed.

Sorry for my bad english, but my french is much more worser, okay a few not acceptable words and sentence I can speak understandable.

Best regards, anna-liebt

---

<div class="post-metadata">

**Author:** ![corinekamlo](https://avatars.discourse-cdn.com/v4/letter/c/e19b73/32.png) [@corinekamlo](https://forum.ionicframework.com/u/corinekamlo)\
**Post date:** [December 22, 2017, 7:39pm UTC](https://forum.ionicframework.com/t/show-image-on-physical-phone/116145/9 "2017-12-22T19:39:55Z")

</div>

ok thank you @anna_liebt

---

<div class="post-metadata">

**Author:** ![user5555](https://avatars.discourse-cdn.com/v4/letter/u/8e7dd6/32.png) [@user5555](https://forum.ionicframework.com/u/user5555)\
**Post date:** [December 23, 2017, 7:08pm UTC](https://forum.ionicframework.com/t/show-image-on-physical-phone/116145/10 "2017-12-23T19:08:49Z")

</div>

> [@corinekamlo](#):
>
> I am French speaking, I use a translation software to translate your messages

I would strongly recommend learning english. It’s very useful in programming. By the way english isn’t my native language either - im german.

---

<div class="post-metadata">

**Author:** ![corinekamlo](https://avatars.discourse-cdn.com/v4/letter/c/e19b73/32.png) [@corinekamlo](https://forum.ionicframework.com/u/corinekamlo)\
**Post date:** [December 24, 2017, 12:07am UTC](https://forum.ionicframework.com/t/show-image-on-physical-phone/116145/11 "2017-12-24T00:07:55Z")

</div>

I already do it

thank you for the recommendation

---

<div class="post-metadata">

**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\
**Post date:** [July 19, 2021, 9:57pm UTC](https://forum.ionicframework.com/t/show-image-on-physical-phone/116145/12 "2021-07-19T21:57:53Z")

</div>

Closed on July 19, 2021, 9:57pm UTC


