How to change the css in search module

For questions and problems with the CMS core. This board is NOT for any 3rd party modules, addons, PHP scripts or anything NOT distributed with the CMS made simple package itself.
pralay

How to change the css in search module

Post by pralay »

Hi all,
I want to change the looks of the search module. I have included the module and it is coming with default css.
I want to cgange the button with an image, remove the 'search' word and make the textbox smaller.
How I can do it?
Is there anyone to help me?
It's urgent. :-[
nils73
Power Poster
Power Poster
Posts: 520
Joined: Wed Sep 08, 2004 3:32 pm

Re: How to change the css in search module

Post by nils73 »

You can change the Look & Feel of the search-template (the input form) as well as the design of the output in Extensions > Search. All you need to do is put the code of your template into the respective fields and style it the way you like with HTML & CSS.

Regards,
Nils
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: How to change the css in search module

Post by Dr.CSS »

You may have to go to the search module and change the action.default.php line 34, I used it to make the button an image...

original...

$this->smarty->assign('submitbutton', $this->CreateInputSubmit($id, 'submit', $submit));

new...

$this->smarty->assign('submitbutton', $this->CreateInputSubmit($id, 'submit', $submit, '', 'uploads/images/golf/go.jpg'));

view changed search...

http://www.multiintech.com/cmsms2/index.php/golf.html

NOTE: this will change all the pages search button...

http://www.multiintech.com/cmsms2/index ... works.html...
saltydog
Power Poster
Power Poster
Posts: 281
Joined: Fri Mar 04, 2005 9:06 am

Re: How to change the css in search module

Post by saltydog »

mark wrote: You may have to go to the search module and change the action.default.php line 34, I used it to make the button an image...
I applied your suggestion, mark, on CMSMS 1.0.6, but it didn't work. I still have the "submit" button instead of my image. This is the line I have edited:

$this->smarty->assign('submitbutton', $this->CreateInputSubmit($id, 'submit', $submittext,'','/uploads/image/search_button.gif'));

Fabio
calguy1000
Support Guru
Support Guru
Posts: 8169
Joined: Tue Oct 19, 2004 6:44 pm

Re: How to change the css in search module

Post by calguy1000 »

to style the search module, just do two things
a) wrap the search tag in a div.
    like: {search}
    now you can use css to style most everything.

b) to use an image instead of a button for submit you need to just modify the template to remove the {submit} stuff and replace it with the appropriate tag.
all that is left is the javascript.

All you need to do is submit the form name, a simple view source wll tell you the form name, and if your form won't be moving around, then this is great, copy the form name out, and use "javascript:document.whateverform.submit()".

If there's a chance that your form might move around on your page, I have a javascript function (that can be embedded into your global metadata, or your page template).  to detect the current form.

BTW, this solution doesn't only apply to search, but to every module.
Follow me on twitter
Please post system information from "Extensions >> System Information" (there is a bbcode option) on all posts asking for assistance.
--------------------
If you can't bother explaining your problem well, you shouldn't expect much in the way of assistance.
saltydog
Power Poster
Power Poster
Posts: 281
Joined: Fri Mar 04, 2005 9:06 am

Re: How to change the css in search module

Post by saltydog »

I have replaced this line in Search.module.php:

{$label}: {$inputbox}{$hidden}

with this one:

{$label}: {$inputbox}{$hidden}


with no success. I still have the button "Submit"!
RonnyK
Support Guru
Support Guru
Posts: 4962
Joined: Wed Oct 25, 2006 8:29 pm

Re: How to change the css in search module

Post by RonnyK »

is your image-link correct, as I don't see a "." before "gif"?

I also wouldn't start the link with a "/", so either "uploads" or "./uploads".
Ronny
Last edited by RonnyK on Fri May 11, 2007 12:18 pm, edited 1 time in total.
saltydog
Power Poster
Power Poster
Posts: 281
Joined: Fri Mar 04, 2005 9:06 am

Re: How to change the css in search module

Post by saltydog »

RonnyK wrote: is your image-link correct, as I don't see a "." before "gif"?

I also wouldn't start the link with a "/", so either "uploads" or "./uploads".
Ronny
Yes, it is.
Sorry for the typo.

The fact is that the form is showing the submit button anyway. Where does it take from?
saltydog
Power Poster
Power Poster
Posts: 281
Joined: Fri Mar 04, 2005 9:06 am

Re: How to change the css in search module

Post by saltydog »

Now I have moved the image in the same directory as the module:

{$label}: {$inputbox}{$hidden}

no change..
RonnyK
Support Guru
Support Guru
Posts: 4962
Joined: Wed Oct 25, 2006 8:29 pm

Re: How to change the css in search module

Post by RonnyK »

I think CMS is looking from the root of CMS itself, so the original location was correct, just the calling might have been wrong. Do you see the image when you put "domain + image-link" in the address bar, otherwise the rights might have been wrong. If the rights aren't correct the image is put over the search-box.

Ronny
saltydog
Power Poster
Power Poster
Posts: 281
Joined: Fri Mar 04, 2005 9:06 am

Re: How to change the css in search module

Post by saltydog »

RonnyK wrote: I think CMS is looking from the root of CMS itself, so the original location was correct, just the calling might have been wrong. Do you see the image when you put "domain + image-link" in the address bar, otherwise the rights might have been wrong. If the rights aren't correct the image is put over the search-box.

Ronny
Yes, I see the image from the web if I direct the browser on it.
But it is not shown anywhere on the search module, while the button is always there. How could it be? I have modified that line.
saltydog
Power Poster
Power Poster
Posts: 281
Joined: Fri Mar 04, 2005 9:06 am

Re: How to change the css in search module

Post by saltydog »

Looking at the generated HTML code, I am still seeing:




Where does it come from?
alby

Re: How to change the css in search module

Post by alby »

saltydog wrote: I have replaced this line in Search.module.php:
.........
Not in Search.module.php but in Extensions -> Modules -> Search -> Search Template

Alby
calguy1000
Support Guru
Support Guru
Posts: 8169
Joined: Tue Oct 19, 2004 6:44 pm

Re: How to change the css in search module

Post by calguy1000 »

did you clear the cache? this may be causing the problem.
Follow me on twitter
Please post system information from "Extensions >> System Information" (there is a bbcode option) on all posts asking for assistance.
--------------------
If you can't bother explaining your problem well, you shouldn't expect much in the way of assistance.
saltydog
Power Poster
Power Poster
Posts: 281
Joined: Fri Mar 04, 2005 9:06 am

Re: How to change the css in search module

Post by saltydog »

alby wrote:

Not in Search.module.php but in Extensions -> Modules -> Search -> Search Template

Alby
What?
I don't have that!
I have Extensions->Modules->Search... that's it!
Locked

Return to “CMSMS Core”