Перенести поле поиска из шапки в тело сайта

[201baza]

Доброго времени суток, уважаемые форумчане! Помогите с решением задачи. Нужно сделать отображение Поля поиска и категории товаров как на сайте OZON.ru. То есть Поле поиска перенести из шапки в тело сайта и отображение категорий слева. Пытаюсь разобраться в коде, но знаний пока маловато для таких действий. 

 

[Tom]

Я вижу три выхода)))

 

1) Найти похожий шаблон ( easy)

 

2) Изучить срочно основы CSS-HTML(хватит минимума)    (not so easy )

 

3) Перенести поиск из дива хидера, в див меню, и переписать соотвественно стили,с учётом этих правок.

 

Если категории будут в левой колонке  везде в магазине,то так же поступить с модулем категорий!  (maybe so hard ))))

 

Но мне кажется что вот это

 

Пытаюсь разобраться в коде, но знаний пока маловато для таких действий. 

 

 

аналогично как  как в центре Токио у коренного японца спрашивать на русском , как пройти в определённый район.

 

Он то ответит,только что это даст?

[201baza]

1. Я взял дефолтный шаблон, что при установке был. И переделываю так как мне надо. Похожего шаблона не видел. Кстати, пользуясь моментом хочу спросить, зачем в Опенкарте категории товаров выводятся два раза. Первый в горизонтальной строке главного меню, второй раз в левой колонке. На многих сайтах замечаю такую штуку. Да и вообще зачем было на программном уровне это делать?

2. CSS-HTML я знаю достаточно. Но вот сдается мне что одним CSS-HTML тут не обойтись. Если я ошибаюсь, буду только рад. Значит мозгов хватит самому сделать. 

3. Перенести Поле поиска на место Меню сам смогу. Другое дело, если Модуль категорий товаров выводится в column_left.tpl (или в другом месте), а Поле поиска находится в header.tpl. Это два разные файла. Если Поле поиска из header.tpl переносить в другой файл, то править нужно будет все связанные файлы. Далее, на программном уровне получится что категории товаров и поиск существуют сами по себе, а мне кажется что они должны быть как то связаны. 

[Tom]

Кстати, пользуясь моментом хочу спросить, зачем в Опенкарте категории товаров выводятся два раза

 

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

 

Но вот сдается мне что одним CSS-HTML тут не обойтись.

 

Коллега,откройте header.tpl и вы увидите что  поиск находится внутри дива header , вытаскивайте его оттуда и вставляйте в див меню.Дальше стилями поправите.

 

По  третьему вопросу.Ставьте категории в положение column_left и первым в выводе.Ну а дальше экспериментируйте со стилями шаблона.

[201baza]

Tom, похоже Вы меня немного не правильно поняли по третьему пункту. Ну да ладно. Допустим, Главное Меню выкинули, на его место поставили Поле поиска. Подключили в админке левую колонку Категории товаров. Теперь внимание! Посмотрите на каких позициях находятся левая колонка и горизонтальное меню. Левая колонка находится ПОД горизонтальным меню!  :wink: Я же не зря выложил здесь фотографию выше. А надо чтобы на одном уровне была.

 

Есть кое-какая задумка, как по-хитрому сделать. В стилях левой колонки прописать - поднять вверх колонку, отступ сверху поставить со знаком минус. А Поле поиска сдвинуть вправо, опять же через CSS. Но это коряво будет.

 

Вот еще один сайт http://www.003.ru/. Видите как Категории с Поиском склеены?

[Tom]

http://themeforest.net/item/mega-shop-responsive-opencart-theme/6507132

 

 

вот готовый шаблон (один из многих)

 

Или купить или проинспектировать что бы понять что и как.

[AlexFisher]

ТС мне импонирует как минимум воспитанностью.

"я знаю цсс+хтмл" - веселит. Там как-раз этими средствами можно все сделать.

По ссылке в примере - отличный сайт. Убрать только вот эту футбольную блевотину и попап на входе - будет цацка.

[201baza]

Хорошо, ставлю вопрос по другому: необходимо Поле поиска перенести из header.tpl в content_top.tpl. Далее через админку выведу модуль категорий слева, и выровняю поиск с категориями товаров в один уровень при помощи CSS, как это показано на первом рисунке.

 

Будет вот так: 

[krumax]

Так должно быть только на главной или по всему сайту?

[201baza]

Так должно быть только на главной или по всему сайту?

 

весь сайт!!!

[krumax]

Вот реализация только на главной, но можно сделать и по всему)

 

[krumax]

Для всего сайта:

 

 Открываем content_top.php

после

$this->load->model('catalog/information');

вставляем

 $this->language->load('common/header');
$this->data['text_search'] = $this->language->get('text_search');

перед

$layout_id = 0;

добавить

// Search
if (isset($this->request->get['search'])) {
$this->data['search'] = $this->request->get['search'];
} else {
$this->data['search'] = '';
}

Открываем content_top.tpl

перед

<?php foreach ($modules as $module) { ?>

добавляем

<div id="content">
<div id="search">
<div class="button-search"></div>
<input type="text" name="search" placeholder="<?php echo $text_search; ?>" value="<?php echo $search; ?>" />
</div>
</div>

В stylesheet.css

#content #search {
width: 298px;
z-index: 7;
}
#content .button-search {
position: absolute;
background: url('../image/button-search.png') center center no-repeat;
width: 28px;
height: 24px;
border-right: 1px solid #CCCCCC;
cursor: pointer;
}
#content #search input {
background: #FFF;
padding: 1px 1px 1px 33px;
width: 262px;
height: 21px;
border: 1px solid #CCCCCC;
-webkit-border-radius: 3px 3px 3px 3px;
-moz-border-radius: 3px 3px 3px 3px;
-khtml-border-radius: 3px 3px 3px 3px;
border-radius: 3px 3px 3px 3px;
-webkit-box-shadow: 0px 2px 0px #F0F0F0;
-moz-box-shadow: 0px 2px 0px #F0F0F0;
box-shadow: 0px 2px 0px #F0F0F0;
}

В common.js

строку

$('#header input[name=\'search\']').bind('keydown', function(e) {

заменяем на

$('#content input[name=\'search\']').bind('keydown', function(e) {

Вроде как всё)

[201baza]

Здравствуйте! Вроде все сделал. В поле поиска вот такая строчка пишется 

<b>Notice</b>: Undefined variable: search in <b>Z:\home\localhost\www\beget\catalog\view\theme\default\template\common\content_top.tpl</b> on line <b>4</b>

[krumax]

Здравствуйте! Вроде все сделал. В поле поиска вот такая строчка пишется 

<b>Notice</b>: Undefined variable: search in <b>Z:\home\localhost\www\beget\catalog\view\theme\default\template\common\content_top.tpl</b> on line <b>4</b>

в content_top.php

перед

$layout_id = 0;

добавить

// Search
if (isset($this->request->get['search'])) {
$this->data['search'] = $this->request->get['search'];
} else {
$this->data['search'] = '';
}

P.S.

Выше исправил.

[201baza]

krumax, благодарю Вас! Все получилось. Спасибо!!!  :-)

[mrkos021]

Добрый день. А как сделать на всех страницах, кроме главной?

[krumax]

Добрый день. А как сделать на всех страницах, кроме главной?

Также но обернув вывод в УСЛОВИЕ

[markimax]

Вот вы любите искать тяжелые пути...

Проще всего сделать через jquery.

Берете любой html модуль и вставляете jquery код

<script>
var data = $('#search').clone();
$('#search').remove();
$('#id куда надо').html(data);
</script>

.append .prepend .before .after плюс  к селекторам :nth-child(номер)

 

Всё! И не надо ничего править

[krumax]

Вот вы любите искать тяжелые пути...

Проще всего сделать через jquery.

Берете любой html модуль и вставляете jquery код

<script>
var data = $('#search').clone();
$('#search').remove();
$('#id куда надо').html(data);
</script>

.append .prepend .before .after плюс  к селекторам :nth-child(номер)

 

Всё! И не надо ничего править

Реклама - двигатель торговли)

Но упоминайте тогда сразу о 790.00 руб которые "облегчают пути" )

[markimax]

Реклама - двигатель торговли)

Но упоминайте тогда сразу о 790.00 руб которые "облегчают пути" )

О чем вы говорите... задали, вопрос, я ответил, что не нравиться, в курилку на обсуждение. :) :-D

Я сказал "любой", но предложил свой как вариант так как там функционал больше (понимает php, поле привязки jquery, можно повесить не только на схемы но и на конкретный URL или словосочетание в URL  и т.п.).

Но, как я и написал  можно использовать любой html модуль

 

А решение это простое, без редактирования кода и изобретения велосипеда

Так что все по теме и по делу