Установка компактного поиска в главном меню

@rikitiki · Регистрация: 17.02.2013

Author24 — интернет-сервис помощи студентам

Скажите пожалуйста. а как установить компактно Поиск в главном меню WordPress, подобно тому как это сделано в темах:
Avada,
Vantage,
Twenty Fourteen.
Или в плагине UberMenu.
В теме Avado мне больше всего нравится.
Сайт выполненный на теме Avada:
http://algolux.com/news/
Понятно что там картинка при клике на которую ниже появляется форма поиска.
В Интернете немного пишут о выезжающих влево, расширяющихся формах поиска, но они требуют места. так как перекрывают пункты меню.
И ещё добавлю что у меня фиксированое при скроллинге меню и хотелось. чтобы форма поиска также фиксировалась.
Спасибо за ответы.

@loms · 27.12.2014, 12:09

Посмотрите здесь
http://wphelper.ru/wordpress-x... wordpress/

@tester2014 · 27.09.2015, 14:31

Там сказано следующие:

Добавьте в functions.php следующий хук:

PHP

add_filter( 'wp_nav_menu_items', 'add_search_box', 10 , 2);
function add_search_box ( $items, $args ) {
  if( 'menu-index' === $args -> theme_location )
    $items .= '<li class="custom-func-li-last">' . get_search_form(false) . '</li>';
  return $items;
}
    
add_filter( 'wp_nav_menu_items', 'add_search_box', 10 , 2);
function add_search_box ( $items, $args ) {
  if( 'menu-index' === $args -> theme_location )
    $items .= '<li class="custom-func-li-last">' . get_search_form(false) . '</li>';
  return $items;
}

стоит обратить внимание на menu-index, это название Вашего меню к которому будет добавлен элемент, получить его можно так же из файла functions.php:

PHP

1
2
3

register_nav_menus( array(
  'menu-index' => 'Главное меню',
));

Я попробовал у меня не получилось (Тема tempera)
1. Куда конкретно вставлять эти коды?
2. Имеет ли значение последовательность этих кодов?
3. Нужно ли что то в коде менять?
4. Как вставить что то другое, скажем выпадающие рубрики?

Мой functions.php

PHP

<?php
/*
 * Functions file
 * Calls all other required files
 * PLEASE DO NOT EDIT THIS FILE IN ANY WAY
 *
 * @package tempera
 */
 
// variable for theme version
define ('_CRYOUT_THEME_NAME','tempera');
define ('TEMPERA_VERSION','1.3.3');
 
require_once(dirname(__FILE__) . "/admin/main.php"); // Load necessary admin files
 
//Loading include files
require_once(dirname(__FILE__) . "/includes/theme-setup.php");     // Setup and init theme
require_once(dirname(__FILE__) . "/includes/theme-styles.php");    // Register and enqeue css styles and scripts
require_once(dirname(__FILE__) . "/includes/theme-loop.php");      // Loop functions
require_once(dirname(__FILE__) . "/includes/theme-meta.php");      // Meta functions
require_once(dirname(__FILE__) . "/includes/theme-frontpage.php"); // Frontpage styling
require_once(dirname(__FILE__) . "/includes/theme-comments.php");  // Comment functions
require_once(dirname(__FILE__) . "/includes/theme-functions.php"); // Misc functions
require_once(dirname(__FILE__) . "/includes/theme-hooks.php");     // Hooks
require_once(dirname(__FILE__) . "/includes/widgets.php");     // Hooks
require_once(dirname(__FILE__) . "/includes/ajax.php");     // Hooks

@Dimon66620 · 28.09.2015, 09:50

оформляете блок поиска по своему усмотрению, в css дополнительно пишете

HTML5

1	opacity:0;

, оформляете кнопку на которое вешаете событие onclick, запускающий js скрипт плавно изменяющий значение opacity от 0 до 1

@tester2014 · 28.09.2015, 10:48

спасибо,конечно,только "вы сейчас с кем разговаривали?"))) К сожалению я так ничего не понимаю. Могу только на уровне редактора - "вставьте этот кусок готового кода вот сюда".

@Dimon66620 · 01.10.2015, 12:57

Во первых найдите не function.PHP в шаблоне, а тот файл которых отвечает за вывод шапки у вас в шаблоне или покажите index.php

@tester2014 · 01.10.2015, 13:04

Tempera: Основной шаблон (index.php)

PHP

<?php
/**
 * The main template file.
 *
 * This is the most generic template file in a WordPress theme
 * and one of the two required files for a theme (the other being style.css).
 * It is used to display a page when nothing more specific matches a query.
 * E.g., it puts together the home page when no home.php file exists.
 * Learn more: http://codex.wordpress.org/Template_Hierarchy
 *
 * @package Cryout Creations
 * @subpackage Tempera
 */
get_header();
if ($tempera_frontpage=="Enable" && is_front_page() && !is_page()): get_template_part( 'frontpage' );
// if is_page() -> additional check in page.php
else: get_template_part('content/content', 'index');
endif;
get_footer();
?>

Добавлено через 2 минуты
Tempera: Заголовок (header.php)

PHP

<?php
/**
 * The Header
 *
 * Displays all of the <head> section and everything up till <div id="main">
 *
 * @package Cryout Creations
 * @subpackage tempera
 * @since tempera 0.5
 */
 ?><!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<?php  cryout_meta_hook(); ?>
<meta http-equiv="Content-Type" content="text/html; charset=<?php bloginfo( 'charset' ); ?>" />
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php
    cryout_header_hook();
    wp_head(); ?>
</head>
<body <?php body_class(); ?>>
 
<?php cryout_body_hook(); ?>
 
<div id="wrapper" class="hfeed">
<div id="topbar" ><div id="topbar-inner"> <?php cryout_topbar_hook(); ?> </div></div>
<?php cryout_wrapper_hook(); ?>
 
<div id="header-full">
    <header id="header">
<?php cryout_masthead_hook(); ?>
        <div id="masthead">
            <div id="branding" role="banner" >
                <?php cryout_branding_hook();?>
                <?php cryout_header_widgets_hook(); ?>
                <div style="clear:both;"></div>
            </div><!-- #branding -->
            <a id="nav-toggle"><span>&nbsp;</span></a>
            <nav id="access" role="navigation">
                <?php cryout_access_hook();?>
            </nav><!-- #access -->      
        </div><!-- #masthead -->
    </header><!-- #header -->
</div><!-- #header-full -->
 
<div style="clear:both;height:0;"> </div>
 
<div id="main">
        <?php cryout_main_hook(); ?>
    <div  id="forbottom" >
        <?php cryout_forbottom_hook(); ?>
 
        <div style="clear:both;"> </div>
 
        <?php cryout_breadcrumbs_hook();?>

@Dimon66620 · 01.10.2015, 17:04

CSS и HTML знаете?

@tester2014 · 01.10.2015, 17:32

нет

Добавлено через 49 секунд
я же писал что могу на уровне "вот это вставить туда"

@Dimon66620 · 01.10.2015, 17:36

К сожалению мне писать лень могу вам только скинуть несколько сайтов для информации
HTML, CSS
http://htmlbook.ru/ все найдете через поиск
Для вас особо важны элементы div, form, input
Стили css : block
Событие : onclick
По javascript
http://javascript.ru/tutorial/dom/modify

Добавлено через 2 минуты
Пишете все это и вставляете в район блока header-full

@qdi · 16.05.2019, 08:17

пробовал, но понял что это сложно для меня

нашел и сейчас использую Groovy плагин - mega menu plugin
подобное мега меню для вордпресс вставляется на автомате
и не надо мне лезть ковыряться с не понятным wordpress кодом
до этого пробовал на проектах UberMenu и Max, вообще зря потратил деньги
hero menu вообще не встал

@HectorPrima · 16.05.2019, 09:04

Не по теме:

Некропостер + реклама!

@rikitiki 0 / 0 / 0 Регистрация: 17.02.2013 Сообщений: 26
		1
	Установка компактного поиска в главном меню 27.12.2014, 07:04. Показов 2708. Ответов 11 Метки нет (Все метки) Скажите пожалуйста. а как установить компактно Поиск в главном меню WordPress, подобно тому как это сделано в темах: Avada, Vantage, Twenty Fourteen. Или в плагине UberMenu. В теме Avado мне больше всего нравится. Сайт выполненный на теме Avada: http://algolux.com/news/ Понятно что там картинка при клике на которую ниже появляется форма поиска. В Интернете немного пишут о выезжающих влево, расширяющихся формах поиска, но они требуют места. так как перекрывают пункты меню. И ещё добавлю что у меня фиксированое при скроллинге меню и хотелось. чтобы форма поиска также фиксировалась. Спасибо за ответы. 0

@loms 3 / 3 / 2 Регистрация: 10.10.2010 Сообщений: 55
	27.12.2014, 12:09	2
	Посмотрите здесь http://wphelper.ru/wordpress-x... wordpress/ 0

@tester2014 Учусь Wordpress 4 / 4 / 0 Регистрация: 23.09.2014 Сообщений: 394
	28.09.2015, 10:48	5
	спасибо,конечно,только "вы сейчас с кем разговаривали?"))) К сожалению я так ничего не понимаю. Могу только на уровне редактора - "вставьте этот кусок готового кода вот сюда". 0

@Dimon66620 50 / 24 / 5 Регистрация: 10.12.2013 Сообщений: 221
	01.10.2015, 12:57	6
	Во первых найдите не function.PHP в шаблоне, а тот файл которых отвечает за вывод шапки у вас в шаблоне или покажите index.php 0

@Dimon66620 50 / 24 / 5 Регистрация: 10.12.2013 Сообщений: 221
	01.10.2015, 17:04	8
	CSS и HTML знаете? 0

@tester2014 Учусь Wordpress 4 / 4 / 0 Регистрация: 23.09.2014 Сообщений: 394
	01.10.2015, 17:32	9
	нет Добавлено через 49 секунд я же писал что могу на уровне "вот это вставить туда" 0

@Dimon66620 50 / 24 / 5 Регистрация: 10.12.2013 Сообщений: 221
	01.10.2015, 17:36	10
	К сожалению мне писать лень могу вам только скинуть несколько сайтов для информации HTML, CSS http://htmlbook.ru/ все найдете через поиск Для вас особо важны элементы div, form, input Стили css : block Событие : onclick По javascript http://javascript.ru/tutorial/dom/modify Добавлено через 2 минуты Пишете все это и вставляете в район блока header-full 0

@qdi 0 / 0 / 0 Регистрация: 16.05.2019 Сообщений: 2
	16.05.2019, 08:17	11
	пробовал, но понял что это сложно для меня нашел и сейчас использую Groovy плагин - mega menu plugin подобное мега меню для вордпресс вставляется на автомате и не надо мне лезть ковыряться с не понятным wordpress кодом до этого пробовал на проектах UberMenu и Max, вообще зря потратил деньги hero menu вообще не встал 0

@HectorPrima
	16.05.2019, 09:04 Установка компактного поиска в главном меню #12
	Не по теме: Некропостер + реклама! 0