Whats the css for the search bar

[ninety83]

Hi guys,

could you tell me how to style my search bar to look like yours? I have a plugin but the search bar looks out off place.

Regards,

Ken

[sharmstr]

Which search bar? There are 3 of them. There’s the one in the sidebar, one in VC and one on pages like groups, members and forums 🙂

Also, it will be easier to tell you if you provide us a link so we can see their markup.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[ninety83]

HI,

i want to copy the style in the main parallax: http://www.nomad.xyz/instamatic/

so the search tab on: http://www.nomad.xyz/play/ within the tab ‘search’ looks similar and centred?

Regards,

ken

[sharmstr]

Hmmm. Your code is broken. See attached. Once you fix that, the easiest way to style it like the Kleo search would be to edit the plugin so that it creates the correct divs and attaches the correct css to it.

Here’s your broken code

COPY CODE

<form accept-charset="utf-8">
<fieldset class="tubepress_search">
		<input type="text" id="tubepress_search_99" <br="">
               name="tubepress_search_99" class="tubepress_text_input" /><br>
		<button class="tubepress_button" title="Submit Search">Search</button><br>
	</fieldset>
</form>

It should be something like this

COPY CODE

<form accept-charset="utf-8">
<fieldset class="tubepress_search">
	<input type="text" id="tubepress_search_99" name="tubepress_search_99" class="tubepress_text_input" />
<br>
	<button class="tubepress_button" title="Submit Search">Search</button><br>
</fieldset>
</form>

For kleo styling, edit the plugin output so it outputs something like this.

COPY CODE

<div class="kleo-search-wrap kleo-search-form search-style-transparent">
  <form id="searchform">
	
	<div class="input-group">
		<input name="tubepress_search_99" id="tubepress_search_99" autocomplete="off" type="text" class="ajax_s form-control input-lg" value="" style="opacity: 0.5;">
		<span class="input-group-btn">
            <input type="submit" value="Search" id="searchsubmit" class="button">
		</span>
	</div>

</form>
</div>

I couldn’t test it because your site kept timing out and wasn’t available half the time. Also, the form tag it outputs doesn’t have an action so I dont think it will ever work. Did you try using the search form? Did it work for you?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

Attachments:

You must be logged in to view attached files.

[ninety83]

you are amazing!

thanks alot!

[Author]

Posts