• ×

    • Хлебные крошки в WordPress средствами плагина Breadcrumb NavXT (усиливаем перелинковку). Хлебные крошки на WordPress блоге с плагином и без — пошаговая инструкция для новичков

    09.08.2019

    Добрый день читатели блога о заработке в интернете сайт Продолжаем крутить, вертеть и развивать блог с помощью самых необходимых плагинов на WordPress. Я не стал скакать с одной темы на другую, стараюсь расписывать все уроки по порядку, в определенной последовательности, для лучшего восприятия потенциальными вебмастерами и манимейкерами.


    Поэтому хочу до конца рассмотреть тему оптимизации в начале карьеры вебмастера. Сегодня как вы поняли мы продолжим разговор о внутренней перелинковке сайта. Более подробно об оптимизации сайта, как внешней так и внутренней, а так же о внутренней перелинковке вы можете ознакомится во вчерашнем уроке.

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

    Давайте немного отметим основные моменты seo оптимизации блога или сайта, если вы уже ознакомлены со вчерашним уроком, то можете пропустить этот абзац. Ключевыми моментами во внутренней оптимизации сайта будут являться:

    • Постановка ссылок с текста всей статьи, постановка именно тематических ссылок;
    • Постановка ссылок в конце статьи, желательно так же тематических;
    • Постановка ссылок вверху или шапке сайта, а также в сайдбаре, в котором нам необходимо ссылаться на сами статьи или категории.

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

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

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

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

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

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

    Одно неудобство так это ручной метод, когда то давно был у меня плагин который делал это автоматически, сейчас что то лень его найти и поставить, поэтому пока некоторые элементы внутренней перелинковки делаю вручную. (пока не забыл если кому интересно прочитать про для людей и для роботов, прошу. Поэтому чтобы особо себя не мучать будем совмещать, как ручные так и автоматические способы внутренней перелинковки сайта.

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

    1. Мы сами контролируем весь процесс.
    2. Самостоятельно выбираем анкоры, причем нужные нам.
    3. Можем сделать ее любой, на свое усмотрение.

    Правда есть и минус, мы потратим очень много своего времени.

    Одним из очень оригинальных, простых по своей задумке и достаточно эффективных во внутренней перелинковке плагинов, является плагин Breadcrumb NavXT, который в переводе с английского означает хлебные крошки.

    Сегодня задумался почему у него такое странное название, погуглил маленько эту тему и оказалось, что есть рассказ хлебные крошки, вернее есть немецкая сказка "Гензель и Гретта" , в которой родители хотели увести детей в лес и там оставить, ну а сын Гензель услышав разговор родителей припас себе кусочек хлеба, с помощью которого они смогли с сестрой выбраться из леса, оставляя за собой хлебные крошки.

    Этот рассказ хорошо показывает работу хлебных крошек - цепочка ссылок друг за другом, но причем тут интернет тематика и такая сказка про хлебные крошки я че то не понял.

    Кстати имейте ввиду что использование правильной внутренней перелинковки, использование таких сео плагинов как хлебные крошки, помогут значительно повысить вам Page Rank, один из показателей качества сайта, который присваивает поисковая система Google.

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

    Так что есть смысл использовать внутреннюю перелинковку, ведь у любого человека помимо цели сделать жизнь людей лучше, есть и корыстная в какой-то степени цель - заработать денег. Я сделал специально этот блог, чтобы каждый смог видеть что может добиться любой новичок следуя поэтапно за каждым уроком.

    Установка Breadcrumb NavXT на WordPress

    Разместить хлебные крошки плагина Breadcrumb NavXT можно практически в любом месте, старайтесь чтобы они размещались для удобства пользователей, все таки размещение их в футере будет как-то неуместно. У меня на сайте вы можете видеть их в верхней части шапки, это заложено самой темой, спасибо разработчикам.

    Там расположено меню хлебных крошек, которое обычно имеет вид Главная > страница . Некоторые сайты располагают меню хлебных крошек в файле Single.php, который отвечает за вывод статьи, у меня вы можете видеть там же пример хлебных крошек .

    Совет! Если вы хотите продвигаться без рубрик и главной странице, только по статьям, следует не использовать хлебных крошек, так как они разбавляют ссылочный вес.

    Так же по желанию есть возможность добавить код вызова в файлы Arhive.php, Page и Search. Устанавливаем плагин Breadcrumb NavXT хлебные крошки, делаем мы это уже не первый раз и думаю большинство уже запомнило этот процесс. Активируем плагин Breadcrumb NavXT. Код вызова данного плагина такой:

    if(function_exists("bcn_display")) { bcn_display(); } ?>

    а вставить его необходимо в приведенные файлы под приблизительно такую строку

    Ниже на рисунке вы можете увидеть куда вставлен Html код хлебных крошек

    Настройка плагина Breadcrumb NavXT

    У плагина Breadcrumb NavXT достаточно много настроек, давайте попробуем по порядку разобраться с каждой из них

    В главе разделитель обозначен мнемокод который будет выводится между ссылками хлебных крошек в данном случае он будет меть такой вид "ссылка > ссылка ". Если вы вставите этот код · то вид между ссылочном пространством будет иметь такой вид "ссылка ссылка ".

    Поле максимальная длина заголовка вашей ссылки, можно ограничить каким нибудь числом, для большей уникализации ссылки. Если поставить галочку в поле Ссылка на главную то вы сможете указать название главной ссылки. Изначально она идет с именем Home, если я не ошибаюсь. Основные настройки хлебных крошек на данном этапе закончены.

    Переходим к настройке текущая позиция, там настроек немного и нам необходимо поставить галочку для отображения текущей позиции в виде ссылки. Остальные настройки оставляем в не измененном виде, можете конечно поэкспериментировать. Единственное что хочу сказать, так это то, что Шаблон ссылки на запись поможет нам составить анкор для рубрик, архивов или главной страницы плагина Breadcrumb NavXT хлебные крошки в соответствующих разделах.

    Заканчиваю сегодняшний урок о хлебных крошках посредством плагина Breadcrumb NavXT. Если у вас возникли вопросы по тематике, задавайте их пожалуйста в комментариях.

    Следующий урок: .
    Предыдущий урок.

    Приветствую вас, уважаемые читатели блога сайт. В этой статье я покажу вам, как сделать навигационную строку, которую вы можете наблюдать у меня вверху перед началом заголовков статей. Данную цепочку навигаций мне делает простой плагин для WordPress — Breadcrumb NavXT , который переводится как «хлебные крошки».

    Данное название плагин получил из-за того, что его автору Джону Хавлику понравилась сказка про братьев Гримм, где мальчик Гензель сыпал хлебные крошки, чтобы по ним найти обратный путь. Правда было бы логичнее назвать плагин «камушки», так как по истории сказки Гензель и Гретель не смогли найти путь назад, так как хлебные крошки съели птицы. Ну да ладно, не в этом суть, главное, что этот плагин поможет посетителям не потеряться на вашем сайте и точно даст знать, где и в какой категории (части сайта) они сейчас находятся.

    К тому же плагин Breadcrumb NavXT помогает равномерно распределить статический вес по всем страницам сайта, что очень важно для его и продвижения в поисковых системах. На всякий случай, если вы считаете, что внутренняя перелинковка (оптимизация) сайта не так важна, то рекомендую почитать вам вот эту , из которой вы поменяете свою точку зрения.

    Итак, в этой статье я покажу вам, как реализовать данную навигацию у вас на сайте или блоге при помощи плагина Breadcrumb NavXT, а также простого кода.

    Установка плагина хлебных крошек Breadcrumb NavXT.

    1 ) Как обычно скачиваем плагин и закачиваем его на блог, активируем.

    2 ) Теперь нам нужно разместить специальный код в том месте, где вы хотите видеть строчку хлебных крошек. Для этого перейдите во «внешний вид» «редактор» и выберите файл, в который будете вставлять код. Чаще всего код плагина вставляют в файл «одна запись» (single.php) непосредственно перед или после заголовка статьи. Если вы совсем не разбираетесь в кодах, то просто ищите в самом начале кода два тега

    и , которые отвечают за вывод названия публикаций. У меня данный код выглядит так:</p> <p><b><h2>" title="<?php the_title (); ?>"><?php the_title (); ?></h2> </b></p> <p>Как найдете у себя нечто подобное, сразу же перед ним вставьте этот код хлебных крошек и обновите файл.</p> <p><b><?php </b><br><br><b>{ bcn_display (); } </b><br><b>?> </b></p> <p>Кстати, если вам не нравится горизонтальная навигация и вы хотите чтобы она отображалась вертикально, то вам нужно вместо предыдущего кода вставить этот.</p> <p><b><?php if (function_exists ("bcn_display_list")) </b><br><b>{ </b><br><b>bcn_display_list (); </b><br><b>}?> </b></p> <p>Гуд, как вы видите, у вас появилась навигационная строка, но без отображения даты публикации в самом конце, как у меня. Если хотите приделать ее к своей навигационной строке, то вам надо просто найти код в вашей теме оформления, который отвечает за вывод даты публикации, и добавить его после кода хлебных крошек.</p> <p><b><?php </b><br><b>if (function_exists ("bcn_display")) </b><br><b>{ bcn_display (); } </b><br><b>?><span>> <span>Опубликовано <?php the_time (" j F Y"); ?></span></div> </span> </b></p> <p>Если что-то непонятно, то > — выводит у меня такую вот стрелку > а буква j – обозначает день, F- месяц, Y- год. Думаю после таких объяснений, вам и самим не будет трудно найти такой код.</p> <p>Хорошо, теперь разберемся с дизайном. Сам стиль шрифта и цвет ссылок навигационной строки берутся из ваших стилей темы оформления, но если они вам не нравятся и вы их хотите изменить, то просто добавьте эту дополнительную строчку к коду, который мы вставляли выше.</p> <p><b><divclass="breadcrumb"></div> </b></p> <p>В итоге у вас должен будет получиться такой код:</p> <p><b><divclass="breadcrumb"> </b> </span><br><b><?php </b><br><b>if (function_exists ("bcn_display")) </b><br><b>{ </b><br><b> bcn_display ();> </b><br><b>} </b><br><b>?> </b><br><b></div> </b> </p> <p>Теперь зайдите во «внешний вид» «редактор» и откройте файл «таблица стилей» (style.css). И вставьте данный код практически в самый низ и обновите файл.</p> <p><b>.breadcrumb { </b><br><b>font:bolder 12px «Trebuchet MS», Verdana, Arial; </b><br><b>padding-bottom: 10px; </b><br><b>} </b><br><b>.breadcrumb a{ </b><br><b>color: #1B7499; </b><br><b>} </b><br><b>.breadcrumb a:hover { </b><br><b>color: #EF0E0E; </b><br><b>} </b></p> <p>Здравствуйте, уважаемые читатели блога сайт. Сегодня я хочу рассказать о плагине для WordPress, который используются на моем блоге сразу для двух очень важных целей.</p><p>Во-первых, он облегчает навигацию, а во-вторых, решает очень важную проблему — создание правильной внутренней перелинковки. Чтобы не затягивать интригу сразу скажу, что речь пойдет о плагине Breadcrumb NavXT. Но обо все по порядку.</p><p>Я уже много говорил о необходимости создания надлежащей перелинковки страниц сайта для того, чтобы статический вес, передаваемый по любым внешним ссылкам, равномерно распределялся по всем вебстраницам проекта. Особенно это важно .</p><h2>Зачем нужны хлебные крошки в WordPress</h2><p>Продвижение по НЧ имеет ряд преимуществ, главное из которых (особенно важно для не коммерческих проектов) — не требуется вложения денежных средств, необходимых для покупки внешних ссылок. Связано это с тем, что по НЧ можно продвигаться только за счет одной лишь внутренней сайта и за счет создания правильной перелинковки, как было описано .</p><p>Кстати, для коммерческих проектов раскрутка по НЧ тоже имеет целый ряд преимуществ, основным из которых опять же является меньшая стоимость, но кроме этого посетители, пришедшие с выдачи по таким запросам, будут гораздо чаще конвертироваться в денежные знаки, нежели посетители, пришедшие по запросам средне и высокочастотным (в связи с неконкретность последних).</p><p>Основная мысль правильной линковки сводится к тому, чтобы статический вес, передаваемый на разные страницы сайта (больше всего внешних ссылок обычно ведет на главную), без проблем перетекал на те, которые непосредственно продвигаются по НЧ (там, где, собственно, расположены статьи).</p><p>Но идеальная круговая схема, описанная в приведенной статье, трудно осуществима в реальных условиях, поэтому хорошим вариантом будет сферическая схема линковки. Грубо говоря, такую схему можно утрировать до того, что чем больше будет внутренних ссылок, тем лучше будет распределяться статический вес. Это похоже на разветвленную кровеносную систему, позволяющую крови донести кислород до всех, даже самых отдаленных от легких, внутренних органов.</p><p>Вы можете вручную добавлять каждый раз при написании статей линки на другие материалы вашего же сайта, которые будут уместны. Правда очень серьезно подходите к создаваемому таким образом внутреннему анкор-листу для каждой из статей. Делать это нужно примерно так же, как и . Не стоит употреблять во всех ссылках на нее один и тот же неразбавленный ключ, ну вы понимаете, о чем я.</p><p>Это очень хороший способ, но его всегда будет не лишним расширить и дополнить с помощью автоматических методов.Одним из самых распространенных вариантов организации чего то подобного являются, так называемые, хлебные крошки, расширяющие возможности навигации по ресурсу, а так же создание блока ссылок на другие похожие материалы вашего проекта, схожие по тематике с данной статьей.</p><p>Сегодня я хочу подробно рассмотреть первый вариант, а вот про похожие материалы для Вордпресс в .</p><p>Для реализации хлебных крошек мы будем использовать плагин Breadcrumb NavXT. В принципе, вы можете использовать для этих целей и другие плагины WordPress, но мне больше приглянулись именно эти. Можно даже .</p><h3>Установка плагина Breadcrumb NavXT в Вордпресс</h3><p>Ладно, пора переходить непосредственно к установке и настройке плагина. Если вы вдруг не знаете что такое хлебные крошки, то ничего страшного. Собственно, я тоже по началу не знал, ибо термин этот взят из буржунета и связан с их буржуйской сказкой про Гензеля и Грету, которые использовали их для того, чтобы пометить путь.</p><p>В нашем понимании, этот элемент навигации по сайту нужно было бы назвать «нить Ариадны», ибо нам как-то ближе. Ну, да ладно, как назвали, так и назвали. Итак, они обычно отображаются где-нибудь в верхней части окна сайта и фактически представляют из себя путь до той статьи, которую вы в данный момент читаете.</p><p>Мне, например, очень нравится навигация с помощью крошек и я всегда стараюсь найти их строчку на любом сайте для того, чтобы понять, а где я, собственно, нахожусь и как перейти в тот раздел, где находится данная замечательная статья, чтобы почитать еще на ту же тему.</p><p>Ну что, вспомнили что такое хлебные крошки? Думаю, что вспомнили, а если нет, то посмотрите в самом верху этого окна под шапкой этого блога.</p><p>Для начала вам нужно будет скачать Breadcrumb NavXT <b>отсюда </b> . Установка плагина на WordPress стандартная. Подключитесь к своему блогу по протоколу FTP (работа с клиентом FileZilla подробно описана ) и откройте на сервере папку:</p><p> /wp-content/plugins </p><p>Распакуйте архив с Breadcrumb NavXT и скопируйте получившуюся в результате папку на сервер хостинга в директорию (/wp-content/plugins). Теперь нужно будет зайти в админку Вордпресса, выбрать из левого меню пункт «Плагины», а в открывшемся окне перейти на вкладку «Неактивно». Найдите строчку с нужным и щелкните по расположенной чуть ниже надписи «Активировать».</p><h2>Вызов Breadcrumb NavXT и настройка внешнего вида крошек</h2><p>Вот, собственно, и все. Теперь осталась еще одна существенная деталь: выбрать место в шаблоне (теме) WordPress, где будет выводиться строка с хлебными крошками, и вставить в это место код функции плагина Breadcrumb NavXT. Задача не совсем тривиальная для начинающего вебмастера, мало знакомого со структурой движка и работой его тем.</p><p>Но вас, пожалуй, это в тупик не поставит, т.к. вы всегда можете почитать , благо, что там ничего сложно нет.</p><p>Если вы уже знакомы с устройством тем и знаете назначение тех или иных шаблонов в ней, то мы продолжим. Но, в противном случае, все же советую вам хотя бы поверхностно ознакомиться с этим, используя указанный выше материал (или какой-либо другой).</p><p>Итак, наша задача состоит в том, чтобы определить те файлы из папки с используемой вами темой, в которые мы должны будем вставить код вызова крошек. А затем нужно будет определиться, в какое именно место кода будем вставлять это:</p><p> <div class="breadcrumb"> <?php if(function_exists("bcn_display")) { bcn_display(); } ?> </div> </p><p>Во-первых, вам нужно подключиться к вашем блогу по FTP и открыть папку с темой, которую вы в данный момент используете:</p><p>Wp-content/themes/название темы WordPress </p><p>А теперь давайте вам расскажу, как сделал вывод хлебных крошек я сам, а вы сможете повторить все за мной, либо использовать свой вариант вставки.</p><p>Если попробовать наглядно представить предназначение шаблонов из темы, то получится примерно такой макет:</p><p>Из этого макета мы можем сделать вывод, что код вызова Breadcrumb NavXT нам нужно будет вставлять в те шаблоны, которые отвечают за вывод контента в центральной части блога: INDEX, SINGLE, ARCHIVE, PAGE или SEARCH.</p><p>Правда, я не стал выводить крошки в INDEX, отвечающий за формирование главной страницы WordPress, ибо там дополнительная навигация будет излишней.</p><p>Я вставил его в: SINGLE (отвечает за формирование страниц со статьями), ARCHIVE (формирует страницы рубрик, временных архивов, архивов тегов), PAGE (формирует в статические страницы, например, «О блоге»).</p><p>Код вызова Breadcrumb NavXT в эти шаблоны я вставлял в одно и тоже место — в самом начале, сразу после первой строки:</p><p> <?php get_header(); ?> </p><p>чтобы получилось так:</p><p> <?php get_header(); ?> <div class="breadcrumb"> <?php if(function_exists("bcn_display")) { bcn_display(); } ?> </div> </p><p>В файл таблицы каскадных стилей STYLE.CSS из папки с используемой темой я добавил несколько CSS свойств для класса BREADCRUMB:</p><p>Breadcrumb { font:bolder 12px "Trebuchet MS", Verdana, Arial; padding-bottom: 10px; } .breadcrumb a{ color: #1B7499; } .breadcrumb a:hover { color: #EF0E0E; } </p><p>Эти свойства задают внешний вид для хлебных крошек в WordPress: , а . Так же определяют цвет ссылок с хлебных крошек (.breadcrumb a) и цвет ссылок при наведении на них курсора мыши (.breadcrumb a:hover). Вообще советую ознакомиться странице.</p><h2>Возможности и настройки плагина Breadcrumb</h2><p>Вы вольны делать так, как захочется. Как говорится, хозяин — барин. Но этим мы только определили место вывода хлебных крошек и задали их внешний вид. Но у этого плагина еще довольно много настроек.</p><p>Для этого заходите в админку WordPress и выбираете из левого меню в области «Настройки» пункт «Breadcrumb NavXT». В открывшемся окне увидите несколько вкладок:</p><p><img src='https://i0.wp.com/ktonanovenkogo.ru/image/breadcrumb-navxt.png' height="607" width="541" loading=lazy></p><p>На вкладке «Общие» можете задать параметры, которые будут применены для всех страниц вашего блога. В поле «Разделитель» — задать символ, который будет служить разделителем в хлебных крошках. В моем случае это символ «>», который задается специальным кодом, т.к. символ «>» проставленный в явном виде, буде интерпретирован Вордпресс, как знак открывающегося HTML тега.</p><p>Вообще существует (мнемоник), которые, например, нельзя вставить напрямую. Вот некоторые из них:</p><p>Мнемокод Символ " " & & < < > > ¤ ¤ ¦ ¦ § § © ª ? « « ® ® ° ° ± ± µ µ ¶ ¶ · ¹ ? € € </p><p>Выбирайте любой понравившийся вам символ в качестве разделителя для хлебных крошек.</p><p>В поле «Максимальная длинна» вы можете задать длину анкора (текста ссылки) в символах. Я задал ограничение длины в 60 символов, исходя не из соображений дизайна, а из соображений оптимизации контента.</p><p>Поисковики могут неоднозначно относиться к ссылкам с одинаковыми анкорами, поэтому я и укорачиваю их в крошках для уникализации. Возможно, что это и не очень-то нужно, но так, на всякий случай.</p><p><img src='https://i0.wp.com/ktonanovenkogo.ru/image/plagin-breadcrumb-navxt.png' width="100%" loading=lazy></p><p>В полях «Префикс» и «Суффикс» можете ввести текст, который будет предшествовать или следовать после ссылки на главную в хлебных крошках.</p><p><img src='https://i0.wp.com/ktonanovenkogo.ru/image/breadcrumb-navxt-glavnay.png' width="100%" loading=lazy></p><p>Учтите, что этот текст будет помещен в атрибут TITLE тега A и, возможно, будет учтен поисковыми системами как альтернативный анкор. Это я к тому, что в нем следует употребить ключевые слова, относящиеся к главной странице вашего блога.</p><p>Не забудьте сохранить произведенные изменения в настройках плагина Breadcrumb NavXT с помощью одноименной кнопки. Далее вы можете пройтись по всем вкладкам. Например, на следующей сможете задать настройки для ссылки, которая будет вести на ту страницу, где вы сейчас находитесь:</p><p><img src='https://i0.wp.com/ktonanovenkogo.ru/image/nastroika-breadcrumb-navxt.png' width="100%" loading=lazy></p><p><img src='https://i1.wp.com/ktonanovenkogo.ru/image/breadcrumb-navxt-tekushay.png' width="100%" loading=lazy></p><p>На следующей вкладке «Записи / Страницы» можете настроить отображение ссылок на страницы со статьями и статические страницы вашего блога:</p><p><img src='https://i0.wp.com/ktonanovenkogo.ru/image/nastroika-hlebnye-kroshki.png' height="607" width="541" loading=lazy></p><p>Для статей я задал предшествующую надпись «Текущая статья» и заключил текст в кавычки с помощью мнемокода (список мнемокодов см. выше):</p><p><img src='https://i1.wp.com/ktonanovenkogo.ru/image/breadcrumb-navxt-statiy.png' width="100%" loading=lazy></p><p>Переходим на следующую вкладку «Рубрики». В принципе, здесь повторяются все те же настройки, что и на предыдущих. Я не стал задавать обрамление (префикс и суффикс) для ссылок на рубрики, но задал обрамление для страниц архивов:</p><p><img src='https://i1.wp.com/ktonanovenkogo.ru/image/hlebnye-kroshki-nastroiki.png' width="100%" loading=lazy></p><p>В результате на вебстраницах архива хлебные крошки выглядят так:</p><p><img src='https://i2.wp.com/ktonanovenkogo.ru/image/breadcrumb-navxt-rubriki.png' width="100%" loading=lazy></p> <p>Здравствуйте, уважаемые читатели! Сегодня речь пойдет о том, что такое хлебные крошки, какие функции они выполняют на блоге, а самое главное — как установить и настроить плагин Breadcrumb NavXT, позволяющий создать <b>хлебные крошки WordPress </b>.</p> <h2>Что такое хлебные крошки</h2> <p>«Хлебные крошки» показывают путь на блоге, по которому необходимо пройти от главной до текущей страницы. Это своего рода навигационная цепочка, каждое звено которой является ссылкой на страницу более высокого уровня. Самый высокий уровень — это главная блога. В идеале путь к любой странице блога от главной должен занимать максимум 3 клика мыши. Фактически, это <span>главная — категория — запись </span> или <span>главная — категория — категория — запись </span>, но никак не длиннее. Это необходимо для удобства не только пользователей, но и поисковых систем. Посты с более глубоким заложением поисковики могут индексировать с некоторой задержкой. К тому же их важность в глазах поисковиков уменьшается с увеличением уровня вложенности. Как следствие — ссылки на самые важные и интересные статьи на блоге старайтесь проставлять на главной.</p> <p>Подобную фишку на сайте называются по-разному — навигатор, навигационная цепочка, путь на сайте, но самым популярное название — это именно «хлебные крошки». Такое название пошло от сказки про Гензеля и Грету, в которой герои разбрасывали хлебные крошки, чтобы найти дорогу назад.</p> <p>Помимо удобства и навигации они выполняют еще одну важную функцию — улучшает внутреннюю перелинковку страниц блога. Ранее я уже рассказывал о трех важных и интересных плагинах, для внутренней перелинковки — , которые настоятельно рекомендую установить каждому на свой блог. Breadcrumb NavXT смело можно причислить к этому списку.</p> <p>Когда поисковики индексируют какую-то статью блога, они сразу видят к какой рубрики она относятся и полный путь до главной, что помогает им определить структура блога. Только не забудьте еще добавить на блог как для поисковиков, так и для пользователей.</p> <h2>Установка и настройка плагина Breadcrumb NavXT</h2> <p>Установка Breadcrumb NavXT несколько отличается от , поэтому рассмотрим ее подробно:</p> <p>2. Распакуйте архив и загрузите папку с файлами плагина на сервер в директорию wp-content/plugins. Для этого воспользуйтесь — FileZilla.</p> <p>3. Активируйте плагин через раздел «Плагины» панели администратора WordPress.</p> <p>4. Теперь необходимо вставить следующий код:</p> <p>Второе по популярности место — это шапка сайта. Для этого код необходимо вставить только в один шаблон — header.php . Точного места я не могу сказать, все зависит от темы. Здесь подойдет способ научного тыка — вставляете код, сохраняете, смотрите результат, не нравится — меняете местоположения кода в шаблоне.</p> <p>Некоторые продвинутые темы по умолчанию выводят хлебные крошки на блоге, но я бы посоветовал все-таки использовать плагин Breadcrumb NavXT, потому что он имеет более гибкие настройки. В таких случаях следует заменить стандартный код в шаблонах темы, отвечающий за вывод хлебных крошек, на код плагина, указанный выше. Стандартный код во многом должен быть похож на приведенный код плагина, поэтому найти его не составит труда (обычно он заключен в тег div, ID или class которого имеет тоже название — breadcrumb).</p> <p>После добавления кода, можно изменить внешний вид хлебных крошек WordPress. Для этого следует добавить стили к классу breadcrumb в файл style.css используемой темы. Конечно, для этого необходимо знать основы CSS, поэтому советую ознакомиться с бесплатным самоучителем по CSS от Влада Мержевича, который вы можете скачать с моего блога.</p> <p>Настройки плагина располагаются в разделе «Параметры» — «Breadcrumb NavXT». В интернете можно найти русификатор к нему, но, к сожалению, на последние версии плагина он встает очень криво — большая часть настроек так и остается на английском языке. Поэтому я рассматривать буду настройки именно на английском, давая перевод и свои комментария по самым важным пунктам.</p> <p>Первая закладка называется «General» — Общие.</p> <p><img src='https://i2.wp.com/fairheart.ru/wp-content/uploads/2012/04/Breadcrumb-NavXT-Settings.png' align="center" width="100%" loading=lazy></p> <p>Breadcrumb Separator — символ, который будет использоваться в качестве разделителями между звеньями навигационной цепочки.</p> <p>Breadcrumb Max Title Length — в качестве звена навигационной цепочки используется заголовок страницы, эта опция задает максимальную длину заголовка, 0 — используется заголовок целиком, не обрезая его.</p> <p>Home Breadcrumb — указывать или нет в хлебных крошках главную блога. Советую включить и задать ей имя в соответствии с названием вашего блога.</p> <p> — текст, который будет виден на главной блога, если это не ссылка.</p> <p><img src='https://i2.wp.com/fairheart.ru/wp-content/uploads/2012/04/Home-Template-Unlinked.png' align="center" height="70" width="363" loading=lazy></p> <p>Переходим на вкладку Current Item , что означает «Текущей пункт» или «Текущее местоположение».</p> <p><img src='https://i1.wp.com/fairheart.ru/wp-content/uploads/2012/04/nastroyka-Breadcrumb-NavXT.png' align="center" width="100%" loading=lazy></p> <p>Link Current Item — выводить название текущей страницы в качестве ссылки на нее же или нет.</p> <p>Paged Breadcrumb — поддержка постраничной навигации. После включения будут отображаться номера в хлебных крошках.</p> <p> — шаблон, определяющий название текущей позиции при включенной поддержки постраничной навигации.</p> <p>Следующий раздел называется «Post & Pages» — Записи и страницы.</p> <p>Post Taxonomy Display — показывать все варианты путей, ведущих к записи.</p> <p>Post Taxonomy — в вариантах путей к записи можно отображать. Для своего блога выбрал стандартный вариант — Рубрики.</p> <p>Page Template и Page Template (Unlinked) </span> — аналогичны рассмотренным выше Post Template и Post Template (Unlinked), только выводится будут для опубликованных статей.</p> <p>На очереди раздел «Categories & Tags» .</p> <p><img src='https://i1.wp.com/fairheart.ru/wp-content/uploads/2012/04/kategorii-i-tegi-Breadcrumb-NavXT.png' align="center" width="100%" loading=lazy></p> <p>В этом разделе задаются шаблоны для формирования хлебных крошек рубрик и тэгов. Просто действуйте по аналогии с рассмотренными выше шаблонами для записей.</p> <p>В разделе можно задать шаблоны для страницы автора (Author ), даты/архива (Date ), результатов поиска (Search ) и ошибки 404 .</p> <p><img src='https://i2.wp.com/fairheart.ru/wp-content/uploads/2012/04/Miscellaneous-Breadcrumb-NavXT.png' align="center" width="100%" loading=lazy></p> <p>Остальные опции я не использую, поэтому умничать о их назначении не буду.</p> <p>Ну вот во всем и разобрались! Поздравляю! На этом свое повествование заканчиваю и прощаюсь с вами, но не надолго, ибо скоро на моем блоге выйдет очередная интересная статья!</p> <p>Навигация «Хлебные крошки» позволяет посетителю сайта понять, в каком месте сайта он сейчас находиться в данный момент. Обычно такая навигация состоит из линии ссылок, которые расположены цепочкой под шапкой сайта.</p><p>Такая навигация идет с главной страницы сайта в рубрики, на страницы со статьями, на отдельные страницы сайта. Все ссылки в хлебных крошках являются активными, за исключением последней, потому что именно в этом месте сейчас находится посетитель и ссылка на эту страницу сайта не нужна.</p><p>Навигация хлебные крошки дополняет еще одним элементом внутреннюю перелинковку сайта и позволяет посетителю удобно перемещаться по страницам и разделам сайта, повышая этим поведенческие факторы.</p><p>Термин «Хлебные крошки» (по-английски Breadcrumbs) был взят из немецкой сказки братьев Гримм. В этой сказке дети отмечали свой путь в лес, оставляя после себя на своем пути хлебные крошки, чтобы ориентируясь по оставленным хлебным крошкам, у них оставалась возможность вернуться домой.</p><p>На своем блоге я уже описывал установку хлебных крошек с помощью плагина .</p><p>Хлебные крошки можно установить на свой сайт и без помощи специального плагина. В этом есть свои преимущества, так как при этом не будет повышаться нагрузка на ваш сайт. Поэтому желательно, там, где возможно, заменять используемые на сайте плагины, вставкой кода и различными скриптами.</p><p>Внимание! Перед установкой кода сделайте резервные копии файлов, в которые вы будете вставлять коды, чтобы в случае неполадок восстановить работоспособность вашей темы WordPress.</p><p>Для установки хлебных крошек вам необходимо будет вставить несколько кодов в соответствующие файлы вашей темы.</p><p>Устанавливать навигацию хлебные крошки на главную страницу блога не требуется. Посетитель, набирая в поиске название сайта, в абсолютном большинстве случаев, итак в выдаче будет направлен на главную страницу сайта.</p><p>Если посетитель пришел с поиска на конкретную страницу, то он будет видеть с помощью хлебных крошек свое местонахождение на сайте. Главная страница при этом будет гиперссылкой и посетитель сможет перейти на главную страницу, если воспользуется для этого навигацией хлебные крошки.</p><h2>Установка хлебных крошек на сайт</h2><p>Два варианта кода потребуется вставить в следующие файлы темы: «Функции темы (functions.php)», «Одна запись (single.php)», «Шаблон страницы (page.php)», «Архивы (arhvie.php)», «Результаты поиска (search.php)».</p><p>Первый код нужно будет вставить в файл «Функции темы (functions.php)», установленной на вашем блоге темы WordPress.</p><p> // хлебные крошки function dimox_breadcrumbs() { $showOnHome = 0; // 1 - показывать "хлебные крошки" на главной странице, 0 - не показывать $delimiter = "»"; // разделить между "крошками" $home = "Главная"; // текст ссылка "Главная" $showCurrent = 1; // 1 - показывать название текущей статьи/страницы, 0 - не показывать $before = "<span>"; // тег перед текущей "крошкой" $after = " </span>"; // тег после текущей "крошки" global $post; $homeLink = get_bloginfo("url"); if (is_home() || is_front_page()) { if ($showOnHome == 1) echo "<div id="crumbs">" . $home . "</div>"; } else { echo "<div id="crumbs">" . $home . " " . $delimiter . " "; if (is_category()) { global $wp_query; $cat_obj = $wp_query->get_queried_object(); $thisCat = $cat_obj->term_id; $thisCat = get_category($thisCat); $parentCat = get_category($thisCat->parent); if ($thisCat->parent != 0) echo(get_category_parents($parentCat, TRUE, " " . $delimiter . " ")); echo $before . single_cat_title("", false). $after; } elseif (is_day()) { echo "" . get_the_time("Y") . " " . $delimiter . " "; echo "" . get_the_time("F") . " " . $delimiter . " "; echo $before . get_the_time("d") . $after; } elseif (is_month()) { echo "" . get_the_time("Y") . " " . $delimiter . " "; echo $before . get_the_time("F") . $after; } elseif (is_year()) { echo $before . get_the_time("Y") . $after; } elseif (is_single() && !is_attachment()) { if (get_post_type() != "post") { $post_type = get_post_type_object(get_post_type()); $slug = $post_type->rewrite; echo "" . $post_type->labels->singular_name . " " . $delimiter . " "; if ($showCurrent == 1) echo $before . get_the_title() . $after; } else { $cat = get_the_category(); $cat = $cat; echo get_category_parents($cat, TRUE, " " . $delimiter . " "); if ($showCurrent == 1) echo $before . get_the_title() . $after; } } elseif (!is_single() && !is_page() && get_post_type() != "post" && !is_404()) { $post_type = get_post_type_object(get_post_type()); echo $before . $post_type->labels->singular_name . $after; } elseif (is_attachment()) { $parent = get_post($post->post_parent); $cat = get_the_category($parent->ID); $cat = $cat; echo get_category_parents($cat, TRUE, " " . $delimiter . " "); echo "" . $parent->post_title . " " . $delimiter . " "; if ($showCurrent == 1) echo $before . get_the_title() . $after; } elseif (is_page() && !$post->post_parent) { if ($showCurrent == 1) echo $before . get_the_title() . $after; } elseif (is_page() && $post->post_parent) { $parent_id = $post->post_parent; $breadcrumbs = array(); while ($parent_id) { $page = get_page($parent_id); $breadcrumbs = "ID) . "">" . get_the_title($page->ID) . ""; $parent_id = $page->post_parent; } $breadcrumbs = array_reverse($breadcrumbs); foreach ($breadcrumbs as $crumb) echo $crumb . " " . $delimiter . " "; if ($showCurrent == 1) echo $before . get_the_title() . $after; } elseif (is_search()) { echo $before . "Результаты поиска по запросу "" . get_search_query() . """ . $after; } elseif (is_tag()) { echo $before . "Записи с тегом "" . single_tag_title("", false) . """ . $after; } elseif (is_author()) { global $author; $userdata = get_userdata($author); echo $before . "Статьи автора " . $userdata->display_name . $after; } elseif (is_404()) { echo $before . "Error 404" . $after; } if (get_query_var("paged")) { if (is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author()) echo " ("; echo __("Page") . " " . get_query_var("paged"); if (is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author()) echo ")"; } echo "</div>"; } } // end dimox_breadcrumbs() </p><p>Для вставки этого кода в файл установленной на вашем сайте темы, нужно войти в «Админ-панель WordPress» => «Внешний вид» => «Редактор => «Шаблоны», и там нажать на пункт «Функции темы (functions.php)».</p><p>В окне «Редактировать темы», в файл «Функции темы ((functions.php)» потребуется вставить первый код в самом верху файла, после <?php, как это показано стрелкой на изображении.</p><p><img src='https://i2.wp.com/vellisa.ru/wp-content/uploads/2012/11/24.png' width="100%" loading=lazy></p><p>Название записи домашней страницы - «Главная», можно изменить по вашему желанию на название вашего сайта. Для этого в соответствующей строке кода нужно заменить слово «Главная» на название вашего сайта.</p><p>Если вы хотите, чтобы на странице сайта, в навигации хлебные крошки не отображалось название той страницы, на которой вы находитесь в данный момент, то для этого нужно в следующей строке поменять цифру «1» на цифру «0».</p><p>После вставки кода и сделанных в нем по вашему желанию изменений, нажимаете на кнопку «Обновить файл».</p><p>Следующий код нужно будет вставить в несколько файлов установленной у вас темы: «Одна запись (single.php)», «Шаблон страницы (page.php)», «Архивы (arhvie.php)», «Результаты поиска (search.php)».</p><p> <?php if (function_exists("dimox_breadcrumbs")) dimox_breadcrumbs(); ?> </p><p>В файл «Одна запись (single.php)», отвечающий за страницам со статьями, код вставляется в место, показанное на изображении.</p><p><img src='https://i0.wp.com/vellisa.ru/wp-content/uploads/2012/11/33.png' align="center" width="100%" loading=lazy></p><p>После вставки этого кода нужно нажать на кнопку «Обновить файл».</p><p>В файл «Архивы (arhvie.php)», вставляете этот код, в место, которое выделено в рамке на изображении.</p><p><img src='https://i1.wp.com/vellisa.ru/wp-content/uploads/2012/11/43.png' align="center" width="100%" loading=lazy></p><p>Потом нажимаете на кнопку «Обновить файл».</p><p>В файл «Результаты поиска (search.php)», отвечающий за поиск по сайту, вставляете код в место, указанное на изображении.</p><p><img src='https://i0.wp.com/vellisa.ru/wp-content/uploads/2012/11/53.png' align="center" width="100%" loading=lazy></p><p>После того, как вы вставили код, нажимаете на кнопку «Обновить файл».</p><p>В файл «Шаблон страницы (page.php)», отвечающий за статические страницы, вставляете код, как это показано на изображении.</p><p><img src='https://i1.wp.com/vellisa.ru/wp-content/uploads/2012/11/63.png' align="center" width="100%" loading=lazy></p><p>После установки кода нажимаете на кнопку «Обновить файл».</p><p>Все, теперь хлебные крошки установлены на вашем сайте. Вам нужно открыть свой сайт, и вы увидите установленную навигацию. Если в это время ваш сайт был открыт, то вам потребуется обновить страницу, чтобы увидеть сделанные изменения.</p><p>Можно еще добавить такой код в файл «Таблица стилей (style.ccs)»:</p><p> /* Хлебные крошки */ #crumbs { padding:10px 10px 0 15px; max-height:20px; overflow:hidden; line-height: 180%; border-radius:0 0 8px 8px; -moz- border-radius:0 0 8px 8px; -webkit- border-radius:0 0 8px 8px;} </p><p>Этот код вставляется в самом конце файла «Таблица стилей (style.ccs)» для изменения внешнего вида установленной навигации хлебные крошки. Код для вставки в файл «Таблица стилей (style.php)» может иметь и другие характеристики (размеры, отступы и т. д.). Вставлять такой или подобный код на свой блог совсем не обязательно.</p><p>На своем сайте, в предыдущем шаблоне, я не стал устанавливать этот код, мне больше понравился внешний вид хлебных крошек без этих улучшений.</p><h2>Выводы статьи</h2><p>Теперь на вашем блоге установлены Хлебные крошки без использования плагина. Создателем этой функции является известный блогер Dimox (Дмитрий).</p> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy>");</script> </div> </div> <div class="mb40 pr"> <div style="margin-top: 30px; margin-bottom: 35px;"> </div> <div style="margin-top: 0px; margin-bottom: 0px; font-family: Arial; font-size: 15px;"> <div id="yandex_rtb_R-A-105632-3"></div> </div> </div> <style> .sh_icon a:hover { opacity: 0.6; } </style> <div class="catTitle"> <span class="fl noLinknew">Похожие статьи</span> <div class="clr"></div> </div> <ul class="medbeArticle medbeEvents js-novinki "> <li id="bx_3218110189_16277"> <div class="info" style="position:relative;"> <a href="/kak-vyglyadit-samsung-not-8-samsung-galaxy-note8-sd835---tehnicheskie-harakteristiki/" class="date">2024-05-10 00:25:16</a> </div> <a href="/kak-vyglyadit-samsung-not-8-samsung-galaxy-note8-sd835---tehnicheskie-harakteristiki/"> <div class="title"> Samsung Galaxy Note8 SD835 - Технические характеристики </div> </a> <p class="text"> Информация о марке, модели и альтернативных названиях конкретного устройства, если таковые имеются. ДизайнИнформация о размерах и весе устройства, представленная в разных единицах измерения. Использованные материалы, предлагаемые цвета,... </p> <a href="/category/computer-literacy/" class="catName">Компьютерная грамотность</a> <div class="clr"></div> </li> <li id="bx_3218110189_16277"> <div class="info" style="position:relative;"> <a href="/notepad-skachat-russkii-poslednyaya-versiya-besplatnye-programmy-dlya-windows/" class="date">2024-05-09 00:25:26</a> </div> <a href="/notepad-skachat-russkii-poslednyaya-versiya-besplatnye-programmy-dlya-windows/"> <div class="title"> Бесплатные программы для Windows скачать бесплатно </div> </a> <p class="text"> Сегодня компьютерные технологии, стремительно развиваются, совершенствуя другие отрасли производства. Для развития других технологий, с помощью компьютерных, нужны специальные программы. Эти программы устанавливают на многие заводы и фабрики, чтобы... </p> <a href="/category/useful-programs/" class="catName">Полезные программы</a> <div class="clr"></div> </li> <li id="bx_3218110189_16277"> <div class="info" style="position:relative;"> <a href="/kak-vyvesti-raznoe-izobrazhenie-na-dva-monitora-dva-monitora-dlya/" class="date">2024-05-07 00:22:21</a> </div> <a href="/kak-vyvesti-raznoe-izobrazhenie-na-dva-monitora-dva-monitora-dlya/"> <div class="title"> Два монитора – для активных пользователей ПК </div> </a> <p class="text"> Инструкция Два сравнительно небольших экрана могут с легкостью заменить один широкоформатный с большой диагональю. Иногда подключение второго позволяет использовать одновременно несколько функций одного компьютера. Современные видеоадаптеры в... </p> <a href="/category/solving-problems/" class="catName">Решение проблем</a> <div class="clr"></div> </li> </ul> <div> </div> <div class="mb40 clear clearfix"> </div> </div> <div class="fr width300"> <div class="catTitle blackStyle"> <span class="fl noLink">Категории</span> <div class="clr"></div> </div> <div class="mb40"> <ul class="medbeSidebarNav"> <li> <a href="/category/windows-10/">Windows 10</a> </li> <li> <a href="/category/tips-for-beginners/">Советы начинающим</a> </li> <li> <a href="/category/internet-tips/">Интернет-подсказки</a> </li> <li> <a href="/category/useful-programs/">Полезные программы</a> </li> <li> <a href="/category/hardware-solutions/">Аппаратные решения</a> </li> <li> <a href="/category/configuring-wi-fi/">Настройка Wi-Fi</a> </li> <li> <a href="/category/solving-problems/">Решение проблем</a> </li> <li> <a href="/category/configuring-windows/">Настройка Windows</a> </li> </ul> </div> <div class="cancel-mb40"> </div> <div class="mb40 pr"> <div class="catTitle" data-click="y"> <span class="fl noLinknew">Видеоматериалы</span> <div class="frnew"></div> <div class="clr"></div> </div> <div class="medbeSidebarCarousel medbeArticle"> <ul> <li> <a href="/kak-otkryt-papku-v-komandnoi-stroke-na-windows-kak-otkryt-konsol-vypolnit-na/"> <img src="/uploads/99e89424f2adb11996a69d750d521e3c.jpg" alt="Как открыть консоль выполнить на windows 10" loading=lazy> <div class="playBg"></div> <p> Как открыть консоль выполнить на windows 10 </p> </a> <a href="/category/tips-for-beginners/" class="catName">Советы начинающим</a> </li> <!-- /next_post --> </ul> </div> </div> <div class="cancel-mb40"> </div> <div class="mb40"> <div class="mb40"> <div class="catTitle" data-click="y"> <span class="fl noLinknew">Популярное</span> <div class="frnew"></div> <div class="clr"></div> </div> <ul class="medbeArticle sidebarEvents"> <li> <a href="/peremeshchenie-profilya-polzovatelya-standartnymi-sredstvami-windows-kak-v-windows/"> <img src="/uploads/59fe7e573328d24871fe2935b9706c24.jpg" width="100px" alt="Как в Windows переместить папки пользователя на другой локальный диск?" loading=lazy> <div class="info"> <span class="date">Аппаратные решения</span> </div> <div class="title"> Как в Windows переместить папки пользователя на другой локальный диск? </div> <div class="clr"></div> </a> </li> <li> <a href="/u-23-e-mail-elektronnaya-pochta-tema-elektronnaya-pochta-e-mail-komu-i-dlya-chego-neobhodim/"> <img src="/uploads/32b8f60fc6487ae047c6a42f3fb2a833.jpg" width="100px" alt="Тема: электронная почта (e-mail)" loading=lazy> <div class="info"> <span class="date">Решение проблем</span> </div> <div class="title"> Тема: электронная почта (e-mail) </div> <div class="clr"></div> </a> </li> <li> <a href="/street-storm-skachat-obnovlenie-radar-detektory-street-storm-obnovlenie-po-obnovlenie/"> <img src="/uploads/234b2558a611dbf47b0c26f903df5f0d.jpg" width="100px" alt="Радар детекторы Street Storm обновление ПО" loading=lazy> <div class="info"> <span class="date">Решение проблем</span> </div> <div class="title"> Радар детекторы Street Storm обновление ПО </div> <div class="clr"></div> </a> </li> </ul> </div> </div> <div class="cancel-mb40"> </div> <div class="mb40"> <div class="catTitle" data-click="y"> <span class="fl noLinknew">Новое</span> <div class="frnew"></div> <div class="clr"></div> </div> <ul class="medbeArticle clinicsCountry"> <li> <a href="/bolshaya-kolonka-jbl-perenosnaya-portativnaya-kolonka-jbl-xtreme-pochemu-vazhno/"> <img src="/uploads/55aaef5f4bd5a6ba7762845849da826f.jpg" width="100px" alt="Портативная колонка JBL Xtreme" loading=lazy> <div class="title"> Портативная колонка JBL Xtreme </div> <div class="clr"></div> </a> </li> <li> <a href="/ne-rabotaet-perednii-usb-3-0-ne-rabotayut-usb-porty-na-kompyutere-puti-resheniya/"> <img src="/uploads/518aef24f67a32ffc762c4f21d5e85e8.jpg" width="100px" alt="Не работает передний usb 3" loading=lazy> <div class="title"> Не работает передний usb 3 </div> <div class="clr"></div> </a> </li> <li> <a href="/adobe-premiere-pro-obzor-programmy-chto-takoe-premiere-pro-trebuetsya-li/"> <img src="/uploads/b04d975347b64d93e62986431908dad6.jpg" width="100px" alt="Adobe premiere pro обзор программы" loading=lazy> <div class="title"> Adobe premiere pro обзор программы </div> <div class="clr"></div> </a> </li> <li> <a href="/skachat-programmu-dlya-remonta-sistemy-kompyutera-i-noutbuka/"> <img src="/uploads/d20fca631f1e5da11c7c4b6f4e938b70.jpg" width="100px" alt="Программы для восстановления системы" loading=lazy> <div class="title"> Программы для восстановления системы </div> <div class="clr"></div> </a> </li> <li> <a href="/windows-registraciya-failov-s-rasshireniem-dll-i-ocx-neskolko-sposobov/"> <img src="/uploads/ee68d4ebcb7b7883f88f35fd1163a207.jpg" width="100px" alt="Windows Регистрация файлов с расширением *" loading=lazy> <div class="title"> Windows Регистрация файлов с расширением * </div> <div class="clr"></div> </a> </li> </ul> </div> </div> </div> <div class="clr"></div> <div class="clr mb42-"></div> </main> </div> <footer class="footer"> <div class="footerWrap"> <ul class="footNav"> <li> <a href="/category/windows-10/">Windows 10</a> </li> <li> <a href="/category/tips-for-beginners/">Советы начинающим</a> </li> <li> <a href="/category/internet-tips/">Интернет-подсказки</a> </li> <li> <a href="/category/useful-programs/">Полезные программы</a> </li> </ul> <ul class="footNav mr0"> <li> <a href="/category/windows-10/">Windows 10</a> </li> <li> <a href="/category/tips-for-beginners/">Советы начинающим</a> </li> <li> <a href="/category/internet-tips/">Интернет-подсказки</a> </li> <li> <a href="/category/useful-programs/">Полезные программы</a> </li> </ul> <div class="footSep"></div> <div class="fl width405"> <div class="medbeWarning" style="font-size: 10px;"> Советы пользователям компьютера <p></p> <br /> </div> <div style="position:absolute; top:50px; right:15px; width:300px;"> <noindex> <br /> </noindex> </div> </div> <div class="footSep"></div> <div class="fl "> <div class="copyright"> <br /> <noindex> <div id="liv"> </div> <br> </noindex></div> <div style="position:absolute; top:50px; right:15px; width:300px;"> <noindex> <br /> </noindex> </div> </div> <div id="onTop"></div> <div class="clr"></div> <div class="links"></div> <div class="clr"></div> </div> </footer> <div class="overlay"></div> <div style="display: none;" id="ajax_result"></div> <div class="modal fade" id="send_message" tabindex="-1" role="dialog" aria-labelledby="message" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <a href="#" class="close" data-dismiss="modal" aria-hidden="true"></a> </div> <div class="modal-body"> <form action="/materials/sakharnyy-diabet/preparaty-insulina-i-insulinoterapiya/" method="POST"> <input type="hidden" name="sessid" id="sessid" value="190649912f2d5ccc3e7496471b00b5c2" /> <input name="head" type="text" placeholder="Тема" value=""> <textarea name="message" placeholder="Сообщения"></textarea> <input type="hidden" name="PARAMS_HASH" value="2d477b672b0c8e6bb03d8fa4ffc011a9"> <input type="submit" class="btn" name="submit" value="Отправить"> </form> </div> </div> </div> </div> <script type="text/javascript" data-skip-moving="true"> (function(w, d, n) { var cl = "bx-core"; var ht = d.documentElement; var htc = ht ? ht.className : undefined; if (htc === undefined || htc.indexOf(cl) !== -1) { return; } var ua = n.userAgent; if (/(iPad;)|(iPhone;)/i.test(ua)) { cl += " bx-ios"; } else if (/Android/i.test(ua)) { cl += " bx-android"; } cl += (/(ipad|iphone|android|mobile|touch)/i.test(ua) ? " bx-touch" : " bx-no-touch"); cl += w.devicePixelRatio && w.devicePixelRatio >= 2 ? " bx-retina" : " bx-no-retina"; var ieVersion = -1; if (/AppleWebKit/.test(ua)) { cl += " bx-chrome"; } else if ((ieVersion = getIeVersion()) > 0) { cl += " bx-ie bx-ie" + ieVersion; if (ieVersion > 7 && ieVersion < 10 && !isDoctype()) { cl += " bx-quirks"; } } else if (/Opera/.test(ua)) { cl += " bx-opera"; } else if (/Gecko/.test(ua)) { cl += " bx-firefox"; } if (/Macintosh/i.test(ua)) { cl += " bx-mac"; } ht.className = htc ? htc + " " + cl : cl; function isDoctype() { if (d.compatMode) { return d.compatMode == "CSS1Compat"; } return d.documentElement && d.documentElement.clientHeight; } function getIeVersion() { if (/Opera/i.test(ua) || /Webkit/i.test(ua) || /Firefox/i.test(ua) || /Chrome/i.test(ua)) { return -1; } var rv = -1; if (!!(w.MSStream) && !(w.ActiveXObject) && ("ActiveXObject" in w)) { rv = 11; } else if (!!d.documentMode && d.documentMode >= 10) { rv = 10; } else if (!!d.documentMode && d.documentMode >= 9) { rv = 9; } else if (d.attachEvent && !/Opera/.test(ua)) { rv = 8; } if (rv == -1 || rv == 8) { var re; if (n.appName == "Microsoft Internet Explorer") { re = new RegExp("MSIE ([0-9]+[\.0-9]*)"); if (re.exec(ua) != null) { rv = parseFloat(RegExp.$1); } } else if (n.appName == "Netscape") { rv = 11; re = new RegExp("Trident/.*rv:([0-9]+[\.0-9]*)"); if (re.exec(ua) != null) { rv = parseFloat(RegExp.$1); } } } return rv; } })(window, document, navigator); </script> <link href="/bitrix/cache/css/s2/medbe4_new/kernel_main/kernel_main.css?151557967426562" type="text/css" rel="stylesheet" /> <link href="/bitrix/cache/css/s2/medbe4_new/page_7b72513555721c1b5733d9b22d6efb9b/page_7b72513555721c1b5733d9b22d6efb9b.css?15155796623852" type="text/css" rel="stylesheet" /> <link href="/bitrix/cache/css/s2/medbe4_new/template_fa4e83195cbc9d75f36051d9e26d67c6/template_fa4e83195cbc9d75f36051d9e26d67c6.css?1515579660217752" type="text/css" data-template-style="true" rel="stylesheet" /> <link media="all" href="/local/templates/medbe4_new/css/responsive.css?sd" rel="stylesheet" type="text/css" /> <!--[if lt IE 9]><![endif]--> <script type="text/javascript"> if (!window.BX) window.BX = {}; if (!window.BX.message) window.BX.message = function(mess) { if (typeof mess == 'object') for (var i in mess) BX.message[i] = mess[i]; return true; }; </script> <script type="text/javascript"> (window.BX || top.BX).message({ 'JS_CORE_LOADING': 'Загрузка...', 'JS_CORE_NO_DATA': '- Нет данных -', 'JS_CORE_WINDOW_CLOSE': 'Закрыть', 'JS_CORE_WINDOW_EXPAND': 'Развернуть', 'JS_CORE_WINDOW_NARROW': 'Свернуть в окно', 'JS_CORE_WINDOW_SAVE': 'Сохранить', 'JS_CORE_WINDOW_CANCEL': 'Отменить', 'JS_CORE_WINDOW_CONTINUE': 'Продолжить', 'JS_CORE_H': 'ч', 'JS_CORE_M': 'м', 'JS_CORE_S': 'с', 'JSADM_AI_HIDE_EXTRA': 'Скрыть лишние', 'JSADM_AI_ALL_NOTIF': 'Показать все', 'JSADM_AUTH_REQ': 'Требуется авторизация!', 'JS_CORE_WINDOW_AUTH': 'Войти', 'JS_CORE_IMAGE_FULL': 'Полный размер' }); </script> <script type="text/javascript"> (window.BX || top.BX).message({ 'LANGUAGE_ID': 'ru', 'FORMAT_DATE': 'DD.MM.YYYY', 'FORMAT_DATETIME': 'DD.MM.YYYY HH:MI:SS', 'COOKIE_PREFIX': 'BITRIX_SM', 'SERVER_TZ_OFFSET': '3600', 'SITE_ID': 's2', 'SITE_DIR': '/', 'USER_ID': '', 'SERVER_TIME': '1515581305', 'USER_TZ_OFFSET': '0', 'USER_TZ_AUTO': 'Y', 'bitrix_sessid': '190649912f2d5ccc3e7496471b00b5c2' }); </script> <script type="text/javascript" src="/bitrix/cache/js/s2/medbe4_new/kernel_main/kernel_main.js?1515579673298080"></script> <script type="text/javascript" src="/bitrix/js/main/core/core_db.min.js?14979660558699"></script> <script type="text/javascript" src="/bitrix/js/main/core/core_frame_cache.min.js?146900780711191"></script> <script type="text/javascript"> BX.setJSList(['/bitrix/js/main/core/core.js', '/bitrix/js/main/core/core_ajax.js', '/bitrix/js/main/json/json2.min.js', '/bitrix/js/main/core/core_ls.js', '/bitrix/js/main/core/core_fx.js', '/bitrix/js/main/core/core_popup.js', '/bitrix/js/main/session.js', '/bitrix/js/main/core/core_window.js', '/bitrix/js/main/core/core_date.js', '/bitrix/js/main/utils.js', '/local/templates/medbe4_new/js/jquery.js', '/local/templates/medbe4_new/js/jquery.jcarousel.min.js', '/local/templates/medbe4_new/js/jquery.formstyler.min.js', '/local/templates/medbe4_new/js/jquery.mCustomScrollbar.concat.min.js', '/local/templates/medbe4_new/js/modals.js', '/local/templates/medbe4_new/js/tabs.js', '/local/templates/medbe4_new/js/ontop.js', '/local/templates/medbe4_new/js/placeholder.min.js', '/media/js/scrollbar/jquery.mCustomScrollbar.concat.min.js', '/media/js/header.js', '/local/templates/medbe4_new/js/scripts.js', '/feedback/twin.js']); </script> <script> BX.ready(function() { $("[data-preload]").each(function(i, el) { $this = $(el); $this.load($this.data("preload"), function() { $this.find("form").addClass("js-form") }); }); $(document).on({ submit: function() { $this = $(this); var action = $this.attr("action"); var data = $this.serialize() + "&web_form_submit=Y"; $.post(action, data, function(data) { $this.closest("div").html(data); }) return false; } }, ".js-form"); }) </script> <script type="text/javascript" src="/bitrix/cache/js/s2/medbe4_new/template_a5d224f830c08eebc70bc5559ca1712e/template_a5d224f830c08eebc70bc5559ca1712e.js?1515579660221230"></script> <script> $(function() { if ('jcarousel' in $) { $('.medbeCarousel').jcarousel({ // Configuration goes here }); $('.medbeCarousel-prev').jcarouselControl({ target: '-=1' }); $('.medbeCarousel-next').jcarouselControl({ target: '+=1' }); $('.medbeSidebarCarousel').jcarousel({ // Configuration goes here }); $('.medbeSidebarCarousel-prev').jcarouselControl({ target: '-=1' }); $('.medbeSidebarCarousel-next').jcarouselControl({ target: '+=1' }); $(window).on("load resize", function() { var w = this.innerWidth; if ($('.medbeCarousel').hasClass('halfWidthCarousel')) { if (w > 1279) { c = 771; } else { c = 377; } } else { if (w > 1279) { c = 1160; } else { c = 780; } } $('.medbeCarousel').css('width', c + 'px'); }); } }); // Script (Fixed menu) // $(window).on("scroll load", function(){ // var w2 = this.innerWidth; // var top = $(window).scrollTop(); // if (top > 120) $('.mainNav > ul').css({ // 'max-width': '100%', // 'position': 'fixed', // 'top': 0 // } ); // else { // $('.mainNav > ul').css({ // 'position': 'relative', // 'max-width': 1280 // } ); // } // } ); jQuery(window).scroll(function() { topMain(); // on scroll }); topMain(); // on load window.topNavSmall = false; function topMain() { var _scrollTop = jQuery(document).scrollTop(); if (_scrollTop > 0) { jQuery('.mainNav').addClass('fixed'); window.topNavSmall = true; } if (window.topNavSmall === true && _scrollTop < 2) { jQuery('.mainNav').removeClass('fixed'); } } </script> <script> </script> <script> (function($) { $(function() { $('#pc_add_photo').styler({ filePlaceholder: 'Добавить фото перед статьей' }); $('input, select').styler(); }) })(jQuery) </script> <script> (function($) { $(window).load(function() { if ('mCustomScrollbar' in $) $(".medbeScrollBlock").mCustomScrollbar(); }); })(jQuery); </script> <script> $(document).ready(function() { $("#sorting_catalog").change(function() { $("#form_for_sorting_catalog").submit(); }); }); </script> <script> $(document).ready(function() { $('.catTitle').click(function() { if ($(this).data("click") != "y") { $(this).parents('.doctorMat').toggleClass('hidden'); return false } }); }); </script> <script> $(document).ready(function() { $('input, textarea').on('focus blur', function() { var placeholder = $(this).attr('placeholder'); if ($(this).val() == placeholder) { $(this).val(''); } else if ($(this).val() == '') { $(this).val(placeholder); }; }); }); </script> <script> $(document).ready(function() { //Placeholder $('input[placeholder], textarea[placeholder]').placeholder(); }); </script> <script type="text/javascript"> function slyLink() { var istS = 'Источник:'; var copyR = '© usercpu.ru'; var body_element = document.getElementsByTagName('body')[0]; var choose; choose = window.getSelection(); var myLink = document.location.href; var authorLink = "<br /><br />" + istS + ' ' + "<a href='" + myLink + "'>" + myLink + "</a><br />" + copyR; var copytext = choose + authorLink; var addDiv = document.createElement('div'); addDiv.style.position = 'absolute'; addDiv.style.left = '-99999px'; body_element.appendChild(addDiv); addDiv.innerHTML = copytext; choose.selectAllChildren(addDiv); window.setTimeout(function() { body_element.removeChild(addDiv); }, 0); } document.oncopy = slyLink; </script> <script> $(function() { /*$(document).on("click", ".js-open-menu-a", function(){ $("#mainNav").slideToggle(200); } );*/ /* $(document).on({ click: function(){ $(this).siblings("nav").slideToggle(200); } , /!*touchend: function(){ $(this).siblings("nav").slideToggle(200); } *!/ } ,".js-open-menu");*/ }); </script> <script> var busy = false; $(function() { $("#infinity-next-page").addClass("btn").addClass("btn-blue"); $(document).on({ click: function() { if (busy) return false; console.log("1"); $("#nextWrap").find("a").css("opacity", 0.5); busy = true; $.post($(this).attr("href") + "&ajaxNovinki=Y", function(data) { busy = false $(".js-novinki").html($(".js-novinki").html() + data.html); $("#nextWrap").html(data.next); $("#infinity-next-page").addClass("btn").addClass("btn-blue"); //else $("#nextWrap").hide(); }, "json"); return false; } }, "#infinity-next-page"); }); </script> <script> $(document).ready(function() { $("#headfbwin, #feed").click(function() { $(".quest_form").show(); $('input, select').styler(); dh = $(document).height() + "; " + $(".quest_form").height(); h = ($(document).height() / 2) * -1; $(".quest_form").css("bottom", h + "px"); $(".overlay").show(); $(".q_form_close").click(function() { $(".quest_form").hide(); $(".overlay").hide(); }); $(".close2").click(function() { $(".oki").hide(); $(".overlay").hide(); }); $(".overlay").click(function() { $(".quest_form").hide(); $(".oki").hide(); $(".overlay").hide(); }); }); }); </script> <script> function selectHandler() { var $menu = $('.news-categories__list'); var $current = $('.news-categories__current'); var width = 0; if ($menu.outerWidth() > $current.outerWidth()) { $current.width($menu.outerWidth()); $menu.width($menu.outerWidth()); } $('.news-categories__current').click(function() { $menu.toggleClass('active'); }); $('body').click(function(e) { var $target = $(e.target); if (!$target.parents('.news-categories').length) $menu.removeClass('active'); }); $('.news-categories__list > ul').mCustomScrollbar({ theme: 'rounded', scrollInertia: 200 }); $('ul.tabs').delegate('li:not(.current)', 'click', function() { $(this).addClass('current').siblings().removeClass('current') .parents('div.section').find('div.box').hide().eq($(this).index()).fadeIn(150); }) } if (window.frameCacheVars !== undefined) { BX.addCustomEvent("onFrameDataReceived", function(json) { selectHandler(); }); } else { BX.ready(function() { selectHandler(); }); } </script> <script async src="/js/html5.js"></script> <script src="/local/templates/medbe4_new/components/bitrix/form.result.new/free_cons/_script.js?dsss" type="text/javascript"></script> </body> </html>