Welcome Guest, Not a member yet? Register   Sign In
Set Base URL to background image path in External CSS
#1

Any one can help me to add base url to my background image path in my external css. My code like below. 

PHP Code:
aside.main-sidebar{
 
   background-imagelinear-gradient(90degrgba(0,0,0,0.4), rgba(0000.2)),
 
           url(/ui/assets/img/bg4.jpg) !important;
 
   background-sizecover;
 
   background-positioncenter;

Reply
#2

And why do you need to do it? I got everything setup with absolute paths (like above) and some script use relative paths instead, like Jquery UI.
Reply
#3

Assuming you are developing on one machine, and deploying to somewhere else, so the domain names will be different on all the instances, best solution usually means using relative paths.

You know where the CSS is, so you can go from there, replace it with ../../ui/assets/img for example. Remember not to start with / as this will point to your base domain.

If you absolutely must do absolute paths in CSS file, you could set up a controller that outputs CSS file format text, however 99% of the time that's just over-complicating something that can be done with very straight forward solution.
Reply
#4

(06-22-2018, 01:24 AM)Pertti Wrote: Assuming you are developing on one machine, and deploying to somewhere else, so the domain names will be different on all the instances, best solution usually means using relative paths.

You know where the CSS is, so you can go from there, replace it with ../../ui/assets/img for example. Remember not to start with / as this will point to your base domain.

If you absolutely must do absolute paths in CSS file, you could set up a controller that outputs CSS file format text, however 99% of the time that's just over-complicating something that can be done with very straight forward solution.


I have add it like below. But it not work

PHP Code:
aside.main-sidebar{
 
   background-imagelinear-gradient(90degrgba(0,0,0,0.4), rgba(0000.2)),
 
           url(../../ui/assets/img/bg4.jpg) !important;
 
   background-sizecover;
 
   background-positioncenter
Reply
#5

(06-22-2018, 04:20 AM)sanjaya Wrote: I have add it like below. But it not work

It was just an example, but if you tell me in which folder your CSS is, I can probably help to piece it together.
Reply
#6

(06-22-2018, 04:24 AM)Pertti Wrote:
(06-22-2018, 04:20 AM)sanjaya Wrote: I have add it like below. But it not work

It was just an example, but if you tell me in which folder your CSS is, I can probably help to piece it together.


It's in http://localhost/projects/charity/assets.../admin.css
Reply
#7

Ok so you want to go from:
/projects/charity/assets/dist/css/admin.css
to:
/ui/assets/img/bg4.jpg

So you have to go up 5 directories, then back in, which would make final URL:
../../../../../ui/assets/img/bg4.jpg
Reply
#8

(06-22-2018, 06:30 AM)Pertti Wrote: Ok so you want to go from:
/projects/charity/assets/dist/css/admin.css
to:
/ui/assets/img/bg4.jpg

So you have to go up 5 directories, then back in, which would make final URL:
../../../../../ui/assets/img/bg4.jpg



It's not work...
Reply
#9

(06-25-2018, 12:11 AM)sanjaya Wrote: It's not work...

Based on what you provided earlier, should work but what's the full URL, with domain, to the image?
Reply
#10

(06-25-2018, 12:31 AM)Pertti Wrote:
(06-25-2018, 12:11 AM)sanjaya Wrote: It's not work...

Based on what you provided earlier, should work but what's the full URL, with domain, to the image?

This is directory: http://sghapps.tk/ui/assets/img/bg4.jpg
Reply




Theme © iAndrew 2016 - Forum software by © MyBB