The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

advanced search

View previous topic View next topic Go down

Solved advanced search

Post by omarpop23 on April 11th 2016, 3:29 pm

hey ,
my question is how to make advanced search like this



i can make HTML , CSS code but my problem how to make it poup when i click on it and hide when i click on it again

IF you want to see what is the problem in my Fourm

Here is URL: http://hamor-shabik.arab.st


Last edited by omarpop23 on April 14th 2016, 4:30 am; edited 1 time in total
avatar
omarpop23
Forumember

Male Posts : 161
Reputation : 3
Language : Arabic
Location : Egypt

http://egyover.ahlamontada.com

Back to top Go down

Solved Re: advanced search

Post by YasirAyad on April 14th 2016, 3:12 am

hello @omarpop23
if you are from Egypt, you can get help from help.ahlamontada.com Next time  :rose:
------------
the problem you Just copy HTML With out javascript code !

Create a new javascript :

Placement : In all the pages
Javascript Code :


Code:
;$(function(){var lang={display_as:'<b>Display results as : </b>',posts:'Posts',topics:'Topics',tags:'<b>Hashtags : </b>',advanced:'<b>Advanced Search</b>',options_title:'Search options'},settings=document.createElement('DIV'),opts=document.createElement('A'),node=document.getElementById('search');if(!node)return;settings.style.display='none';settings.id='fa_search_settings';settings.innerHTML='<p>'+lang.display_as+'</p><p><input id="searchOptsPosts" type="radio" name="show_results" value="posts"/><label for="searchOptsPosts">'+lang.posts+'</label><input id="searchOptsTopics" type="radio" name="show_results" value="topics" checked="true"/><label for="searchOptsTopics">'+lang.topics+'</label></p><p><label for="searchOptsTags">'+lang.tags+'</label> <input id="searchOptsTags" type="checkbox" name="is_tag" value="tags"/></p><hr class="dashed"/><p><a href="/search">'+lang.advanced+'</a></p>';opts.href='#';opts.title=lang.options_title;opts.id='fa_search_opts';opts.onclick=function(){var settings=document.getElementById('fa_search_settings');settings.style.display=/none/.test(settings.style.display)?'block':'none';return false};node.search_keywords.onfocus=function(){var settings=document.getElementById('fa_search_settings');if(!/none/.test(settings.style.display))settings.style.display='none'};node.appendChild(opts);node.appendChild(settings)});

and add this code in css :

Code:
#fa_search_settings {
    background: #FFF;
    border: 1px solid #DDD;
    border-radius: 3px;
    box-shadow: 0 3px 9px rgba(0,0,0,0.175);
    color: #333;
    padding: 3px;
    position: absolute;
    right: 0;
    text-align: center;
    top: 45px;
    width: 175px;
    z-index: 1;
}
#fa_search_settings:before {
    content: url(http://i18.servimg.com/u/f18/18/21/41/30/arrow11.png);
    position: absolute;
    right: 130px;
    top: -10px;
}
#fa_search_settings p {
    font-size: 11px;
}

  Wink
avatar
YasirAyad
Forumember

Male Posts : 67
Reputation : 10
Language : En/Ar

http://help.ahlamontada.com/u152001

Back to top Go down

Solved Re: advanced search

Post by omarpop23 on April 14th 2016, 3:36 am

i though that no one can help me in http://help.ahlamontada.com
but next time i will ask you there thnk you

but this code not working well do you tested it @new.moon
avatar
omarpop23
Forumember

Male Posts : 161
Reputation : 3
Language : Arabic
Location : Egypt

http://egyover.ahlamontada.com

Back to top Go down

Solved Re: advanced search

Post by YasirAyad on April 14th 2016, 4:00 am

sorry try this now, it's work with me :
Code:
$(function(){var lang={display_as:'<b>Display results as : </b>',posts:'Posts',topics:'Topics',tags:'<b>Hashtags : </b>',advanced:'<b>Advanced Search</b>',options_title:'Search options'},settings=document.createElement('DIV'),opts=document.createElement('A'),node=document.getElementById('search');if(!node)return;settings.style.display='none';settings.id='fa_search_settings';settings.innerHTML='<p>'+lang.display_as+'</p><p><input id="searchOptsPosts" type="radio" name="show_results" value="posts"/><label for="searchOptsPosts">'+lang.posts+'</label><input id="searchOptsTopics" type="radio" name="show_results" value="topics" checked="true"/><label for="searchOptsTopics">'+lang.topics+'</label></p><p><label for="searchOptsTags">'+lang.tags+'</label> <input id="searchOptsTags" type="checkbox" name="is_tag" value="tags"/></p><hr class="dashed"/><p><a href="/search">'+lang.advanced+'</a></p>';opts.href='#';opts.title=lang.options_title;opts.id='fa_search_opts';opts.onclick=function(){var settings=document.getElementById('fa_search_settings');settings.style.display=/none/.test(settings.style.display)?'block':'none';return false};node.search_keywords.onfocus=function(){var settings=document.getElementById('fa_search_settings');if(!/none/.test(settings.style.display))settings.style.display='none'};node.appendChild(opts);node.appendChild(settings)});

Do not delete that code if not working, give me your Forum link To check.
avatar
YasirAyad
Forumember

Male Posts : 67
Reputation : 10
Language : En/Ar

http://help.ahlamontada.com/u152001

Back to top Go down

Solved Re: advanced search

Post by omarpop23 on April 14th 2016, 4:30 am

Solved
it wasn't work because i was putting Javascript in OVEARALL_HEADER Template
avatar
omarpop23
Forumember

Male Posts : 161
Reputation : 3
Language : Arabic
Location : Egypt

http://egyover.ahlamontada.com

Back to top Go down

Solved Re: advanced search

Post by SLGray on April 14th 2016, 9:28 pm

Topic solved and archived


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.

avatar
SLGray
Administrator
Administrator

Male Posts : 40497
Reputation : 2732
Language : English
Location : United States

https://fmthemes.forumotion.com/

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum