Can't Get The Theme Css To Work

Hello Everybody,

I’m new to the Yii Framework (all web development subjects for that matter) and I’m working through the Packt Publishing’s Beginning Yii.

My directory structre is something like:

/protected

/runtime

/www

All has been defined accordingly in main.php based on the course video and site is working just fine.

Through the course, there is a task regarding themes to be accomplished. Instructions are simple enough:

  1. copy the www folder from the course package to the related folder (in my case, /webroot/www/themes

themes folder includes:

classic

../views

../../layouts

../../site

../../system

photoGal

../css

../../screen.css

../images

../../bg.png

../views

../../layouts

../../site

../../system

  1. define the layout name in the protected/config/main.php

I have done as I asked, but theme did not seemed to work at all. I decided to tinker with the theme provided CSS a bit, but it does not seem to take any effect on the rendered webpage. I decided to go deep and I found the www/main.css file. When I change this, it does take effect. But when I change the www/themes/photoGal/css/screen.css file, it has no effect at all.

When I try to output <?php echo Yii::app()->theme->name ?> on a view, it prints out photoGal, so I think it is not related to the configuration.

Any ideas?

Make sure the path to screen.css in a layout is:




Yii::app()->theme->baseUrl.'/css/screen.css'



Hi Andy, thanks for your response.

I just inserted an echo statement for ->theme->baseUrl to one of my pages, it outputs:

/themes/photoGal

and path to my screen css is:

/themes/photoGal/css/screen.css

It seems ok, but still no luck.

Check page source code. Is /themes/photoGal/css/screen.css being loaded in head section? If styles don’t apply, then I guess not…

It seems it loads css files from /css folder only (/css/screen.css, /css,print.css etc). /themes/photoGal is not present in the source whatsoever.

By the way, relevant section of my config file (main.php) is as follows:




function _joinPath($dir1, $dir2) {

    return realpath($dir1 .'/' . $dir2);

}


$homePath       = dirname (__FILE__). '/../..';

$protectedPath  = _joinPath($homePath, 'protected');

$webrootPath    = _joinPath($homePath, 'www');

$runtimePath    = _joinPath($homePath, 'runtime');




return array(

	'basePath'      => $protectedPath,

        'runtimePath'   => $runtimePath,

	'name'=>'Photo Gallery',

        'theme'=> 'photoGal',


	// preloading 'log' component

	'preload'=>array('log'),

So your layout looks like:




<!DOCTYPE html>

<html lang="ru">

<head>

    ...

    <link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->baseUrl; ?>/css/main.css" />

    ...

</head>

...



? But it should be Yii::app()->theme->baseUrl instead.

Oh, silly me. I somehow figured that Yii will automatically look to the themes folder for css files even without a layout file in it. I don’t know where did I get that idea. I copied the layout files to the theme folder and modified as you described, now it works like a charm. Thank you very very much!

Hello,

this actually did not work for me. It did indeed apply the screen.css style from the theme, but all the information from the original screen.css was, as can be excpected not applied so I did not get the same result as in the video. The solution I found was to leave the original reference to the main screen.css and add a line for the theme’s screen.css


<link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->request->baseUrl; ?>/css/screen.css" media="screen, projection" />

<link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->theme->baseUrl; ?>/css/screen.css" media="screen, projection" />

	

How come the author of the videos gets things working fine without all this though?

Cheers

Hello

The theme should have a layout file, and in my Dev version it is present, but somehow it is not in the Section 2 zip files.

You can find the correct version in the Section 3 zip file, so copy the theme directory from the Section 3 zip into your www directory.

Hi Chris,

There’s also no layout file in Section 3 Zip file, i found one in Section 4. Hope this helps others who also purchased the video :)