Преобразовать окно поиска в стиле CSS для использования в теме Drupal?

Question

Я использую Drupal 6, работаю над преобразованием моих статических файлов HTML и CSS в тему Drupal. До сих пор большинство прошло хорошо. Как бы я создал тему формы поиска для темы Drupal 6?

Что меня смущает, так это то, могу ли я использовать файл template.php вместе с search-theme-form.tpl.php файл? Могу ли я импортировать свой лист style.css в файл search-theme-form.tpl.php? или я могу просто вставить мой CSS напрямую?

Я загрузил окно поиска здесь, чтобы вы могли видеть, как оно ведет себя и выглядит. http://nside -elite.techiedesign.net / testsearchform / testsearchform.html

Вот мой оригинальный CSS:

#searchwrap {
    width: 330px;
    height: 51px;
    margin-right: auto;
    position: relative;
    margin-left: auto;
    top: 150px;
}
#searchboxwrapper {
    height: 28px;
    float: left;
    width: 277px;
}
#searchbuttonwrapper {
    width: 53px;
    height: 28px;
    float: right;
}
.preload {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 1px;
    height: 1px;
    visibility: hidden;
    overflow: hidden;
}
.searchbox {
    background-position: top;
    background-color: #515151;
    background-image: url('Images/searchbox-shadow.png');
    border: 2px #333333 solid;
    outline: none;
    background-repeat: repeat-x;
    height: 20px;
    margin-right: 3px;
    float: right;
    margin-top: 1px;
    width: 250px;
    text-indent: 5px;
    font-size: 10pt;
    color: #1D1D1D;
    font-style: italic;
    font-family: Arial;
}
.searchbutton {
    background: url('Images/go-button.png');
    background-repeat: no-repeat;
    cursor: pointer;
    width: 53px;
    height: 28px;
    border: 0px;
}
.searchbutton:hover {
    background: url('Images/go-button-gifsmooth.gif');
    background-repeat: no-repeat;
    border: 0px;
}
.searchbutton:active {
    background: url('Images/go-button-pressed.png');
    background-repeat:no-repeat;
    border: 0px;
}
.searchbox:focus {
    border: 2px;
    border-color: #6B6B6B;
    border-style: solid;
}

И HTML:

<div id="searchboxwrapper">
  <input name="Text1" type="text" class="searchbox" value="Search Nside Elite" onfocus="if(this.value == 'Search Nside Elite'){this.value = '';this.style.fontStyle='normal';this.style.color='#BFBFBF';}" onblur="if(this.value == '') {this.value='Search Nside Elite';this.style.fontStyle='italic';this.style.color='#222222'}" />
</div>
<div id="searchbuttonwrapper">
  <input name="searchbutton" type="button" value="" title="Search" class="searchbutton"  />
</div>

Никто на форумах Drupal не дал бы мне время суток. Буду признателен за любую помощь, которую вы можете предложить. Я не знаком с PHP.

Спасибо!

Answer 1

Вы определенно используете template.php, где вы подготавливаете переменные для печати в файле .tpl.php. В этом случае вы хотите добавить функцию предварительной обработки на хук search_theme_form. Чтобы присоединить новую функцию препроцессора к хуку тем, напишите функцию в template.php следующим образом:

function MYTHEME_preprocess_search_theme_form(&$variables) {
    //do stuff
}

Вы захотите очистить кеш, прежде чем появятся какие-либо изменения. Здесь вы можете добавить вещи, которые будут напечатаны в шаблоне.

function MYTHEME_preprocess_search_theme_form(&$variables) {
    $variables['whatever'] = 'hi there';
}

Позже в шаблоне вы можете вызвать это, написав print $ what; и он напечатает значение. Тем не менее, обычно я не изменяю search_theme_form.tpl.php, поэтому не перезаписываю его в своей теме и не использую настройки по умолчанию для drupal.

Вот пример того, как я добавил свою собственную функцию предварительной обработки в search_theme_form, чтобы удалить глупую метку в элементе формы, а также чтобы значение по умолчанию для текстовых полей исчезло в фокусе.

function MYTHEME_preprocess_search_theme_form(&$variables) {
    unset($variables['form']['search_theme_form']['#title']);
    unset($variables['form']['search_theme_form']['#printed']);
    $variables['form']['search_theme_form']['#value'] = 'Search';
    $variables['form']['search_theme_form']['#attributes'] = array('onfocus' => "if (this.value == 'Search') {this.value = '';}" );
    $variables['search']['search_theme_form'] = drupal_render($variables['form']['search_theme_form']);
    $variables['search_form'] = implode($variables['search']);
}

Надеюсь, это ответит на некоторые ваши вопросы и направит вас в правильном направлении.