+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: CodeIgniter 4 (https://forum.codeigniter.com/forumdisplay.php?fid=28)
+--- Forum: CodeIgniter 4 Support (https://forum.codeigniter.com/forumdisplay.php?fid=30)
+--- Thread: base URL for external stylesheet ? (/showthread.php?tid=76414)
base URL for external stylesheet ? - kilden - 05-11-2020
Hello,
This is my first message here and I’m a newbie on Codeigniter 4 (and I didn’t know Ci3).
Maybe I don't know a trick to deal with relative path in my stylesheet and I've got this problem :
I did an app on local (on root) and now I'm testing it online in a subfolder (« demo ») on my website. I’ve changed baseURL in config files (App.php and .env like : http://mydomain.com/demo/) and added the function baseURL() on all my hyperlinks. So, everything is ok for testing online, except...
Every URL in my external CSS sheets are wrong and and I can't change them with a php function. ( for exemple background : url('/img/arrow-top.svg'); should be background : url('demo/img/arrow-top.svg') ) Is there a way to fix that (with Ci4, html, htacess ?) without changing my CSS (and re-change them when I put my website on the root ?)
I've tried to put a base in my header :
<base href="<?php echo base_url(); ?>/" target="_blank">
...but this only affect href on my pages... not the relative path inside my external stylesheet.
Thank you in advance for any reply.
RE: base URL for external stylesheet ? - kilden - 05-11-2020
hum... I just see that post which indicates there is no perfect solution... just "place the CSS images in at least the same level as the CSS file so that you don't need to go backwards in the path" :
https://stackoverflow.com/questions/3812375/specifying-base-url-for-css
RE: base URL for external stylesheet ? - jreklund - 05-11-2020
You need to design your application to either:
../img/
or
/img/
And with the last option, on your live server set up an subdomain:
http://demo.mydomain.com/
So your assets are loading.
RE: base URL for external stylesheet ? - John_Betong - 05-11-2020
My solution is to assume that index.php is in the base_url() and to create a relative "asset/csse/" sub-folder. Because index.php is always called first then the paths to the CSS files will always be in the sub-folder.
RE: base URL for external stylesheet ? - kilden - 05-11-2020
so, if my original structure is :
Code:
- codeigniter (.env app system writable …)
- public
- assets (css img js)
- index.phpYou would just do :
Code:
- codeigniter (.env app system writable …)
- public
- assets (css img js)
- demo
- index.php- Either I leave assets on the root
- or I have to change all URL in my CSS and add "demo/" (even if my baseURL and index.php is "demo/")
RE: base URL for external stylesheet ? - jreklund - 05-12-2020
If you don't want to create a sub-domain, you should leave your assets folder alongside you index.php and create a rewrite rule for it. But that means you need to edit your main domains .htaccess file. Also, that means every request are doubled, for CSS, images and JS.
https://stackoverflow.com/a/19494604
Code:
RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(?:[^/]*/)*([^/.]+\.(?:jpe?g|gif|bmp|png|tiff|css|js))$ /assets/$1 [R=301,L,NC]RE: base URL for external stylesheet ? - kilden - 05-15-2020
Thank you for your help !
Well I've never used sub-domain... I thought the sub-domain "demo.domain.com" was just an alias to the subfolder domain.com/demo...
But with a subdomain, the .htaccess inside it have only an influence for the subdomain and the CSS works as if it was in the root folder ?
or I should add your rule ?
Code:
RewriteRule ^(?:[^/]*/)*([^/.]+\.(?:jpe?g|gif|bmp|png|tiff|css|js))$ /assets/$1 [R=301,L,NC]Because I didn't change anything of this htaccess code :
Code:
# Disable directory browsing
Options All -Indexes
# ----------------------------------------------------------------------
# Rewrite engine
# ----------------------------------------------------------------------
# Turning on the rewrite engine is necessary for the following rules and features.
# FollowSymLinks must be enabled for this to work.
<IfModule mod_rewrite.c>
Options +FollowSymlinks
RewriteEngine On
# If you installed CodeIgniter in a subfolder, you will need to
# change the following line to match the subfolder you need.
# http://httpd.apache.org/docs/current/mod/mod_rewrite.html#rewritebase
# RewriteBase /
# Redirect Trailing Slashes...
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)/$ /$1 [L,R=301]
# Rewrite "www.example.com -> example.com"
RewriteCond %{HTTPS} !=on
RewriteCond %{HTTP_HOST} ^www\.(.+)$ [NC]
RewriteRule ^ http://%1%{REQUEST_URI} [R=301,L]
# Checks to see if the user is attempting to access a valid file,
# such as an image or css document, if this isn't true it sends the
# request to the front controller, index.php
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php/$1 [L]
# Ensure Authorization header is passed along
RewriteCond %{HTTP:Authorization} .
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
</IfModule>
<IfModule !mod_rewrite.c>
# If we don't have mod_rewrite installed, all 404's
# can be sent to index.php, and everything works as normal.
ErrorDocument 404 index.php
</IfModule>
# Disable server signature start
ServerSignature Off
# Disable server signature endI'm a little lost with htacess...
RE: base URL for external stylesheet ? - jreklund - 05-15-2020
Depending on webhost provider, a subdomain may point to your domain.com/demo folder, or it can be a completely different folder. Depending on how you can set-up things.
example.com
/public_html
demo.example.com
/demo.example.com/public
If you can do the second option, specifying your own folder. Point it into the public folder and place your assets folder alongside your index.php. So that you can only specify "url('/assets/img/arrow-top.svg');"