Сообщений в теме: 16

[P.K]

Hi

I have created a search module. Where can i change the css style of the search box?. I want to integrate this search box into my theme's menu bar. At this point there is native search bar in that which doesnt work 

And the jbzoo search also occupies the space even for hidden components or options

 

thanks

 

[Grizli]

Hi

Please, see this file.
media/zoo/applications/jbuniversal/assets/css/jbzoo.filter.css

It contain all styles for filter

[P.K]

Hi

I was trying to make the search bar like the search bar of my website. For that i looked into the styles of my templates css and i tried to change the jbzoo style for this id. But i was not successful i dont know wht went wrong but the search bar disappeared.

 

Moreover even when i disable the search button it still occupies space invisibly. How can i remove that?

If you wish to have the site url and login i may send you on personal msg

thanks

[Grizli]

You can show what you want by screenshots or public site url

[P.K]

Sorry but the site is offline.  I may show you screenshot.

http://img809.images...9/8149/lt7f.jpg

The search bar in the menu is that of template and the other one above it is jbzoo search bar

 

Thanks

[P.K]

Hi

I have been some doubts regarding search bar.

Now i have created a new layout search1 of the jbzoo filter and i want to integrate it into the place of my native search bar.

To do so-

1) I can change the class of the jbzoo filter to the ones used in my template. But i doubt the location of the file and i think it might hinder the working of other filters. So what do you suggest in this?

 

2) If i create new classes for the search1 using the id and class then there are  problems-

    a) I need to remove one div and create new styles for rest of elements. The div that needs to be removed is <div class="jbzoo jbzoo-filter-wrapper">

Now removing this div will also require me to edit the main file as i tried to use

.parent{display:none!important}
.child{display:block!important}

But thats also not working

<div class="uk-navbar-content uk-hidden-small">
    <script type="text/javascript">
        jQuery(function ($) {
            $('#jbzoo-filter-search1-99 select, #jbzoo-filter-search1-99 input[type=radio], #jbzoo-filter-search1-99 input[type=checkbox]').change(function () {
                $(this).closest("form").submit();
            });
        });
    </script>

<div class="jbzoo jbzoo-filter-wrapper">

    <form class="jbzoo-filter filter-search1" id="jbzoo-filter-search1-99" method="get" action="/mobiles" name="jbzoo-filter-search1-99">

        <div class="filter-fields">
            <!--
                User fields
            -->
            
<div class="filter-element element-_auto_ first">
    <div class="field">
	<input type="text" name="e[_itemname]" value="" id="filterEl__itemname" class="element-itemname element-tmpl-_auto_ jsAutocomplete ui-autocomplete-input" multiple="multiple" size="60" maxlength="255" placeholder="What are you shopping for?" autocomplete="off"><span role="status" aria-live="polite" class="ui-helper-hidden-accessible"></span>
</div>    <div class="clear clr"></div>
</div>
<div class="clear clr"></div>


            <!--
                Static fields
            -->
            <div class="static-fields">
                <input type="hidden" name="limit" value="20">

                <input type="hidden" name="order" value="none">
                <input type="hidden" name="logic" value="and">            </div>
        </div>

        <!--
            Submit and reset buttons
        -->
        <div class="controls">
            
            
            <div class="clear clr"></div>
        </div>

        <!--
            System required fields
        -->
        <input type="hidden" name="controller" value="search">
        <input type="hidden" name="Itemid" value="138">
        <input type="hidden" name="option" value="com_zoo">
        <input type="hidden" name="task" value="filter">
        <input type="hidden" name="exact" value="1">
        <input type="hidden" name="type" value="mobiles" class="jsItemType">
        <input type="hidden" name="app_id" value="1" class="jsApplicationId">
    </form>

</div>
</div>

b) Even when i change the css class after removing div then also i am not able to achieve the full functionality of the native search bar

 

 

But when i changed the class of the div and form to that of my template then i was able to achieve everything successfully. The code is

<form class="uk-search" id="jbzoo-filter-search1-99" method="get" action="/mobiles" name="jbzoo-filter-search1-99">

        <div class="filter-fields">
            <!--
                User fields
            -->
            
<div class="filter-element element-_auto_ first">
    <div class="field">
	<input type="text" name="e[_itemname]" value="" id="filterEl__itemname" class="uk-search-field element-tmpl-_auto_ jsAutocomplete ui-autocomplete-input" multiple="multiple" size="60" maxlength="255" placeholder="What are you shopping for?" autocomplete="off"><span role="status" aria-live="polite" class="ui-helper-hidden-accessible">3 results are available, use up and down arrow keys to navigate.</span>
</div>    <div class="clear clr"></div>
</div>
<div class="clear clr"></div>


            <!--
                Static fields
            -->
            <div class="static-fields">
                <input type="hidden" name="limit" value="20">

                <input type="hidden" name="order" value="none">
                <input type="hidden" name="logic" value="and">            </div>
        </div>

        <!--
            Submit and reset buttons
        -->
        <div class="controls">
            
            
            <div class="clear clr"></div>
        </div>

        <!--
            System required fields
        -->
        <input type="hidden" name="controller" value="search">
        <input type="hidden" name="Itemid" value="138">
        <input type="hidden" name="option" value="com_zoo">
        <input type="hidden" name="task" value="filter">
        <input type="hidden" name="exact" value="1">
        <input type="hidden" name="type" value="mobiles" class="jsItemType">
        <input type="hidden" name="app_id" value="1" class="jsApplicationId">
    </form>

Please suggest what should be done

 

thanks

[Grizli]

1) I can change the class of the jbzoo filter to the ones used in my template. But i doubt the location of the file and i think it might hinder the working of other filters. So what do you suggest in this?

 

You need to create styles are the same as in the search module JBZoo, and write into them the required settings like in the native searchbar.

All this must be done in your template file, for example custom.css or style.css. It is difficult to help without seeing the site.

[Grizli]

You can change classes in file of search: modules/mod_jbzoo_search/tmpl/default.php

CSS: media/zoo/applications/jbuniversal/assets/css/jbzoo.filter.css

Via these two files, you can get the the desired view of JBZoo search module

[P.K]

But that will change the class in all the search modules. Cant it be changed for just one module?

thanks

[P.K]

Hi

I also have some other doubts regarding search.

 When we search with autocomplete "on" then we get the possible results..but when we click the resuts then

      a) As soon as the possible result is clicked then the search is not automatically done, you need to press enter or search button. Can that be made         automatic when you click the possible result

    b.) Can this be made such that

          If the query is present in the indicated result then when you click it then you are directly sent to the item page rather then the search page

          else if it is not present you search page is shown showing indicative results

 

thanks

Сообщение отредактировал P.K: 06 September 2013 - 16:23