Customer Portal

Get Involved. Join the Conversation.

Topic

    Shiloh Madsen
    Stylistic changes to standard/search/keywordtext needed
    Topic posted September 23, 2008 by Shiloh MadsenBronze Trophy: 5,000+ Points, last edited October 29, 2011 
    1115 Views, 3 Comments
    Title:
    Stylistic changes to standard/search/keywordtext needed
    Content:
    Hopefully an easy one here. I need to know what the best way to approach making a change to this widget would be. Basically we want the text to search faq's to be actually inside the search box and instead of a search button, we want to replace it with a gif. Thing is, we wouldnt want the widget to look like this every time we called for it,  just in certain areas. Would my best bet be to copy the widget and then go restyle the copy to look how we need it to, or is there a better way I should go about this?

    Comment

     

    • monique perkins

      Since you want it to look different in places your best option is to copy the widget view.php file(s) into a new widget(s).  If you leave the standard controller and logic in the meta tag then they should have the same functionality.

       

      Rename the css classes and create css / html that does what you want. You should be able to use css to replace the image in the button too. 

    • Shiloh Madsen

      This worked great...thanks!

       

      On a related note, I have been changing widget style via <style> tags at the beginning of the view. I notice that none of the current widgets seem to either have a linked stylesheet or styles on the widget itself. What is the hierarchy that is giving the widgets their look and feel? Is it all coming from the page template in which they are contained? 

    • monique perkins

      1 - if there is a style sheet in assets/css/widgets/... then the same path as the widget it is loaded.  So the Keyword text will have one at assets/css/widgets/search/KeywordText.css.  We have tried to leave these as minimal as possible so you can easily overwrite them.  Several have "functional" css - css to show/hide based on behavior. 

       

      2 - You can specify a widget css with the css_path meta tag in the widget.  

       

      3 - most of the styling for the pages we ship is in the rn_standard.css  and the widget specific styles are in rn_widgets.css

       

      If you use firebug you can see the exact css hierarchy and files on all widgets.