I have seen many questions regarding linking to theme assets in CakePHP and none of them are resolving my issue and also the most recent post was in 2012 so I thought I'd float my question out there.
I have implemented themes in my CakePHP 2.2.4 application. My theme called "default" (previously called "Default" up until 1 minute ago) is located at app/View/Themed/default
(previously the theme name had a corresponding capital D for the folder name as well).
My css file is located at app/View/Themed/default/webroot/css/style.css
which I call in app/View/Themed/default/Layouts/default.ctp
with the following code
Default.ctp layout
echo $this->Html->css('style');
(I have tried using capital W for webroot "just in case" but no surprise that didn't work)
I have included this link in my AppController to establish what theme I am using. All the view files point to the correct theme but the issue right now is with the stylesheet (I have yet to mess with other assets such as js or image files).
AppController
class AppController extends Controller {
public $theme = 'default'; // previously 'Default'
// also, have used both 'public $theme' and 'var $theme', no difference
I have read the following questions and none of the "solutions" have worked. Most of the solutions were to check spelling/capitalization, check permissions on the folders, check my .htaccess file, etc. Still nothing. And new ideas?
.htaccess
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteRule ^$ app/webroot/ [L]
RewriteRule (.*) app/webroot/$1 [L]
</IfModule>
The folder permission for the theme webroot and css folders are 755.
Here are some resources I used with no luck.
http://book.cakephp.org/2.0/en/views/themes.html
CakePHP theme resources return error
Unable to get css and image files in Themes webroot folder of cakephp
https://groups.google.com/forum/#!topic/cake-php/xaRAugMoNSc
https://groups.google.com/forum/#!topic/cake-php/siYVWchUb1g
UPDATE: using $this->Html->image('image.jpg')
correctly displays the defined image located at View/Themed/Default/webroot/img/image.jpg
. However, using $this->Html->css('style')
tries to pull the stylesheet from app/webroot/css/style.css
and not from app/View/Themed/Default/webroot/css/style.css
. I also had to the change the theme name and folder name of my theme back to "Default" with an uppercase D in order to get the image to link correctly. The stylesheet still does not link correctly. If I navigate directly to my theme stylesheet in my browser, a blank page appears. If I navigate to a style sheet that doesn't exists in my theme folder then I get the proper error message. However, viewing the source of my theme stylesheet (the one that does exist), shows a blank page.
Ok so perhaps this is obvious...but my stylesheet uses functions I have created in a custom Helper. When the stylesheet is located in app/webroot/css
, there is no issue, but when the stylesheet is located in app/View/Themed/Default/webroot/css
it can't display properly and therefore Cake links to the non-existent stylesheet supposed to be located in app/webroot/css
. I have removed the helpers from my theme stylesheet and it all works now.
I have also reverted the theme name from "default" to "Default" in order for the images to display properly using $this->Html->image
(and presumably the stylesheet and JS files as well) even though the view files were linked correctly regardless of the capitalization.