|
|||||||
Содержание
Введение |
СтраницыСайт, создаваемый в WYSIWYG Web Builder, может иметь неограниченное количество страниц. Каждая страница может иметь свои под-страницы. В WYSIWYG Web Builder сайт, т.е. и все страницы сайта, можно создать двумя основными способами: 1. С использованием шаблонов - см. Шаблоны сайта 2. Самостоятельно, не используя шаблоны. В свою очередь, самостоятельно создавать страницы сайта также можно по-разному: - создавать каждую страницу
заново, "с нуля"
- использовать Главную страницу - Master Page - использовать Главную рамку - Master Frames - использовать Главные объекты - Master Objects Применяя последние три способа, можно ускорить и облегчить создание страниц сайта, т.к. Master Page, Master Frames, Master Objects являются разновидностями шаблона страницы. Основные инструменты для работы со страницами в WYSIWYG Web Builder: Меню Page
Лента - вкладка Page Менеджер сайта Меню Insert Лента - вкладка Insert Панель вставок (Toolbox) Ниже показан раздел Ленты (Ribbon), посвященный работе над страницами (для версии WYSIWYG Web Builder 17) Свойства страницы Свойства страницы можно открыть, используя:
В свойствах страницы определяются: размеры страницы, расположение страницы в окне браузера (слева, по центру), кодировку страницы, язык страницы, цветовое оформление (фон, оформление текста и ссылок), вводятся мета - данные и прочее. Фон страницы Фон страницы может быть заполнен цветом, градиентом, образчиками, текстурой, изображениями. При применении изображений можно покрыть фон как плиткой. Для настройки фона используйте Свойства страницы - вкладку Ctyle. Примечания:
1. Свойства страницы используются, когда нужно определить индивидуальные свойства конкретных страниц. Свойства всех страниц сайта определяются в Свойства сайта. 2. Многие свойства страницы определяются в Инспекторе свойств. Подробнее о свойствах страницы Новое: При использовании Сетки расположения (Layout Grid) - Новая функция: добавлена новая опция повторения фона: пробел. Фоновое изображение повторяется в максимально возможной степени без обрезки. Первое и последнее изображения прикрепляются по обе стороны от элемента, и пробелы равномерно распределяются между изображениями. - Новая функция: добавлена новая опция повторения фона: круглая. Фоновое изображение повторяется и сжимается или растягивается, чтобы заполнить пространство (без пропусков). Цветовое оформление По умолчанию палитра цветов WYSIWYG Web Builder отображает стандартную цветовую палитру, содержащую 140 стандартных веб-цветов. С помощью опции «Образец цвета» (на основе палитры цветов MS Office) вы можете настроить собственную цветовую палитру из 12 цветов. Светлый и темный варианты этих цветов будут сгенерированы автоматически, как в MS Office. Цветовые палитры Доступны следующие варианты: • нет - используйте цветовую палитру по умолчанию.
• да – не синхронизировать - используйте собственные цвета, но не заменяйте цвета на страницах при изменении темы. • да — синхронизировать все цвета использовать собственные цвета, заменять цвета на страницах при изменении темы или выборе другой темы. По сути, это приведет к глобальной замене совпадающих цветов на всех страницах. Цвета из предыдущей выбранной темы будут заменены цветами из выбранной темы. • да — синхронизировать категории использовать собственные цвета, заменять цвета на страницах при изменении темы или выборе другой темы. Выполните глобальную замену соответствующих цветов на всех страницах в зависимости от их категорий. Например, цвета текста будут обновляться только для текста, но если фон использует тот же цвет, он не будет обновлен. Это работает так же, как и в этом инструменте «Глобальная замена». Для выбора темы оформления страницы используйте меню Page - раздел ленты Theme. Подробнее о цветовом оформлении (англ. язык) Название страницы Название файла HTML (название страницы) взято с названия, которое Вы определили в Site Manager - Менеджере Сайта Подробнее Верхний и нижний колонтитулы В WYSIWYG Web Builder имеются два объекта - Верхний колонтитул (Page Header) и Нижний колонтитул (Page Footer). Эти объекты можно вставить на страницу, используя:
В основном этот объект - упрощенный Слой (уровень), таким образом большинство параметров настройки идентично, и другие объекты можно перетащить на вершину этого объекта и сделать их частью заголовка. Подробнее Расположение страницы в окне браузера Вот несколько подсказок, как выбрать расположение страницы в окне браузера:
Смотрите на шаблоны, как использовать этот метод: http://www.wysiwygwebbuilder.com/templates.html Большая часть шаблонов имеет установку страницы по центру браузера. Добавление объектов Для вставки объектов можно использовать:
Новое
для Загрузки файла) - обавлен тип «Bootstrap». Это отобразит входной
файл с использованием стиля Bootstrap (только CSS). В отличие от версии
пользовательского интерфейса jQuery, для которой требуется JavaScript.
Оглавление Оглавление (Table of Contents) — это список ссылок, которые ведут к различным разделам страницы. Оглавления особенно полезны для длинных страниц для быстрого перехода к нужному месту на странице. Подробнее об оглавлении Страницы для различных экранов В версии WYSIWYG Web Builder 10 появилась новая функция - создание сайтов для разных экранов, в т.ч. для экранов мобильных телефонов. См. Сайты для разных экранов Подробнее о мобильных страницах Предварительный просмотр страницы В меню File выберите Preview in Browser -> Default Browser Или: Лента - вкладка Home -> Preview -> Default Browser (F5), чтобы анонсировать текущую страницу в Вашем браузере по умолчанию. Подробнее о предварительном просмотре Публикация страницы WYSIWYG Web Builder создает и сохраняет проект сайта как один файл с расширением .wbs. При публикации сайта единый файл распадается на отдельные файлы - страницы HTML, изображения, файлы CSS, файлы Java Script и пр. Таким образом, функции публикации индивидуальных страниц в WYSIWYG Web Builder нет, нужно публиковать целый сайт. При этом есть возможность выбрать или исключить из публикации отдельные страницы. Подробнее о публикации Предзагрузчик Новое: Предварительный загрузчик (также известный как экран загрузки или Page Preloader) - это то, что вы видите на некоторых сайтах перед загрузкой основного содержимого веб-страницы. WYSIWYG Web Builder может отображать анимированный файл GIF в то время, когда идет загрузка сайта, в виде полупрозрачного наложения. Анимация исчезнет сразу после загрузки страницы. Коллекция стандартных изображений preloader включена, но вы также можете добавить свои собственные анимации, добавив пользовательское изображение gif в подпапку preloader. Эта папка обычно находится в папке Documents \ WYSIWYG Web Builder \ system \ preloader \ Вы можете настроить изображение preloader в Свойствах страницы -> Разное Примечание:
Подробнее см. http://www.wysiwygwebbuilder.com/preloader.htmlЕсли загрузчик не исчезает, то, скорее всего, существует конфликт сценариев на странице. Когда это произойдет, удалите все пользовательские сценарии Java и повторите попытку. Импортирование страницы HTML Хотя WYSIWYG Web Builder не редактор HTML, Вы можете импортировать существующие страницы HTML. Выберите меню Page -> Import -> Import HTML Page, чтобы показать окно импорта страницы HTML Вы можете выбрать страницу HTML или из местной папки на Вашем компьютере, или страницу из Интернета, ввеля адрес (URL) страницы Редактор автоматически скопирует все изображения на Ваш компьютер. Примечания об
импортировании HTML:
Import page from another project - Этот выбор позволяет импортировать страницу из проекта, созданного WYSIWYG Web Builder. Вставка собственного кода WYSIWYG Web Builder не позволяет редактировать код, который создает сам, но есть возможность добавить собственный код. При этом свой код можно вставить только в строго отведенные для этого места. Для вставки своего кода используйте Панель вставок или Ленту - вкладку Insert - раздел Standart - HTML. Подробнее о вставке кода Примечания На страницу можно вставить примечания, которые не будут отражаться при публикации страницы Подробнее Embedded Page/Reusable objects Embedded Page - Встроенная страница Reusable objects - многоразовые объекты Примечание:
при использовании встроенных страниц важно убедиться, что все
идентификаторы (ID) объектов уникальны! См. также: Как предотвратить
дублирование идентификаторов.
Embedded objects - Встроенные объекты (ранее известные как Master Objects) - это полезная функция, которая позволяет повторно использовать объекты (но не свойства страницы) с другой страницы внутри страницы. Объект 'Embedded Page' в основном является указателем на объекты другой страницы (например, 'Master Page"). Эти объекты будут внедрены в страницу точно так же, как они находятся на исходной странице. Вы даже можете использовать несколько встроенных страниц на одной странице! Предположим, у вас есть определенный макет, который одинаков для всех ваших страниц, и вы не хотите применять эту копию и вставку между всеми вашими страницами. Для этого просто создайте макет один раз на странице и вставьте макет этой страницы во все ваши другие страницы, используя Embedded Page (встроенные страницы). Если вы хотите обновить макет, вам нужно будет сделать это только один раз на исходной странице. Пример: Вы хотите создать веб-сайт, который имеет общий заголовок и меню для всех страниц. 1. Создайте новую страницу с
именем demo
2. Создать макет 3. Откройте другую страницу и вставьте объект" Embedded Page". 4. Откройте свойства и выберите демо-страницу. 5. Вы заметите, что все объекты из заголовка страницы теперь являются частью страницы индекса. 6. Теперь при редактировании demo-страницы изменения будут автоматически применены и к индексной странице! Подробнее см. http://www.wysiwygwebbuilder.com/embedded_page.html Примечания:
* Встроенные страницы не клонируют свойства страницы! Это всего лишь указатель на объекты другой страницы. · Поскольку объекты клонируются "как есть", убедитесь, что идентификаторы объектов (ID) на главной странице уникальны. Идентификатор можно изменить в Properties Inspector (Инспекторе свойств). Рекомендуется дать им префикс, например master_, это предотвратит дублирование идентификаторов на странице. * Растягиваемые слои- Stretchable layers (относительный размер) будут иметь фиксированный размер, так как сама страница имеет фиксированный размер! · Не рекомендуется использовать встроенную страницу как часть другой внедренной страницы для предотвращения бесконечных циклов. * Опция 'Use hover state style to indicate the current page' ("использовать стиль состояния наведения для указания текущей страницы") в инструментах навигации не будет работать в сочетании со встроенной страницей, поскольку для этого объекта будет только один набор изображений. Одни и те же изображения будут использоваться на всех страницах. * Embedded Page (Внедренная страница) должна находиться в той же папке, что и страницы, которые ее используют. Это особенно важно, если вы используете внутренние ссылки, так как ссылки будут относительно главной страницы. Так что если страница находится в другой папке, то ссылки не являются допустимыми. Внедрить как слой Когда выбран параметр "embed as a layer" ("внедрить как слой"), все элементы, составляющие внедренную страницу, фактически находятся на слое. Этот слой будет блокировать доступ к любым элементам страницы "под" ним (в z-порядке). Если встроенный слой страницы находится поверх кнопки или ссылки, посетители вашего сайта не смогут нажать на кнопку или ссылку, даже если она видна. Если флажок "embed as a layer" ("встроить как слой") снят, элементы вставляются как отдельные объекты на странице (а не на слое). Затем вы можете получить доступ к любым объектам "под" встроенной страницей (если они видны). Обратите внимание, что WYSIWYG Web Builder также поддерживает Master Frames. Google Analytics (Гугл Аналитика) Google Analytics - Лента - вкладка "Страница" - раздел "Инструменты" - Google Analytics. Вставьте код Google Analytics в раздел <head> текущей страницы. Этот параметр является ярлыком для страницы HTML в поисковике Google. См. также: Быстрая верстка landing page, подписных и продающих страниц Создаем страницу подписки Связываем страницу подписки с сервисом JustClick Новая функция - Защищенный контент (Protected Content): добавлена возможность показывать/скрывать элементы в зависимости от статуса входа пользователей. Теперь можно защитить определенный контент на странице. Подробнее пользовательский интерфейс добавлена вкладка «Новая страница». ДНовое для страниц: Отчеты об ошибках проверяют неправильное выравнивание страниц в гибких макетах. Добавлен быстрый и простой способ переупорядочивания плавающих слоев (сеток макета, гибких контейнеров и т. д.). В свойствах страницы отображается значок «предупреждение», если длина заголовка менее 30 или более 60 символов. Добавлена возможность устанавливать минимальный размер шрифта для «Автоматически масштабировать новые объекты в других точках останова». Вобавлена возможность переименовать страницу, дважды щелкнув вкладку. И другое. Подробнее Доступные расширения: Page Redirect
Простое решение для перенаправления пользователей на другую страницу на основе даты, времени, дня недели, браузера или ширины экрана. См. Page Redirect Language Text Используется для переключения между несколькими языками (на одной странице). См. Language Text Pace Pace - это индикатор выполнения автоматической загрузки страницы. См. Pace Последнее обновление: январь
2024 г.
|
||||||
|