Page 1 of 1

Using custom CSS in Modules (Search, etc)

Posted: Tue Jun 23, 2009 4:55 pm
by fatlizard
Is there any accepted procedure, or butcher job someone has successfully done, that shows how to attach our own css classes & designs so that we can alter the way inputs appear (input textarea, input submit) ...?

As a further example, in the Search Module (SearchModule.php) I find a small function GetSearchHtmlTemplate(), which assemblies the textarea and submit button.

It would be nice to attach a specific style to these elements, perhaps by using an optional parameter to specifiy a stylesheet to be used?

My guess is that editing SearchModule.php would be necessary to then accommodate the imported styles.

Parameter (optional) css="false"


::
to
::

Re: Using custom CSS in Modules (Search, etc)

Posted: Tue Jun 23, 2009 5:05 pm
by new2thiscms
If I am understanding you correctly you would like to add classes and such to the input tags and style the search.

You can do this by going to

Extensions > Search > search template tab.

There you will see your search template. You can there add and change for however you would like it to be.

Then just add the class to your stylesheet and you are set.

Hope this is what you were looking for and helps.

Chris

Re: Using custom CSS in Modules (Search, etc)

Posted: Wed Jun 24, 2009 2:23 pm
by fatlizard
Exactly what I was looking for.

Thank you for the pointer, very much appreciated.

Cheers

Re: Using custom CSS in Modules (Search, etc)

Posted: Wed Jun 24, 2009 2:41 pm
by tyman00
1.) As pointed out some modules allow you to customize the templates very easily.

2.) Some modules also allow you to specify text to be displayed in the html tag... for example  {module_name  text='class="formClass"'} would output   Check out the help for the modules to see if this parameter is supported or if it has something like it.

3.) Finally, if you are unable to customize it manually I have found that some modules put in ID's and classes automatically for you. Do a view source of your page and see if that specific element has an ID or class assigned to it. Some of them have goofy id's or class names but you should still be able to target them in your CSS. It may not follow your naming scheme but it will at least allow you to format it as you see fit.