Обзоры расширений Joomla

Видео уроки Website X5 13 и 12Видео уроки Website X5 13 и 12

Видео уроки на русском языке по самостоятельному созданию сайта с нуля в Incomedia Website X5 Evolution и Professional 12, 13.

 

 

Website X5 – это удобная программа для самостоятельного создания сайтов с нуля без программирования. В ней можно сделать веб-проект от лендинга до интернет-магазина. Начиная со средины мая 2011 в разделе сайта, посвящённому данной программе, посетители задали множество вопросов. На основании частоты их возникновения привожу ответы на некоторые из наиболее популярных, интересных или важных, на мой взгляд.

Большинство рассмотренных в данной статье приёмов будет актуально для разных версий программы. Наиболее актуально для 12-й и 13-й версий (как Evolution так и Professional). В написании статьи участвует последняя, на данный момент (25.10.2016), русскоязычная версия Incomedia WebSite X5 Evolution 13.0.0.14 (64 бита) в Windows 10 Pro х64.

В предыдущих уроках уже были рассмотрены такие вопросы:

Помимо этого, в курсе «Видео уроки Website X5. Создание сайта с нуля» были даны ответы на такие часто задаваемые вопросы:

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

В курсе «Видео уроки Website X5. Расширенные возможности» были даны ответы на такие часто задаваемые вопросы:

  • Как создать лендинг.
  • Как сделать версию сайта для слабовидящих.
  • Калькулятор для сайта.
  • Видео в качестве фона.
  • Как добавить чат.
  • Как сделать кнопку с анимацией при наведении и ссылкой на загрузку файла.
  • Как прописать разные H1 и Titele.
  • Как сделать комментарии к любой странице.
  • Вывод информеров статистики на сайте.
  • Как сделать кнопку "Добавить в закладки".
  • E-mail рассылка с сайта.
  • Как создать свою страницу 404.
  • Опросы\голосования на сайте.
  • Лупа для изображений.
  • Календарь.
  • Листание PDF.
  • Увеличение скорости загрузки сайта.
  • Защита сайта от взлома.
  • Поиск по сайту от Яндекс.
  • Дубли и перенаправления.
  • SMO – оптимизация сайта под социальные медиа.
  • Семантическая разметка страниц.

Вылетает или зависает

Если при работе с программой Incomedia X5 Вы столкнулись с проблемой зависания, торможения или вылета программы, попробуйте возможные варианты решения данной ситуации.

Совет № 1. Убедитесь, что у Вас лицензионная программа WebSite X5 последней доступной версии (хотя бы в рамках ветки).

Совет №2. Проверьте соответствие Вашего компьютера на предъявляемые системные требования к той версии программы, которую используете. Минимальные системные требования для Incomedia WebSite X5 10 и 11:

  • операционная система – Windows XP (SP3), Vista, 7, 8.
  • Оперативная память (ОЗУ) – 1 Гб.
  • Разрешение экрана – 1024x768.
  • .NET Framework 3 (или более новая версия).

Минимальные системные требования для WebSite X5 12:

  • Операционная система – Windows Vista, 7, 8, 10. Обратите внимание, что поддержка Windows XP не заявлена.
  • Оперативная память (ОЗУ) – 1 Гб.
  • Разрешение экрана – 1024x600.
  • .NET Framework 3.5 SP1 (или более новая версия).

Минимальные системные требования для WebSite X5 13:

  • Операционная систем - Windows 7 SP1, 8, 10. Обратите внимание, что Windows XP, Vista и Windows 7 (без SP1) не поддерживаются.
  • .NET Framework - 4.6.1 (или более новая версия).
  • Оперативная память (ОЗУ) - 2 Гб и больше.
  • Минимальное разрешение экрана - 1024х600 пикселей.

Учтите, если Вы используете некую «сборку» Windows, в которую были интегрированы сторонние программы, что-то «вырезано», остановлены какие-то службы и так далее, то рекомендую проверить работоспособность WebSite X5 в «чистой», оригинальной и, желательно, лицензионной версии Windows. Причём именно той версии, которая рекомендована и со всеми установленными обновлениями с официальных серверов Microsoft.

Версию .NET Framework можно проверить в разделе Программы и компоненты в панели управления Windows. Скачать Microsoft .NET Framework 4.6.2 можно с официального сайта разработчика. Думаю, что не лишним будет предварительно удалить устаревшие версии.

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

Проверка доступности памяти
Проверка доступности памяти

Совет №3. Отключите на время Ваш антивирус. Он может быть причиной «падения» WebSite X5. Также можно отключить фаервол (брандмауэр).

Совет №4. Старайтесь не запускать несколько копий WebSite X5 одновременно.

Совет №5. Попробуйте перезагрузить компьютер. После перезагрузки закрыть как можно больше автоматически загрузившихся программ (не относящихся к Windows).

Совет №6. Убедитесь, что во время работы WebSite X5 не выполняются какие-то ресурсоёмкие задачи. Например, резервное копирование.

Совет №7. Убедитесь, что количество страниц в проекте не превышает 10000.

Совет №8. По возможности, проверьте работу программы на другом компьютере или с другим проектом.

Совет №9. Убедитесь в работоспособности Вашего компьютера.

Совет №10. Отправьте запрос в службу технической поддержки Incomedia X5. О том, как это сделать, Вы можете прочесть в данной статье. Не забывайте, что есть новый сайт поддержки.

Не отправляются письма

Достаточно часто возникают вопросы, связанные с проблемами отправки писем. Описываются разные проблемы:

  • не отправляются письма вообще.
  • Письма приходят только клиенту или только админу сайта при оформлении заказа в интернет-магазине.
  • Письма перестали отправляться без видимых причин. То есть, сайт не меняли, а письма перестали отправляться.
  • После обновления сайта письма перестали отправляться.
  • После переноса сайта на новый хостинг письма перестали отправляться.

И так далее.

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

Совет №1. Очень внимательно проверьте все настройки, которые Вы ввели на первом шаге создания сайта Расширенные настройки – Управление данными (рисунок ниже).

Incomedia X5
Incomedia X5

Обязательно посмотрите в справочной системе или спросите в технической поддержке Вашего хостинг-провайдера (или почтового сервиса), какой именно «тип» (способ) отправки почты лучше использовать и с какими именно настройками. Способ отправки почты Вы можете менять в спадающем списке Скрипт для отправки e-mail (рисунок выше). У разных скриптов есть разные настройки.

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

Совет №2. Тестируйте разные настройки отправки почты из админки сайта. На рисунке ниже показан пример административной части сайта, сделанной в Incomedia WebSite X5 Professional 13. В Evolution он аналогичен. Подобный раздел также есть в предыдущих версиях Incomedia X5.

Работа в WebSite X5
Работа в WebSite X5

Совет №3. Проверьте, чтобы Ваш хостинг отвечал рекомендованным системным требованиям.

Для Website X5 10 и 11:

  • операционные системы - Windows, Linux, Unix Server.
  • PHP 4.x, 5.x.
  • MySQL.

Для Website X5 12 и 13:

  • операционные системы - Windows, Linux, Unix Server.
  • PHP 5.x.
  • MySQL.

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

Совет №4. Проверьте, что отправку писем с Вашего сайта или хостинг-аккаунта не блокирует хостинг-провайдер. Это могло произойти в результате недобросовестных соседей по хостингу, которые занимаются спамом или чьи сайты были взломаны. Или, если Вы отправляете почту через SMTP, то узнайте, не закрыта ли эта возможность у Вас в аккаунте.

Совет №5. Убедитесь в том, что письма с Вашего сайта не попадают в спам. Если это так, то настройте DKIM-подпись и SPF-запись. В этом поможет Ваш хостинг-провайдер или почтовый провайдер. Можете почитать в документации или обратиться в техническую поддержку.

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

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

Кракозябры в Website X5

Бывают случаи, когда буквы отображаются в виде непонятных символов – «кракозябров». Это может относиться к любому языку. Такая ситуация свидетельствует о проблемах с кодировкой.

Совет №1. Убедитесь в том, что шрифт, который Вы используете, поддерживает буквы нужного Вам языка.

Совет №2. Поинтересуйтесь в справке или технической поддержке хостинг-провайдера, как можно указать кодировку сайта UTF-8. Иногда, это можно сделать прямо в панели управления хостингом. Если ничего не нашли, то создайте в корне сайта файл «.htaccess» (без кавычек и с точкой в начале), если его ещё нет. Корень сайта – это папка, в которой находятся все файлы и папки Вашего сайта. В файл «.htaccess» добавьте такую строку:

 

AddDefaultCharset UTF-8

 

Совет №3. Если возникла проблема с отображением текста, хранящегося в базе данных, зайдите в инструмент управления базами данных, например, phpMyAdmin и на вкладке SQL (нужной базы данных) выполните запрос:

 

SHOW VARIABLES LIKE 'char%';

 

Значения напротив параметров переменных «character_set_client» и «character_set_results» должны совпадать. Если они не совпадают, выполните запрос:

 

mysql_query('SET names "utf8"');

 

Загрузка файлов с сайта

Есть много способов реализовать возможность загрузки файлов с сайта. Например, в объекте Текст выделить текст и назначить на него действие Файл или URL.

Программа Website X5 Evolution
Программа Website X5 Evolution

Можно то же самое сделать с изображением в виде кнопки. А можно создать кнопку средствами CSS и HTML. HTML-код выглядит так:

 

<a href="/files/test.zip" class="knopochka">Скачать файл</a>

 

Где «files/test.zip» - путь к файлу, «knopochka» – CSS-класс, а «Скачать файл» – надпись на кнопке. Пример CSS-стиля:

 

a.knopochka {
  color: #fff;
  text-decoration: none;
  user-select: none;
  background: rgb(212,75,56);
  padding: .7em 7em;
  outline: none;
}
a.knopochka:hover { background: rgb(232,95,76); }
a.knopochka:active { background: rgb(152,15,0); }

 

Этот CSS можно подключить в свойства страницы, а HTML-код вставлять в любой объект, где поддерживается вставка HTML. Обратите внимание, кнопка будет реагировать на нажатие и наведение.

Можно ещё воспользоваться объектом HTML-код. На рисунке ниже приведён пример создания кнопки загрузки при помощи объекта HTML-код.

Объект HTML-код
Объект HTML-код

На рисунке ниже показан пример такой кнопки. Её внешний вид можете изменить так, как Вам надо, изменяя CSS-стили.

Кнопка
Кнопка

Якорь. Ссылки по тексту

Как Вам известно, в программе Website X5 Evolution есть возможность вставки якоря со ссылкой на объекты на странице. Но если необходимо создать якоря внутри объекта Текст, тогда этот способ не подойдёт. Для организации «оглавления» к длинным страницам, таким, как у меня в этой статье в самом верху, Вам нужно применить HTML-код.

Сперва активируйте инструмент Включить HTML-код (рисунок ниже).

Создание якоря
Создание якоря

Затем создайте оглавление (рисунок выше). Код такой:

 

<a href="#zagolovok-1">Заголовок 1.</a>
<a href="#zagolovok-2">Заголовок 2.</a>
<a href="#zagolovok-3">Заголовок 3.</a>

 

«agolovok-1» – это ссылки на якоря, «Заголовок 1» – это текст оглавления. У Вас они могут быть другими. После этого добавьте сами якоря в нужные части страницы. Якоря выглядят так:

 

<a name="zagolovok-1"></a>
<a name="zagolovok-2"></a>
<a name="zagolovok-3"></a>

 

«zagolovok-1» – это и есть якорь. У Вас они могут быть другими. То есть, по нажатию на «<a href="#zagolovok-1">Заголовок 1.</a>» пользователь перейдёт в ту часть страницы, где есть якорь «<a name="zagolovok-1"></a>». Примерно это выглядит так, как показано на рисунке ниже.

Создание якоря 2
Создание якоря 2

Обратите внимание, если оглавление находится в одном объекте, а якорь в другом, то переход всё равно работает. Если, например, нужно создать оглавление на одной странице, а переходить к якорям на другой, оглавление будет выглядеть так:

 

<a href="https://aleksius.com/sozdanie-sajtov/incomedia-website-x5/professional-13#zagolovok-1">Заголовок 1.</a>
<a href="https://aleksius.com/sozdanie-sajtov/incomedia-website-x5/professional-13#zagolovok-2">Заголовок 2.</a>
<a href="https://aleksius.com/sozdanie-sajtov/incomedia-website-x5/professional-13#zagolovok-3">Заголовок 3.</a>

 

Где «http://aleksius.com/sozdanie-sajtov/incomedia-website-x5/professional-13» – полный URL-адрес той страницы, где есть якорь.

Вставка рекламы Google AdSense

Вставить код рекламной сети Google AdSense можно при помощи объекта HTML-код. А для вставки кода рекламной сети Google AdSense в блог можно воспользоваться специальным боковым блоком Реклама Google AdSense. Он находится в Настройки – Расширенные настройки – Блог – Макет – Добавить – Реклама Google AdSense (рисунок ниже).

Вставка рекламы Google AdSense
Вставка рекламы Google AdSense

Открытие формы во всплывающем окне

О том, как выводить сообщение об успешной отправке данных через форму можно узнать в курсе «Видео уроки Website X5. Создание сайта с нуля». Давайте рассмотрим пример отображения формы во всплывающем окне по нажатию на ссылку.

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

Потом в свойствах этой страницы на вкладке Графика активируйте опцию Создать страницу без шаблона (рисунок ниже). Можете задать другие настройки на этой вкладке.

Свойства страницы
Свойства страницы

Теперь назначьте действие (рисунок ниже) на текст, изображение и т.д., по нажатию на которое нужно открывать всплывающее окно с формой. Действие – Страница сайта. В списке Страница сайта укажите страницу с формой. И в параметрах укажите Открывать во всплывающем окне. Также задайте нужные размеры.

Создание ссылки
Создание ссылки

Перенаправление на мобильную версию сайта

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

Создайте в корне своего основного сайта (не мобильного) файл «.htaccess» (без кавычек и с точкой в начале), если его ещё нет. Корень сайта – это папка, в которой находятся все файлы и папки Вашего сайта. В файл «.htaccess» добавьте такие строки:

 

RewriteEngine on
RewriteCond %{HTTP_ACCEPT} "text/vnd.wap.wml¦application/vnd.wap.xhtml+xml" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "acs|alav|alca|amoi|audi|aste|benq|blac|blaz|brew|cell|cldc|cmd-" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "dang|doco|erics|hipt|inno|ipaq|java|jigs|kddi|keji|leno|lg-c|lg-d|lg-g|lge-" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "maui|maxo|midp|mits|mmef|mobi|mot-|moto|mwbp|nec-|newt|noki|opwv" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "palm|pana|pant|pdxg|phil|pluc|port|prox|qtek|qwap|sage|sams|sany" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "sch-|sec-|send|seri|sgh-|shar|sie-|siem|smal|smar|sony|sph-|symb|t-mo" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "teli|tim-|tsm-|upg1|upsi|vk-v|voda|w3cs|wap-|wapa|wapi" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "wapp|wapr|webc|winw|winw|xda|xda-" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "up.browser|up.link|windowssce|iemobile|mini|mmp" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "symbian|midp|wap|phone|pocket|android|mobile|pda|psp" [NC]
RewriteRule ^(.*)$ http://m.vashsajt.com/$1 [NC,L]

 

 «http://m.vashsajt.com/» – это и есть адрес мобильной версии Вашего сайта. Замените его на свой. Все пользователи, которые будут заходить на Ваш основной сайт с большинства мобильных устройств будут перенаправляться на мобильную версию, причём, на тот же URL-адрес. Так что не забудьте сохранить структуру URL точно такой, как на основном сайте.

Если сайт во вложенной папке, то вместо «http://m.vashsajt.com/$1» будет так: «http://vashsajt.com/m/». Где «m» – папка с мобильной версией сайта в корне основного сайта.

В следующей статье «Конструктор Website X5. Уроки (часть 4)» продолжу рассмотрение часто задаваемых вопросов и постараюсь дать на них максимально полезные ответы.

Видео уроки Website X5 13 и 12Видео уроки Website X5 13 и 12

Видео уроки на русском языке по самостоятельному созданию сайта с нуля в Incomedia Website X5 Evolution и Professional 12, 13.

 

Полезные ссылки: