ThemeShaper Forums » Thematic

[closed]

Search bar editing and paths

(3 posts)
  • Started 10 years ago by pyemachine
  • Latest reply from patrick
  • This topic is resolved

Tags:

  1. pyemachine
    Member

    I am wanting to change the search bar look and the text that appears in it. Is copying and editing the searchform.php to my Child theme the incorrect way to do this.

    And when I reference an image via the <?php bloginfo('template_url'); ?> it points to the Parent theme and not the child. I have googled and googled and I am not sure what to do there.
    Any help greatly appreciated,

    Posted 10 years ago #
  2. pyemachine
    Member

    Ok I did a bit more digging around and realise I can style it by adding code via the functions.php fie.

    My code is working but as I am new to writing these Action Hook handles would love someone to critique my function.

    (`
    add_action('thematic_header','childtheme_header_image');

    ?>

    <?php
    function childtheme_searchbar() {
    ?>

    <!– added HTML –>
    <script type="text/javascript">
    function clickclear(thisfield, defaulttext) {
    if (thisfield.value == defaulttext) {
    thisfield.value = "";
    }
    }

    function clickrecall(thisfield, defaulttext) {
    if (thisfield.value == "") {
    thisfield.value = defaulttext;
    }
    }
    </script>

    <div id="search_box">
    <form method="get" id="searchform" action="<?php bloginfo('url'); ?>/">
    <input type="text" value="SEARCH KEYWORDS" name="s" id="s" size="15" onclick="clickclear(this, 'SEARCH KEYWORDS')" onblur="clickrecall(this,'SEARCH KEYWORDS')" />
    <input type="image" src="http://myURL/w2w/wp-content/themes/myURL/images/search_right.gif" value="Search" id="go" />
    </form>

    </div>
    <!– end HTML –>

    <?php

    }

    add_action('thematic_search_form','childtheme_searchbar');

    ?>

    )

    Posted 10 years ago #
  3. patrick
    Member

    Hi pyemachine,

    Those action hooks are so cool, I love it !! Here's the code I wrote for a search bar above the header, as you can see it's shorter, i do not have your javascript function declared and it works like a charm. I also remove the button as I find it useless nowadays.

    Always go for the shorter and cleaner way !

    P.

    function my_search_bar() {
    
     { ?>
    
    <!-- Search Bar HTML Code -->
        <form id="searchform" method="get" action="<?php bloginfo('home') ?>">
          <div>
             <input type="text" tabindex="1" size="32" onblur="if (this.value == '') {this.value = 'Search on the site ...';}" onfocus="if (this.value == 'Search on the site ...') {this.value = '';}" value="Search on the site ..." name="s" id="s">
          </div>
         </form>
    	<div class="clear"></div>
    <!-- End of Code -->
    <?php }
    
    } // End of Search Bar Function
    
    // Adding the hook to thematic_aboveheader
    add_action('thematic_aboveheader','my_search_bar');
    Posted 10 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.