Возможности редактора конструктора сайтов Wix. Редактировать сайт wix


Как превратить шаблон Wix в свой уникальный сайт

Хотите создать свой сайт? Отлично! Wix предлагает вам сотни красивейших шаблонов. Не хотите быть «как все»? Не проблема: у вас есть возможность полностью изменить вид шаблона. В действительности вы можете настолько поменять шаблон, что никто не сможет угадать его исходник.

Вот отличный пример: слева оригинальный шаблон Wix, а справа – Mnfotografy.com – сайт, созданный с использованием этого шаблона.

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

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

1. Измените фон и цветовую гамму

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

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

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

2. Выберите подходящий шрифт

Следующее, что вам нужно сделать, – это подобрать шрифт. Редактор Wix предлагает широкий выбор шрифтов. В разделе «Дизайн» кликните на опцию «Шрифты». Как только вы сделаете выбор, изменятся шрифты на всем сайте, включая хедер и кнопки меню.

Вы также можете изменять шрифт отдельной части текста, нажав “Изменить шрифт” и выбрав что-то подходящее в выпадающем меню. Вы можете бесконечно экспериментировать со шрифтами в хедере и в основной части текста, главное удостоверьтесь, что заголовки оформлены в стиле Н1 и с учетом всех правил SEO. Чтобы узнать больше о SEO и тегах, загляните в наш Учебный центр.

3. Меняйте стиль навигационного меню, добавляйте страницы и изображения

Вы можете изменить стиль меню любого шаблона Wix на свой вкус. Кликните на меню, затем на «Изменить стиль» и выберите, каким вы хотите видеть ваше меню.

Подобным образом вы можете изменить стиль всей страницы. В панели слева нажмите на иконку “Страницы”, затем перейдите в настройки страницы. В нижней части панели настроек вы увидите иконку “Изменить стиль”. Нажмите на нее и выберите один из предложенных вариантов дизайна.

Чтобы добавить индивидуальности дизайну вашего сайта, нажмите «Настроить стиль». Здесь вы можете выбрать форму и цвет фонового блока.

Вам нужно добавить больше страниц на сайт? Или наоборот – уменьшить их количество? Менять число страниц можно, нажав на вкладку «Страницы». Здесь вы можете управлять всем, что связано со страницами вашего сайта (включая их добавление, удаление и копирование). Тут же вы можете настроить SEO для каждой отдельной страницы.

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

Вот и все! Добавьте иллюстрации и текст и заявите о себе миру.

 

ru.wix.com

Возможности редактора конструктора сайтов Wix

Возможности редактора конструктора сайтов Wix

Моя статья в разделе "Ликбез" о конструкторе сайтов Wix вызвала заметный интерес, но оно и понятно: многим пользователям бывает нужно сделать сайт для каких-то целей (персональная страничка, сайт-визитка фирмы или предлагаемых услуг) и им при этом совершенно не хочется обращаться к дизайн-студиям и тратить на создание сайта серьезные деньги. А конструктор Wix позволяет самостоятельно сделать нужный сайт, не обладая при этом ни знанием языка разметки HTML, ни опытом в дизайне интернет-страниц.

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

Кстати, да, такая возможность в конструкторе предоставляется: среди каталога шаблонов есть раздел под названием "Пустые шаблоны".

Пустые шаблоны

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

В пустом же шаблоне - только стандартная разметка: заголовок ("хедер", от английского header), основная страница и нижний колонтитул ("футер", от английского footer).

Пустой шаблон с разметкой в редакторе

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

Фон

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

Фон не должен мешать восприятию информации, которая представлена на сайте, поэтому желательно не делать фон слишком пестрым и ярким.

За добавление/изменение фона отвечает соответствующий инструмент - верхний среди инструментов, расположенных в левой части редактора.

Фон может быть просто заливкой определенного цвета. Если выбрать кнопку "Цвет", то появится соответствующая палитра. Причем, когда вы наводите курсор на определенный цвет, редактор сразу показывает, как это будет выглядеть на сайте. Закрашиваться будут все элементы (хедер, футер и бока за границами основной страницы), кроме основной страницы.

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

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

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

Также вы можете загрузить свой собственный видеоролик (редактор поддерживает несколько популярных форматов), но его размер не должен быть более 50 мегабайт. При этом еще и следует иметь в виду, что для фонового ролика разрешение не должно быть слишком большим: например, разрешение FullHD там не нужно совершенно.

Если взять разрешение 720p (1280х720 пикселов), то в 50 мегабайт влезет примерно 50 секунд.

Вот наш ролик загружен - выбираем его в качестве фона.

Ну и вот наш сайт с видео в качестве фона.

Добавляем элементы страницы

За элементы страницы отвечает вторая панель слева. Там богатый выбор.

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

Выбираем заголовок в стиле шаблона (его тогда можно сделать на установленном фоне).

Нажимаем кнопку "Редактировать текст" - появляется большая панель различных настроек текста, ну и в поле можно ввести свой текст.

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

Второй раздел меню элементов - фото. С его помощью можно добавлять и размещать изображения на сайте.

Появляется стандартный диалог загрузки или выбора фото из загруженных, библиотеки Wix, платного стока (как при выборе фона).

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

Также тут доступен очень продвинутый фоторедактор, с помощью которого можно работать с изображением.

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

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

Элемент "Галереи" - выбор вида галереи изображений и работа с самой галереей.

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

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

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

Классический вариант кнопки - "Связаться", которая будет вести на страничку с информацией для связи.

Боксы - геометрические элементы с каким-то текстом. Боксы и на странице привлекают внимание к информации, и обрабатывать их удобно: вы можете перемещать бокс целиком со всеми его элементами.

Вот, например.

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

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

Видео - вставка видеоролика из какого-то видеохостинга.

Музыка - вставка аудиотрека в виде самых разнообразных плееров, которые вы также можете конструировать самостоятельно. Есть очень продвинутые варианты, которые могут пригодиться начинающим музыкантам, раскручивающим свои произведения.

Соцсети - различные варианты ссылок как подписки на ваши страницы в соцсетях, так и на возможность поделиться страницей.

Контакты - мощная форма, где можно задавать разнообразные контакты для связи, карты "как проехать", приглашать подписаться на вашу рассылку и так далее.

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

Список - простой способ организовать новостные или событийные блоки на сайте.

Блог - готовый механизм организации на вашей странице раздела с вашим собственным блогом. Здесь только выбирается его структура, а для продвинутой работы с уже созданным блогом есть отдельный раздел (механизм) редактора.

Магазин - выбор формата интернет-магазина. Для управления им тоже есть целый отдельный механизм.

App Market

Следующая кнопка - Wix App Market. Это большой магазин приложений (многие из них - бесплатные), которыми можно значительно расширять функциональность вашего сайта. Поиск, переходы, счетчики, кнопки "Поделиться" для самых разнообразных соцсетей, всякие сервисы (например, чат с вами или менеджером вашего сайта) - и так далее.

Загрузки

Отдельный раздел загрузок: фото, видео, аудио, различные документы и файлы.

Все это хранится вместе с вашими страницами, и на них вы можете давать ссылки на эти медиаданные, документы и файлы.

Блог и магазин

Ну и последние кнопки - два продвинутых механизма, о которых я уже говорил: механизм работы с блогом и механизм работы с интернет-магазином.

Заключение и выводы

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

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

Редактор предоставляет вам массу возможностей, но он не умеет думать за вас, и он не может решить, что вам нужно на вашей странице, а что нет.

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

www.exler.ru

Как вставить код на сайт

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

Но как быть, если вам необходимо добавить на сайт функцию, не предусмотренную в редакторе Wix? Как раз для этого мы разработали на вид простой, но на деле — мега-функциональный виджет HTML, о котором и расскажем вам сегодня. С помощью приложения HTML на сайт можно добавить буквально все (разве что кроме ёжиков – прим. ред.), включая любой вид стороннего контента, виджетов и приложений.

Что еще за приложение HTML?

Давайте для наглядности проведем параллель с творчеством. Представьте, что вы делаете коллаж. Так вот, приложение HTML — это такая штука, с помощью которой вы можете легко и быстро вставить в ваш коллаж любую понравившуюся картинку.

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

Приложение HTML можно использовать двумя способами:

  • Для встраивания сайтов через iframe. Подходит для того, чтобы добавлять страницы с других ресурсов. Это может быть статья из Википедии или профиль на IMDB, полностью опубликованный у вас на сайте.

  • Для встраивания HTML-кода. Используется в тех случаях, когда вам хочется установить на сайт виджет, которого нет среди приложений в Wix App Market.

Для лучшего понимания того, как это работает, предлагаем посмотреть короткий видеоурок по добавлению HTML-кода в редакторе Wix:

Классные применения HTML-кода на сайте

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

  • Встроенные посты из соцсетей. Да, теперь вы можете вставить на сайт любую публичную запись (свою или чужую) из Фейсбука или Контакта.

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

  • Статьи о вашей компании, опубликованные на онлайн-ресурсах.
  • Конвертер валют, счетчик посещений, калькулятор и другие полезные программки.
  • Ленту твиттера с последними обновлениями.
  • Опросы, тесты или анкеты.
  • Документы из онлайн-хранилищ типа Dropbox или Google Docs.

Надеемся, что идея понятна, и пожалуй, остановимся здесь, так как этот список можно продолжать до бесконечности…

Обратите внимание:

  • Когда вы встраиваете внешний HTML-код, вы добавляете продукт, написанный и протестированный за пределами компании Wix. Это значит, что наша служба поддержки не всегда может ответить на вопросы, связанные с его работой, поэтому мы настойчиво советуем вам тестировать код самостоятельно. Для этого есть специальные сайты: w3schools.com или jsfiddle.net.
  • Видео, встроенное при помощи приложения HTML, не останавливается автоматически, когда вы переходите на другие страницы сайта. Если вам это мешает, нажмите на паузу, и только потом переходите в другие разделы.
  • Допустимое количество символов при встраивании кода — 8,192. Нам кажется, что этого достаточно для того, чтобы укомплектовать сайт всем, чем только можно.

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

ru.wix.com