Mini-ats102.ru

ООО “Мультилайн”
1 просмотров
Рейтинг статьи
1 звезда2 звезды3 звезды4 звезды5 звезд
Загрузка...

Мета теги в 1с-Битрикс

Мета теги в 1с-Битрикс

Здравствуйте читатели thisis-blog.ru ! Многие задаются вопросом, как в CMS 1с-Битрикс проставлять или настраивать мета теги. Моя последняя работа была связана с интернет магазином версии «1С-Битрикс: Управление сайтом «12.5.11». Дальнейшее сравнение будет приводится с этой версией. Выход «1С-Битрикс: Управление сайтом 14.0.0» порадовал нас таким дополнением, как возможность задать SEO информацию(параметры). Благодаря ему стало довольно удобно с помощью шаблонов генерировать title, description, keywords, заголовок и др. свойства влияющие на seo. Можно это сделать глобально во вкладке SEO инфоблока (рис. 1,рис. 2, рис. 3).

рис. 1 рис. 1
masks-meta-infoblock2 рис. 2
masks-meta-infoblock3 рис. 3

Также предусмотрена возможность изменить шаблон непосредственно при создании элемента этого инфоблока, замазанный текст (военная тайна =) ) – это предварительный вариант полученный по маске инфоблока (рис. 4).

masks-meta рис. 4

Желательно заполнить все поля. Устанавливаете маски как вам угодно , с учетом логики конечно и предварительно промоделировав результат. Советую ознакомиться со статьей о мета тегах здесь.

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

Настроить мета теги в компоненте комплексный каталог.

В компоненте комплексный каталог предусмотрена работа с мета тегами. Вы можете:

  • Дополнительные настройки->Устанавливать заголовок страницы

seo-parametr рис. 5

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

  • Настройки списка->
  1. Установить ключевые слова страницы из свойства раздела;
  2. Установить описание страницы из свойства раздела;
  3. Установить заголовок окна браузера из свойства раздела(рис. 6).

seo-parametr2рис. 6

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

  • Настройки детального просмотра->
  1. Установить ключевые слова страницы из свойства;
  2. Установить описание страницы из свойства;
  3. Установить заголовок окна браузера из свойства (рис. 7).

Этими тремя пунктами вы настраиваете мета теги в bitrix для детальной страницы (вашего товара либо услуги).

seo-parametr3 рис. 7

Тут всё ясно выбираем свойства из выпадающего списка, значения которых удовлетворяют опциям. Главный минус, нельзя использовать шаблоны и как-то сочетать свойства(т.е. например описание страницы сразу из 2-ух свойств) .

Проставлять мета теги в шаблоне компонента.

Добавляете в шаблоне карточки товара следующий код:

Преимущество этого метода – мобильность. Тут мы не ограничены, как в компоненте и можем делать любые сочетания свойств и т. п. . По сути разработчики компании 1с-битрикс с обновлением 14.0.0, как раз избавили нас от этого способа. Теперь даже не зная php и html можно создать свой шаблон мета тегов.

Воспользоваться бесплатным модулем от маркетплейса.

Например этим . Его минус, но для кого-то может это и плюс – это статичное заполнение метатегов. Вам предоставляются дополнительные поля, которые для каждого товара вы сами ручками заполните(рис. 8, рис. 9).

seo_1 рис. 8
seo_2 рис. 9

Статья про управление мета-тегами.

Советую также прочитать интересную статьей с кейсом — «как избежать лишних трат и о несостыковках между программистом и SEO специалистом» тут. Их решение (уже бесплатное) SEO инструменты: Управление метатегами PRO.

Набор функций работы с метаданными 1с-Битрикс.

Набор функций работы с метаданными собраны здесь. Самые используемые и полезные функции для работы с метаданными.

Читайте так же:
Интересные приложения в аппсторе

Экспресс-решения для успешного представления вашего бизнеса в интернете

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

Чтобы при подготовке шаблона для каждого клиента добиться лучших результатов, компания iMedia Solutions подключает к работе опытных ведущих программистов, дизайнеров, бизнес-аналитиков, менеджеров, разработчиков, СЕО-специалистов. Закажите сайт на Битриксе у нашей компании, чтобы использовать современные возможности IT для успеха вашего бизнеса.

Индивидуальный дизайн для страницы 404ой ошибки

UPD: модуль обновился до версии 1.1.0. Теперь он поддерживает многосайтовость!

UPD: Я больше не занимаюсь Битриксом, модуль не развиваю и, вообще, статья устарела ((

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

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

Страница 404ой ошибки Хабра

Дефолтный вариант

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

Стандартная страница 404ой ошибки в Битриксе

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

Это код файла 404.php , размещённого в корне сайта. Он подключается тогда, когда возникла ошибка. В него можно написать все, что угодно. Нельзя только изменить окружающий дизайн, а именно этого мы и хотим. Едем дальше.

Переадресация

Впервые с проблемой отдельного шаблона для 404ой ошибки я столкнулся тогда, когда на сайте использовалось несколько шаблонов, и не в каждый из них можно было просто так вставить содержимое указанного выше файла. На мой вопрос «как задать отдельный шаблон для 404ой» техподдержка ответила буквально следующее:

  1. В настройках сайта задайте для страницы /404.php свой шаблон сайта.
  2. Внесите изменения в файл /404.php

То есть получается, что при возникновении ошибки пользователь редиректится на нужную нам страницу, для которой мы предварительно задали нужный шаблон. Способ волшебным образом решает нашу проблему, но создаёт новую: в адресной строке пользователь больше не видит адрес ошибочной страницы, теперь у него всегда отображается http://my_domain.ru/404.php . Некоторое время для меня это неудобство не было критичным и сейчас есть несколько сайтов, где эта ошибка так и выводится, например тут: http://www.boomcard.ru/takoi_stranicy_net (UPD: теперь на новой версии сайта тоже работает мой модуль). Однако прогресс не стоит на месте и нам пора двигаться дальше.

Страница без шаблона

Этот способ первым пришёл не в мою голову, а в голову Wet’а. Заключается он в том, мы вообще не станем подключать шаблон для нашей страницы. Это делается так. Вместо обычного подключения пролога

Читайте так же:
Битрикс получить торговые предложения товара

мы подключим только их служебные части:

Таким образом, шаблон не подключится совсем. Побочный эффект этого метода — не работают отложенные функции, которые выводят данные в визуальную часть пролога, а это значит, что скрипты, стили и мета-теги нам придётся подключать вручную, зато в теле страницы по-прежнему можно вызывать компоненты и творить прочие безобразия. Таков принцип демонстрирует вот эта страница: http://ex-primo.com/takoi_stranicy_net. Вот теперь мы вплотную приблизились к моему любимому способу.

Отдельный шаблон

Помнишь, дорогой читатель, как мы во втором способе сделали для страницы ошибки отдельный шаблон? Тогда мы привязали его к странице с определённым адресом. Но что мешает привязать его по какому-нибудь другому параметру? Если присмотреться к коду страницы 404.php , то можно увидеть, что там определяется константа ERROR_404 . Давайте к ней и привяжем шаблон! Для этого в настройках сайта укажем, что наш шаблон будет использоваться при выполнении такого условия PHP:

Ву а ля! Теперь по любому адресу будет выводиться страница ошибки в её уникальном шаблоне. И шаблон, и саму страницу можно редактировать как обычно, использовать обычным образом компоненты и подключать скрипты. Именно так работает страница 404ой ошибки на сайте, работу над которым я недавно закончил:

Вот и сказке конец, а кто слушал — огурец 🙂

UPD. Шаблон для несуществующих секций и элементов.

В комментах было верно подмечено, что в некоторых случаях битрикс не может вывести нужный нам шаблон 404ой ошибки. Это случается, когда такую ошибку возвращает компонент, находящийся на странице. И действительно, код компонента срабатывает уже после выбора шаблона страницы, поэтому всё, что ему остаётся, это вывести сообщение об ошибке прямо в область контента. В итоге мы видим неказистую страницу с надписью «Элемент не найден» или «Раздел не найден».

Стандартное сообщение битрикса о ненайденном элементе

Как убрать эту надпись, а заодно и весь окружающий дизайн, заменив его нашим красивым шаблоном? Нам поможет событие OnEpilog , которое возникает в самом конце выполнения страницы. В его обработчике мы очистим буфер, который был так старательно сгенерирован всеми компонентами, расположенными на странице, и заменим его страницей ошибки. Обработчик будет выглядеть так:

Здесь мы сначала сбрасываем буфер, а потом вручную подключаем header нашего шаблона, файл ошибки и, наконец, footer шаблона.

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

Вставка галереи в тело статьи

Для начала нам нужно кастомизировать компонент news.detail новостного раздела, не важно отдельный это компонент или входит в состав комплексного. Нам потребуется отредактировать файл result_modifier.php, template.php и component_epilog.php, начнём с result_modifier.php.

Первым делом скопируйте шаблон компонента на основе которого сделан раздел новостей, в моём случае это комплексный компонент bitrix:news, копируем шаблон компонента в дефолтный шаблон сайта, я назвал его news_block. Далее идём в папку компонент news.detail, т.е. /bitrix/templates/.default/components/bitrix/news/news_block/bitrix/news.detail/.default/ и создаём файлыresult_modifier.php иcomponent_epilog.php. В result_modifier.php необходимо добавить следующий код для кеширования шаблона.

В файл component_epilog.php нужно вставить специальную конструкцию, которая будет искать в теле статьи «хеш-тег» #GALLARY_ID_123# где 123 — идентификатор галереи (элемента инфоблока) и подгружать на его место компонент галереи (который мы ранее настроили) с переданным в него ID-шником 123. Весь код выглядит так:

Читайте так же:
Восстановление imei spreadtrum sc7731

а в конце кода пишем:

Манипуляции с component_epilog.php сделаны чтобы обойти кеширование. Как вы уже поняли весь этот «финт» основан на манипуляции буфера вывода.

Редактирование пунктов меню

Создание и редактирование пунктов меню происходит в публичной части сайта. Выглядит это следующим образом:

Создание и редактирование пунктов меню

Создание и редактирование пунктов меню

Изменения будут видны сразу после нажатия кнопки «сохранить». При этом отредактировать пункты можно как в публичной, так и в административной части веб-ресурса.

Редактирование в публичном разделе сайта

Переходим в редактор, что находится в разделе «правки». Наводим курсором на нужное меню и жмем кнопку «редактировать пункты меню».

Редактирование пунктов меню через публичный раздел сайта

Редактирование пунктов меню через публичный раздел сайта

Затем всплывет окно, где вы можете поменять существующие пункты, либо включить новые.

Всплывающее окно для редактирования меню

Всплывающее окно для редактирования меню

Здесь же вы можете открыть окно с редактированием меню в административном разделе.

Редактирование в административном разделе сайта

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

Управление меню в административном разделе Битрикс

Управление меню в административном разделе Битрикс

Нажмите кнопку «редактировать меню». У вас откроется соответствующая форма:

Редактирование меню в Bitrix

Редактирование меню в Bitrix

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

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

Расширенный режим редактирования меню

Расширенный режим редактирования меню

Интегрируем статическую html+css вёрстку

Из исходного шаблона берём 3 папки с файлами:

  • css
  • img
  • js

и копируем в папку /bitrix/templates/stylish/

Пока не будем обращать внимания на тот факт, что в нашем шаблоне папка img содержит не только изображения из шаблона, но и контент! На взгляд автора данной статьи это ошибка верстальщика, с которой нам ещё предстоит разобраться.

Настал этап, когда мы приступим к добавлению кода HTML разметки шаблона. Для этого возьмём макет главной страниц index.html из исходного кода шаблона.

Цветами отмечены участки кода, которые относятся к разным блокам в соответствии с разметкой, проведённой в УРОКЕ 0:

  • Красный — header.php (или в шаблон сайта ВЫШЕ #WORK_AREA#
  • Жёлтый — footer.php (или в шаблон сайта НИЖЕ #WORKAREA#)
  • Зелёный — тело страницы

Мы рекомендуем не брать код напрямую из урока, а самостоятельно найти границы блоков (например использую редактор кода notepade++ с подсветкой синтаксиса). Во-первых, это важная часть обучения процессу интеграции дизайна — правильно определить где заканчивается какой блок. А во-вторых, здесь могла быть сбита табуляция, так что код может быть менее читабелен, чем в оригинале.

Как можно заметить, мнение автора статьи о разбитии вёрстки на рабочую область подвал и шапку не совпадает с мнением автора шаблона.

Образцы созданных файлов:

  • /bitrix/templates/stylish/header.php
  • /bitrix/templates/stylish/footer.php
  • /index.php (зелёный код добавляем в содержимое страницы в корне сайта)
Читайте так же:
Ил 2 штурмовик битва за сталинград моды

Теперь применим наш статический шаблон к имеющемуся сайта (состоящему пока из 1 страницы), для этого в административном разделе выбираем:

Настройки → Настройки продукта → Сайты → Сайты

Нажмём на ID интересующего нас сайта (в данном случае он один, поскольку мы используем чистую систему, однако у вас может быть список):

Настройки сайта

На странице редактирования настроек сайта нас интересует самый нижний блок — «Шаблоны». Здесь мы выберем шаблон и установим условия для его использования на сайте. Поскольку у нас всего 1 шаблон и он используется для всего сайта, то мы не будем использовать условия и оставим индекс сортировки по-умолчанию:

Выбор шаблона в настройках сайта

Если вы интегрируете шаблон на уже работающем сайте (или делаете не 1й шаблон в рамках проекта), то имеет смысл ставить для него низкий индекс сортировки и/или правило, применяющее шаблон только к конкретной папке, чтобы ваше правило с не до конца готовым шаблоном не сказалось на других разделах.

Если сейчас мы посмотрим страницу в публичной части, то увидим, что она представляет из себя текст без разметки, стилей и картинок, поскольку пути к ним в статической вёрстке отличаются от тех, что должны быть в структуре 1С-Битрикс. Для того, чтобы это исправить необходимо:

Добавить константу <?=SITE_TEMPLATE_PATH?> к пути всех статических файлов (в частности изображений), которая определяет путь к шаблону сайта относительно пути сайта.

Например, заменив <img src=»https://xn--80ahcjeib4ac4d.xn--p1ai/information/integratsiya_adaptivnogo_bootstrap_shablona_sayta_v_1C_Bitrix_po_shagam_urok_1/img/img-4.png» alt=»»> на <img src=»https://xn--80ahcjeib4ac4d.xn--p1ai/information/integratsiya_adaptivnogo_bootstrap_shablona_sayta_v_1C_Bitrix_po_shagam_urok_1/<?=SITE_TEMPLATE_PATH?>/img/img-4.png» alt=»»>

Пренебрежём пока тем, что некоторые картинки, такие как баннеры в слайдере следует хранить не в шаблоне — мы будем облегчать его постепенно, перенося картинки в шаблоны компонентов или контент по мере необходимости (в идеале в общей папке в шаблоне страницы не должно остаться картинок не универсального значения, чтобы в дальнейшем было проще работать).

Добавим подключение пролога и языковых файлов в header.php начале шаблона (1-й строкой):

Добавим языковых файлов в footer.php (1-й строкой в файле или сразу после #WORK_AREA# в шаблоне):

Вместо статического значения <html lang=»en»> укажем константу, определяющую язык сайта в 1С-Битрикс:

Внутри тега <head> вместо <title>Home</title> динамически генерирующийся заголовок:

Добавим служебную функцию <?$APPLICATION->ShowHead();?> (она заменит нам множество других статических вызовов.

Удалим <meta charset=»utf-8″> — реальную информацию о кодировке (из настроек сайта) на страницу выведет предыдущая функция.

Установим динамическое подключение стилей с помощью функции SetAdditionalCSS (это нужно для того, чтобы одни и те же стили не подключались дважды, а так же для того, чтобы 1С-Битрикс проверял изменение в стилях и сообщал об этом браузеру пользователя при повторном заходе на сайт) — $APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH.’/css/НАЗВАНИЕ_СТИЛЯ.css’);. Сгруппируем все стили вместе с ShowHead для облегчения процесса редактирования в будущем:

Поскольку данная функция не поддерживает параметр media, перенесём и его значение из старых статических ссылок в текст CSS файлов.

Например, для /css/bootstrap.css первой строкой добавим:

@media screen

Установим динамическое подключение JS библиотек аналогично стилям (обратим внимание читателя, что проблема дублирования подключения библиотек JS важнее, поскольку может приводить к ошибкам работы функционала). Воспользуемся функцией AddHeadScript — $APPLICATION->AddHeadScript(SITE_TEMPLATE_PATH.»/js/НАЗВАНИЕ_БИБЛИОТЕКИ.js»);. Сгруппируем их так же вместе с CSS и ShowHead:

ВАЖНО. Мы оставили несколько библиотек подключенными по обычному сценарию.

JS, подключаемые для устаревших браузеров (поскольку для них стоит условие подключения:

Читайте так же:
Загрузить скайп старую версию бесплатно

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

<script type=»text/javascript» src=»https://xn--80ahcjeib4ac4d.xn--p1ai/information/integratsiya_adaptivnogo_bootstrap_shablona_sayta_v_1C_Bitrix_po_shagam_urok_1/<?=SITE_TEMPLATE_PATH?>/js/bootstrap.js»></script>

Так же мы добавили подключение ещё одного JS, которого раньше не было в HTML коде:

<script type=»text/javascript» src=»https://xn--80ahcjeib4ac4d.xn--p1ai/information/integratsiya_adaptivnogo_bootstrap_shablona_sayta_v_1C_Bitrix_po_shagam_urok_1/<?=SITE_TEMPLATE_PATH?>/js/superfish.js»></script>

Это библиотека, отвечающая за раскрытие выпадающего меню. Она вызывается в bootstrap.js, однако автор вёрстки сделал её подключение зависящим от местонахождения страницы, что приводит к ошибке в случае динамического шаблона (как у нас). Поэтому мы вынесли подключение в шаблон.

Важно не забыть добавить при их подключении константу <?=SITE_TEMPLATE_PATH?>, как и для картинок.

Добавляем константу <?$APPLICATION->ShowPanel();?> после открытия <body> для вывода панели инструментов в публичной части сайта (для пользователей обладающих соответствующим административным доступом).

<meta name=»description» content=»Your description»>
<meta name=»keywords» content=»Your keywords»>

Их динамические значения уже выводятся с помощью $APPLICATION->ShowHead();

Удаляем <meta name=»author» content=»Your name»> — в будущих уроках мы реализуем её вывод программно.

Опционально размещаем файл screen.gif в корне шаблона — он будет использоваться для иллюстрации шаблона в административном разделе и его наличие не обязательно. Файл может быть размещён в натуральную величину — для списка система автоматически сгенерирует миниатюру.

Заказать настройку шаблона Битрикс от 500 руб.

Выберите услугу

Десятки тысяч услуг в каталоге и отличные предложения на бирже ?

Среди десятка тысяч услуг

Оплатите

Один клик, и услуга
заказана Один клик, и услуга заказана ?

Получите результат

Качественный результат в срок и гарантия возврата средств ?

Качественно и в срок

Лучшие фриланс-услуги

Настройка региональности сайта на шаблонах 1с Битрикс

  • 4.6

1С Битрикс. Установка и настройка шаблона

  • 4.7

Настройка шаблона Title и Description - битрикс

  • 5.0

Настройка шаблонов 1С Битрикс

  • 4.9

1С Битрикс. Установка и настройка интернет-магазина

  • 4.7

1С Битрикс - Управление сайтом с установкой на хостинг и настройкой

  • 4.5

Профессиональное создание сайта или магазина Битрикс, готовые шаблоны

  • 5.0

Верстка шаблона из макета Figma, Psd. Натягивание на Bitrix

  • 5.0

Настройка и размещение рекламных баннеров на сайте 1C Bitrix

  • 4.8

Доработка сайтов на Bitrix

  • 4.8

Посмотрите как Kwork экономит деньги, время и нервы

СТУДИИKWORK
Скорость выполнения

В среднем 1 день 11 часов

3 — 20 сотрудников

Из 70 000+ исполнителей

Долгие согласования, длинные ТЗ, подписание договора и другая головная боль

Пара кликов — заказ готов! Минимум обсуждений

Вероятность стремится к нулю

100% гарантия возврата в 1 клик

Настройка шаблона Битрикс — реальные кейсы

Фриланс это легко!
Как покупать фриланс услуги в 1 клик?

Об услуге настройка шаблона битрикс

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

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

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

голоса
Рейтинг статьи
Ссылка на основную публикацию
Adblock
detector