File URLs in css Topic is solved

Everything to do with Joomla! 4.x templates and templating.

Moderator: General Support Moderators

Forum rules
Forum Rules
Absolute Beginner's Guide to Joomla! <-- please read before posting, this means YOU.
Forum Post Assistant - If you are serious about wanting help, you will use this tool to help you post.
Windows Defender SmartScreen Issues <-- please read this if using Windows 10.
Post Reply
MarkRS
Joomla! Enthusiast
Joomla! Enthusiast
Posts: 195
Joined: Thu Oct 29, 2009 8:28 am
Location: UK

File URLs in css

Post by MarkRS » Wed Nov 30, 2022 12:06 pm

It seems to be a J4 thing that absolute internal URL paths in css are no longer based on the html root, is that right?

For example

Code: Select all

.background { background-image: url("/images/myBackground.png"); }
doesn't pick that file out of the images directory. It did in J!3. If I take away the initial "/" then it does work, but only for top level menu items.

Or is this a template issue? I'm now using helix_ultimate, which I wasn't with the J!3 version of the site.

How do I fix this? I don't really want to write the full path, because that's going to make a lot of work when shifting the site between hosts (for example for creating a local test version).
It's a community, the more we all contribute, the better it will be.

User avatar
Pavel-ww
Joomla! Guru
Joomla! Guru
Posts: 905
Joined: Tue Jun 30, 2020 12:17 pm

Re: File URLs in css

Post by Pavel-ww » Wed Nov 30, 2022 1:00 pm

MarkRS wrote:
Wed Nov 30, 2022 12:06 pm
It seems to be a J4 thing that absolute internal URL paths in css are no longer based on the html root, is that right?

Or is this a template issue? I'm now using helix_ultimate, which I wasn't with the J!3 version of the site.
Hi. Such a problem does not exist either in Joomla or Helix. Most likely you use an incorrect selector or not a sufficiently strong selector for your case. Or your site located in folder but not in root. That is, the problem is in your code I think. Without a link to the page, I can’t say anymore. You should explore this through the browser code inspector to find the cause
Last edited by Pavel-ww on Wed Nov 30, 2022 1:05 pm, edited 1 time in total.

Diesel__
Joomla! Apprentice
Joomla! Apprentice
Posts: 23
Joined: Tue Jul 28, 2009 1:17 pm

Re: File URLs in css

Post by Diesel__ » Wed Nov 30, 2022 1:03 pm

Hi!
You can add another folder path like:

Code: Select all

.background { background-image: url("../../../../../etc/etc/myBackground.png"); }

MarkRS
Joomla! Enthusiast
Joomla! Enthusiast
Posts: 195
Joined: Thu Oct 29, 2009 8:28 am
Location: UK

Re: File URLs in css

Post by MarkRS » Wed Nov 30, 2022 2:51 pm

Thanks for that Pavel. The issue might be that this (my test site) isn't in the html root. I thought this used to work, but in fact I'm not sure, and it's too hard to test (my J3 versions don't run on PHP 8. I know I could change things to check, I'm not going to spend the time to do that), I'll find out when I export my changed site to the root of a hosted test area.

Diesel__, thanks, but that won't help, will it? I'd still have to code for each menu instance explicitly, which is what I don't want surely.
It's a community, the more we all contribute, the better it will be.

MarkRS
Joomla! Enthusiast
Joomla! Enthusiast
Posts: 195
Joined: Thu Oct 29, 2009 8:28 am
Location: UK

Re: File URLs in css

Post by MarkRS » Wed Nov 30, 2022 4:05 pm

Pavel, yup, that's what it was, not being in the html root. It works once that's corrected.

Thanks again.
It's a community, the more we all contribute, the better it will be.

User avatar
Pavel-ww
Joomla! Guru
Joomla! Guru
Posts: 905
Joined: Tue Jun 30, 2020 12:17 pm

Re: File URLs in css

Post by Pavel-ww » Wed Nov 30, 2022 4:35 pm

You are wellcome :)


Post Reply

Return to “Templates for Joomla! 4.x”