Search Widget transparent background

Home Forums Product Support Forums Ajax Search Pro for WordPress Support Search Widget transparent background

This topic contains 5 replies, has 2 voices, and was last updated by

 
Keymaster
5 years, 4 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #10134

    Participant

    Hello Support!
    I need a little help with the Ajax Search Pro plugin. So far, everything has worked great to get the search working against my Categories. No problems there as far as I can tell.

    The problem is that I have the search bar setup to display in two separate areas.

    1) The main page (along the top between the menu and page content. Looks great! (see attached pic #1)
    http://www.soundscenes.com
    2) When navigating the other pages, the search bar should be displayed at the top of the right sidebar in a widget. (see attached pic #2)
    http://soundscenes.com/catalog/atmo/nature/birds/laughing-gull/

    The search widget does not look great. I want the background to be transparent and not white. The Ajax Search Widget element is the first one at the top of the (laughing gull) page and it has a blue border at the top if I skip the title. The second search widget is a text widget with the Ajax shortcode put in…. but it still has the white background.

    I’ve searched the knowledgebase, manual, and tried multiple CSS edits to adjust the widget background with no luck.

    Can you recommend what setting I should be looking for to do this? Does the Ajax shortcode supercede all custom CSS that I try to use at the theme level?

    Attachments:
    You must be logged in to view attached files.
    #10138

    Hi!

    The background color is coming from the widget container. The widget container layout is purely controlled by the theme CSS. However you should try the following custom CSS:

    *[id*=ajaxsearchprowidget] h3.widget-title {
        display: none !important;
    }
    
    *[id*=ajaxsearchprowidget] {
        background: transparent !important;
    }

    These will force to remove the background from the widget container.

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


    #10139

    Participant

    Hi Ernest!
    Thanks for the quick reply! I tested out the custom CSS and it works to remove the white background!

    The only thing it leaves behind is the empty widget title bar just above it (pic attached)… is there another piece of CSS that I could use to remove that as well?

    Thank you again for your assistance!

    Regards,
    R

    Attachments:
    You must be logged in to view attached files.
    #10141

    Hi!

    Have you entered the first part of the custom CSS? I don’t see it on the page.

    *[id*=ajaxsearchprowidget] h3.widget-title {
        display: none !important;
    }

    This is supposed to hide the widget title aka. the blue bar.

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


    #10142

    Participant

    D’oh! Got it! The first part was definitely missing and after a quick cache dump the title bar is removed.

    Thanks Ernest! Top notch plugin and support! Much appreciated!

    #10143
    You cannot access this content. Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


Viewing 6 posts - 1 through 6 (of 6 total)

The topic ‘Search Widget transparent background’ is closed to new replies.