# Placing images from local drive

**URL:** <https://forum.pinegrow.com/t/placing-images-from-local-drive/3070>\
**Category:** Beginners\
**Created:** [June 5, 2019, 10:18am UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070 "2019-06-05T10:18:30Z")\
**Posts on this page:** 17\
**Page:** 1

<div class="post-metadata">

**Author:** ![another\_coder](https://avatars.discourse-cdn.com/v4/letter/a/a3d4f5/32.png) [@another\_coder](https://forum.pinegrow.com/u/another_coder)\
**Post date:** [June 5, 2019, 10:18am UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/1 "2019-06-05T10:18:30Z")

</div>

How can I access an image folder on my computer and place an image link in a location I want?

I have used the “img” button in ‘external content’ and moved it to the area I would like the image, but all I get is a huge placeholder image from pinegrow.

Somewhere must be a button to open the dialog box of my machine so I can select the image. I just can’t seem to find it.

Thanks.

---

<div class="post-metadata">

**Author:** ![Thomas](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/thomas/32/61_2.png) [@Thomas](https://forum.pinegrow.com/u/Thomas)\
**Post date:** [June 5, 2019, 12:02pm UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/2 "2019-06-05T12:02:42Z")

</div>

… too obvious?

![31](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/0/02358dd0cab4f8b32ee95b4a98188415ac529397.png)

Cheers

Thomas

---

<div class="post-metadata">

**Author:** ![another\_coder](https://avatars.discourse-cdn.com/v4/letter/a/a3d4f5/32.png) [@another\_coder](https://forum.pinegrow.com/u/another_coder)\
**Post date:** [June 5, 2019, 12:38pm UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/3 "2019-06-05T12:38:04Z")

</div>

Oh … where can I find that box?

---

<div class="post-metadata">

**Author:** ![Marf](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/marf/32/1799_2.png) [@Marf](https://forum.pinegrow.com/u/Marf)\
**Post date:** [June 5, 2019, 12:44pm UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/4 "2019-06-05T12:44:35Z")

</div>

Uhmmm, maybe **properties panel**. 🙈

---

<div class="post-metadata">

**Author:** ![Thomas](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/thomas/32/61_2.png) [@Thomas](https://forum.pinegrow.com/u/Thomas)\
**Post date:** [June 5, 2019, 12:58pm UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/5 "2019-06-05T12:58:27Z")

</div>

> [@Marf](#):
>
> Uhmmm, maybe **properties panel**. 🙈

Yup - should be visible by selecting the img-Tag (in workspace or DOM tree). It might appear beyond the properties panel if you have your workspace set to default (who knows).

Cheers

Thomas

---

<div class="post-metadata">

**Author:** ![another\_coder](https://avatars.discourse-cdn.com/v4/letter/a/a3d4f5/32.png) [@another\_coder](https://forum.pinegrow.com/u/another_coder)\
**Post date:** [June 5, 2019, 1:05pm UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/6 "2019-06-05T13:05:47Z")

</div>

Don’t make fun of me … I am trying hard to come to like this thing …😂

I found one image placement option under the heading of “Background”.  
 ![01](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/a/a7538665d7fb48d034286061d8e5069b931830d6.png)

Dinner time soon, but I’ll try to find before.

Thanks guys

---

<div class="post-metadata">

**Author:** ![Marf](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/marf/32/1799_2.png) [@Marf](https://forum.pinegrow.com/u/Marf)\
**Post date:** [June 5, 2019, 1:08pm UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/7 "2019-06-05T13:08:51Z")

</div>

That is the **visual editor** in the **CSS panel**!

CSS related things are in the **CSS panel** ,  
and (html) element related things are in the **Element Properties panel**.

* * *

> **[Element Properties | Pinegrow Web Editor](https://pinegrow.com/docs/master-pinegrow/element-properties/)**
>
> Use Element properties panel to edit element’s attributes. For example, to edit classes of any element, or to change source and alt text attributes of an image. The panel also contains controls for…

---

<div class="post-metadata">

**Author:** ![another\_coder](https://avatars.discourse-cdn.com/v4/letter/a/a3d4f5/32.png) [@another\_coder](https://forum.pinegrow.com/u/another_coder)\
**Post date:** [June 5, 2019, 1:13pm UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/8 "2019-06-05T13:13:45Z")

</div>

Heureka! Found it. Thank you very much indeed. — Ready for dinner. …

I should press more buttons … learn the workplace more … ok, starting to like this app.

Until next time, with another super simple question.😉

---

<div class="post-metadata">

**Author:** ![Marf](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/marf/32/1799_2.png) [@Marf](https://forum.pinegrow.com/u/Marf)\
**Post date:** [June 5, 2019, 1:22pm UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/9 "2019-06-05T13:22:38Z")

</div>

Enjoy your dinner (while i’m taking lunch).

* * *

> [@another\_coder](#):
>
> I should press more buttons … learn the workplace more …

Maybe watch this video to learn the interface :

> **[Pinegrow Walkthrough - Video | Pinegrow Web Editor](https://pinegrow.com/docs/getting-started/pinegrow-walkthrough-video/)**
>
> The Pinegrow Web Editor is a powerful tool. This tutorial will provide a quick walk-through of the main features of Pinegrow that will let you start designing you web project quickly!

* * *

---

<div class="post-metadata">

**Author:** ![Uwe](https://avatars.discourse-cdn.com/v4/letter/u/c57346/32.png) [@Uwe](https://forum.pinegrow.com/u/Uwe)\
**Post date:** [June 11, 2019, 10:05am UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/10 "2019-06-11T10:05:30Z")

</div>

Sorry, I didn`t get it how to use my own images from my local drive. The walkthrough video only explains the use of "unsplash" but not images from a local drive. I also tried to insert an image and get the placeholder image from Bootstrap. I don`t know how to change that image.  
[36|319x500](https://forum.pinegrow.com/uploads/short-url/aXVqRWV08JIEkJU60zXnt82Lq96.png)  
Thanks in advance,  
Uwe

---

<div class="post-metadata">

**Author:** ![Marf](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/marf/32/1799_2.png) [@Marf](https://forum.pinegrow.com/u/Marf)\
**Post date:** [June 22, 2019, 9:06pm UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/11 "2019-06-22T21:06:18Z")

</div>

> [@Uwe](#):
>
> `I don` t know how to change that image.

The answer is already given and can be found in this topic!

---

<div class="post-metadata">

**Author:** ![Uwe](https://avatars.discourse-cdn.com/v4/letter/u/c57346/32.png) [@Uwe](https://forum.pinegrow.com/u/Uwe)\
**Post date:** [June 23, 2019, 7:55am UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/12 "2019-06-23T07:55:36Z")

</div>

Yes and no. To replace an image it is helpfull to see what one is replaced, so there are at least two possibilities but for me so far I am not sure if it is really the same, which it is not, I guess. Because there is also the PROPERTIES-panel to REPLACE AN IMAGE.  
 ![38](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/3/3529596df956c73c45e85cbc4d12053d2023bc5b.png)  
With the one, shown here it is more like an ADD IMAGE. Is this true? BTW I am with Pinegrow to learn 😊  
So I found, using the POEMS example that the image is not shown in the visual editor. Using the WEBSY example, once the image/the background is clicked, the image shows up in the visual editor and therefor can be replaced. Using the MATERIALIZE example it is best to watch the tree and then one can see in the visual editor what you showed. For now, I am happy with it and always look inside the properties panel, the tree-panel and finally the visual editor and for reasons it is different in different cases, either start with plain html, with bootstrap or with materialize.  
Thanks anyway and Kind Regards,  
Uwe

---

<div class="post-metadata">

**Author:** ![Marf](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/marf/32/1799_2.png) [@Marf](https://forum.pinegrow.com/u/Marf)\
**Post date:** [June 23, 2019, 9:51am UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/13 "2019-06-23T09:51:36Z")

</div>

An image can be used differently, with HTML or CSS.

**HTML**  
It can be used with HTML as an `<img>` object/element, then you need the **“Element Properties”** panel.

> [@Uwe](#):
>
> ![38](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/3/3529596df956c73c45e85cbc4d12053d2023bc5b.png)

That’s the panel you posted a screenshot from.  
The “folder icon” at the end of the URL field and the “thumbnail” image is clickable,  
to change location and replace it with another image (if needed).

* * *

**CSS**  
Or with CSS as a CSS rule with a “background-image”,  
then you need the **“CSS panel”** with the " **Visual CSS Editor"**.

> [@another\_coder](#):
>
> ![01](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/a/a7538665d7fb48d034286061d8e5069b931830d6.png)

* * *

Hope this makes sense to you!

---

<div class="post-metadata">

**Author:** ![Uwe](https://avatars.discourse-cdn.com/v4/letter/u/c57346/32.png) [@Uwe](https://forum.pinegrow.com/u/Uwe)\
**Post date:** [June 24, 2019, 3:29pm UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/14 "2019-06-24T15:29:01Z")

</div>

Sorry for getting back late. Yes this makes kind of sense to me. It is just that sometimes the spot, your red arrows lead to, is empty although there´s an image visible and sometimes it is not empty with a visible image. Does this makes sense as well? Or is it that I got something wrong?  
Thanks in advance and Kind Regards,  
Uwe

---

<div class="post-metadata">

**Author:** ![Marf](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/marf/32/1799_2.png) [@Marf](https://forum.pinegrow.com/u/Marf)\
**Post date:** [June 24, 2019, 4:57pm UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/15 "2019-06-24T16:57:52Z")

</div>

> [@Uwe](#):
>
> It is just that sometimes the spot, your red arrows lead to, is empty although there´s an image visible

You must be sure that you have selected the correct (html) element, to see which “CSS rules” are applied and are in affect. It could also be a “parent” element, that has a “CSS rule” with the “background-image” set.

* * *

And an element could always have multiple “CSS rules” applied. So make sure you have selected the correct “CSS rule”. The “CSS panel” shows all the rules and properties that are in afffect.

* * *

Here you can find documentation about the “CSS panel”, maybe helpful to read it to understand it better how things are working.

> **[Styling with CSS | Pinegrow Web Editor](https://pinegrow.com/docs/master-pinegrow/style/)**
>
> Styling – painting and positioning elements – is done with CSS properties and rules. Pinegrow offers a collection of powerful styling tools to suit different tasks and workflows.

---

<div class="post-metadata">

**Author:** ![Uwe](https://avatars.discourse-cdn.com/v4/letter/u/c57346/32.png) [@Uwe](https://forum.pinegrow.com/u/Uwe)\
**Post date:** [June 24, 2019, 8:50pm UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/16 "2019-06-24T20:50:56Z")

</div>

Thanks very much. I will watch for sure and all other tutorials of course. Good to know, that multiple CSS rules could be applied to just one element.

Very Kind Regards,  
Uwe

---

<div class="post-metadata">

**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\
**Post date:** [July 1, 2019, 10:40pm UTC](https://forum.pinegrow.com/t/placing-images-from-local-drive/3070/17 "2019-07-01T22:40:36Z")

</div>

Very nice explanation there @Marf 🙂Keep up the good work\>  
I’m still alive, just lost in a land of sick horses.
