Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

We've moved the forum!

Please use forum.silverstripe.org for any new questions (announcement).
The forum archive will stick around, but will be read only.

You can also use our Slack channel or StackOverflow to ask for help.
Check out our community overview for more options to contribute.

General Questions /

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, Ed, biapar, Willr, Ingo, swaiba

How to add a style sheet to a very basic module [Partly solved]


Go to End


17 Posts   2424 Views

Avatar
martimiz

Forum Moderator, 1391 Posts

4 August 2012 at 5:23am

There seems to be nothing wrong with your Requirements::css statement as such, as far as I can see. Point is - is your init() function ever called? You could check that by placing a echo "***************"; or something of the kind in init()

Avatar
simples

Community Member, 77 Posts

4 August 2012 at 5:45am

Hi martimiz,

Thank you for the tip.

I may not have followed your instruction correctly but when I place echoes in helloworld\code\Helloworld.php as shown below

<START OF CODE>
<?php

class Helloworld_Controller extends Page_Controller {
public function init() {
echo "***************";
parent::init();
Requirements::css("helloworld/css/Helloworld.css");
echo "***************";
}
}
<END OF CODE>

the inserted echoes do not appear in content sent to the screen. In fact, I can place "exit;" at the top of this script below the opening php brace and this makes no difference to what content is sent to the screen.

Avatar
martimiz

Forum Moderator, 1391 Posts

4 August 2012 at 6:25am

Edited: 04/08/2012 6:26am

Just to make sure I know what you're doing:

1. create Helloworld.php with two(!) classes:

<?php
class Helloworld extends Page {
}
class Helloworld_Controller extends Page_Controller {
	public function init() {
		parent::init();
		echo "*** init ***";
		Requirements::css('helloworld/css/Helloworld.css');
	}
}

2. go to yourdomain/dev/build?flush=1

3. Visit the CMS, and create and publish a Page of type Helloworld (it should now be available in the CMS)

4. check your new page on the website...

Avatar
simples

Community Member, 77 Posts

4 August 2012 at 7:23am

Hi martimiz,

After I follow your instructions, and browse the new helloworld page, the following appears on the screen.

*** init ***Hello world!

You sound like you are on the right track. You introduced something new in your instructions in so far as the file which contains my module's controller class did not contain an object class. It now does.

Ultimately what I would like to do is reaaly basic. I would like to include the module's template in another template so that the modules style sheet appears between the head tags of this other template.

This other template is at themes/tutorial/templates/Page.ss

Avatar
simples

Community Member, 77 Posts

4 August 2012 at 8:26am

Hi,

Further to my last comment, I think the problem could lie with the content which I have got in the object and controller class. The complete file is shown below. Moving the call to Requirements into the object class did not work. However I was not sure of how to do this. In fact I do not recollect ever seeing a call to Requirements in the object class although I may have missed this.

<START OF FILE>
<?php

class Helloworld extends Page {
}

class Helloworld_Controller extends Page_Controller {
public function init() {
parent::init();
echo "*** init ***";
Requirements::css('helloworld/css/Helloworld.css');
}
}
<END OF FILE>

Avatar
martimiz

Forum Moderator, 1391 Posts

4 August 2012 at 10:41pm

I still think you don't quite grasp the way SilverStripe works. I hear you talking about a 'Module controller' but there really isn't such a thing. What you have is a page type, consisting of a model class, that takes care of managing data, and letting you use it in the cms, and a controller class that takes care of using templates and other logic to show the page on the website.

A module can have many different pagetypes - or even none at all, depending on its purpose. The reasons you might want to create a module is to combine functionalty you want to re-use, and you want others to be able to easily install as well. But as long as you're still learning SilverStripe, you might want to stick to mysite, to make things as simple as possible...

As for the location of the css links in HTML: The Requirements class will take care of that. Doesn't really matter where you place the call, silverstripe will collect all css links and place them in their proper location in the HTML header. That is: if it can find the file. If not, it will just skip it. So if your css file isn't loaded, check the location and the requirements URL again.

I know things can get a bit daunting at first, especially if you 're not very experienced in OOP, but once you get a proper grasp, you'll soon see the beauty of it. And do revisit the tuts, we all did :-)

Good luck

Avatar
simples

Community Member, 77 Posts

5 August 2012 at 1:52am

Edited: 05/08/2012 10:42am

Hi martimiz,

Thank you for the tips.

I have spent quite a lot of time going through and playing around with Tuturials 1 and 2. Since I then started to build something which will be a chore to reconstitute whenever I start a new project (a slideshow), I then thought I would have a go at building an extremely simple, basic module. Yes, I probably jumped into this too quick. Perhaps I should have spent more time looking at the tutorials.

Even though I spent some time looking at the tutorials and reading other sources of material (I have the 2 books), it is only when I tried to create this simple module that I hit problems. I just could not get the code to link to a css file. This only occurs when I try to do this using Requirements::. I have no problem achieving this when I use a require control structure in the module template. I can also use Requirements:: when I place the call in a controller class in a code file outside the module folder. Also when replacing the 2-level menu in Tuturial 1 with a dropdown menu, I was able to link to a css file which lived below a themes folder using Requirements::. The problem only occurs when I use Requirements:: in a module code folder when trying to link to a css file in a module css folder.

I have now decided to move on as I have now spent far too much time trying to suss out this basic issue. No doubt the solution has been staring me in the face and is due to a stupid oversight. Anyway I get the impression that using a require control structure is a recognized and standard way of linking to a style sheet and if for some reason I need to use Requirements::, I will revisit the problem, when I have built up more experience.

Thank you for taking the trouble to respond to my posts.

Avatar
jak

Community Member, 46 Posts

6 August 2012 at 1:45am

I know that there is a big gotcha if you use Requirements::themedCSS inside a module: it will only work if you add the name of the module to the call. So in order to include helloworld/css/Helloworld.css you would need to call:

Requirements::themedCSS('Helloworld', 'helloworld');

Requirements::css should not have this problem, but it might solve your problem if you try it that way.

BTW: It is better to only use lowercase names for your css files. Most webservers run on Linux, and paths there are case sensitive, so Helloworld.css != helloworld.css. Only using lower case names prevent those kinds of errors. That's just a recommendation (SilverStripe does not really follow it).

Another example: If your module is called some-module and the css file is in some-module/css/my-special-style.css, the call would be Requirements::themedCSS('my-special-style','some-module');