Pinegrow Community Support Forum

Placing images from local drive

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.

… too obvious?

31

Cheers

Thomas

Oh … where can I find that box?

Uhmmm, maybe properties panel. :see_no_evil:

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

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

I found one image placement option under the heading of “Background”.
01

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

Thanks guys

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.


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.:wink:

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


Maybe watch this video to learn the interface :


Sorry, I didnt 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 dont know how to change that image.
36|319x500
Thanks in advance,
Uwe

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

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
With the one, shown here it is more like an ADD IMAGE. Is this true? BTW I am with Pinegrow to learn :blush:
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

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.

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".


Hope this makes sense to you!

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

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.

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

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