CODEWITHSUNDEEP
cssbigcommerce
Jaydeep
Jaydeep

Reputation: 38

How can I add a background image in Stencil

I have to upload a image through cyberduck to (content/img/add-to-wish.png) but the image can't be found. How can I fix this issue?

I am using background: #fff url("../img/add-to-wish.png");.

Upvotes: 0

Views: 1543

Answers (1)

thannes
thannes

Reputation: 778

To call images inside your webdav content folder in your SCSS files, call them like so. example webdav file structure content/img/filename.jpg

background: #fff url("/content/img/filename.jpg") no-repeat 50% 50%;

To call images from your projects assets/scss files inside your SCSS files, use the following structure.

background: #fff url("../img/filename.jpg") no-repeat 50% 50%;

To call images inside your theme's assets/img folder in your HTML files, use the cdn handlebar helper below.

<img src="{{cdn 'img/filename.jpg'}}">

To call images inside your webdav content folder in HTML files, use the cdn helper with a webdav prefix. webdav file structure content/img/filename.jpg

<img src="{{cdn "webdav:img/image.jpg"}}">

Upvotes: 1

Related Questions