
Привет всем. Давненько я не выкатывал мощные обзоры на плагины, но сегодня я наткнулся на плагин Oxygen визуальный редактор страниц wordpress, который меня впечатлил. Знакомьтесь!
Плагин Oxygen – визуальный редактор страниц
Когда я наткнулся на него, совершенно случайно, то даже не представлял себе с чем мне придется иметь дело. Разумеется, я решил его протестировать, как всегда из любопытства. Боюсь, друзья, перед нами полноценный конкурент с очень неплохими перспективами старому доброму – Visual Composer – плагин для wordpress. Перед тем, как начинать тестировать плагин, я по не понятной до сих пор самому себе привычке, сначала пытаюсь сделать его перевод, а уже потом начинать тестировать.
В моём случае перевод получился частичным и делал я его, откровенно сказать, “спустя рукава” и, судя по результатам, “оболочка” плагина oxygen останется на английском пока, а вот основная часть, та с которой предстоит работать, как раз на русском языке с некоторыми не точностями.
Постараюсь рассказать про плагин как можно больше, чтобы у вас сложилось максимальное представление о нем.
Для начала пример сайта для фрилансера:
Итак, как обычно, внизу будет ссылка на канал Telegram. В нем, счастье для тех кто любит экономить. В этот раз экономия аж 6.725 рубликов 🙂
После того, как вы установили плагин Oxygen к себе на сайт и активируете его. Перед вами откроется окно следующего вида:
Соответственно, выбираете вариант, который вам больше по вкусу. Я выбрал рекомендуемый вариант, тот что слева. После чего мне было предложено выбрать один из вариантов, которые разработчики плагина wordpress подготовили для клиентов:
Может показаться, что 15 вариантов потенциально готовых сайтов это не очень то и много. Поверьте, это лишь первое впечатление. Они созданы исключительно для того, чтобы упростить жизнь тем, кто только начинает работать с визуальным редактором.
Например, выбираете шаблон “Дантист”. Устанавливаете его, меняете текст с английского на русский и перед вами готовый рабочий сайт стоматологической клиники. Ставите свои контактные данные для клиентов и вперед работать.
Плагин вид изнутри
В настройках этого плагина существует 4 раздела:
- Home – здесь вы можете добавлять новые страницы или же воспользоваться библиотекой с готовыми вариантами сайтов. Так же представлены ссылки на страницы с информацией о плагине и ссылками на поддержку.
- Templates – в этом разделе есть специальные заготовки, которые разработчик предлагает использовать и их можно изменять с помощью плагина визуальный редактор страниц.
- Export & Import – используется для того, чтобы переносить данные.
- Settings – в этом разделе находятся основные настройки плагина и вот как раз он то и переведен частично. Будет свободное время переведу окончательно.
Останавливаться на настройках долго нет особого смысла, интуитивно в них все понятно. Так что пройдемся по ним для общего понимания. Что куда и зачем.
Здесь уже выставлено все по умолчанию, разве что осталось вставить API ключ Google, но это уже на ваше усмотрение. К примеру, я им не пользуюсь.
На второй вкладке стандартное распределение ролей на сайте. Кому что можно и что нельзя делать.
На третьей вкладке вы выбираете в каких именно типах постах отображать или не отображать настройки Oxygen. Например, он нужен вам только на страницах, но ни как ни в новостях блога. Снимаете или ставите галочку с конкретной позиции.
SVG Sets – раздел которым лично я не пользуюсь, но возможно кого-то и заинтересует возможность масштабируемая векторная графика.
Typekit – работа со шрифтами.
Oxygen License – раздел про лицензию и все такое.
CSS Cache – оставляем галочку на месте и идем дальше.
Bloat Eliminator – на ваше усмотрение, можете оставить все как есть по умолчанию.
Library – вот в этом разделе у меня перевод явно не задался.
Вот, собственно, и все настройки плагина. Больше ни чего настраивать и не нужно.
Так что переходим к визуальной части редактора. Вот в ней то самое интересное. Раздолье для творчества. Я покажу на примере уже установленной демо версии сайта, так чтобы примерно было понятно с чем придется иметь дело. Но скажу честно, даже кинув быстрый взгляд на настройки, я понял, что с этим плагином мы будем дружить.
Плагин Oxygen – визуальный редактор страниц и его визуальная составляющая
Итак, я установил один из шаблонов, который предоставляет плагин. Выбрал первый попавшийся. Не заморачивался. Разберем сначала внешние блоки (начальные), потом перейдем уже к внутренней части.
Сначала разберем верхний правый угол, потом перейдем к левому.
В правом углу находятся:
Структура – здесь находятся все блоки, которые представлены на страницы. И возможность с ними взаимодействовать (кроме подвала). В ней есть 2 кнопки: “Развернуть Все” и “Свернуть все”. Если нажать первую, то вы увидите какие блоки и что они содержат находятся на странице. Разумеется, что если перейти на какой-то отдельно взятый блок его можно изменить, так как необходимо.
Управление – в нем находится 3 пункта:
- Настройки – здесь представлены общие настройки страницы. Например, увеличение уменьшение её + вы можете менять стили страницы. Кроме того можно менять шрифты и цвета.
- Таблица стилей – здесь вы можете добавлять свои стили.
- Селекторы – здесь точно так же как и в стилях. Можно добавлять и убирать по необходимости.
Вернуться к WP – это возвращение в панель администратора либо переход на front-and
Сохранить – сохраняем то, во что внесли изменения.
В левом углу находится только одна кнопка – “Добавить”:
Здесь в принципе ни чего особенного нет. Все как и в обычном редакторе. В той же стороне находится возможность редактирования страницы. Точнее её шаблона:
Нажимаете кнопку редактирования, попадаете на страницу редактирования. Выбираете блок, который хотите добавить на страницу или удаляете его, потом переходите к его настройке.
Ради эксперимента я добавил картинку с текстовым блоком. В принципе, можно вставлять все что угодно. Единственное отличие, от других редакторов в том, что перетаскивать мышкой не получится. То есть сначала ставите контейнер, потом в него уже закидываете то, что вам нужно.
В начале как я говорил, что нет возможности работать с подвалом сайта. Я – ошибся 🙂 Но, откровенно говоря, немножко помучился прежде чем допер, где сидит бобр 🙂
Как я и предполагал, все оказалось предельно просто.
Идем в плагин Oxygen находим в нём Templates – находим в нём шаблон “Main” и отправляемся его править. А там уже все по стандарту:
В принципе больше про этот плагин рассказывать особо не чего. Он отлично подойдет для Landing Page. Думаю, при его использовании стандартный лендос можно сделать часа за 3-4. Тупо используя встроенные шаблоны.
Есть ещё пару моментов, у плагина есть 2 дополнительные фишки:
WooCommerce
Gutenberg Block Builder
Разработчик решил упростить принцип дохода от своего плагина и сделал 3 пакета:
На основной канал в Telegram – сможете найти информацию по самому плагину, а вот на VIPZona991 пойдет уже информация по комплексу.
Так что, смотрим. Кайфуем, работаем. Снова кайфуем 🙂
Ай да, молодца! Хороший билдер?
Рад стараться 🙂 Пользуйтесь на здоровье 😉
Thanks very nice blog!
Thanks. Please use it.
Почему у меня он весь на английском?
Потому что файлы, которые отвечают за перевод плагина на русский язык располагаются у вас только вместе с плагином, по всей видимости. Для того, чтобы плагин заработал так, как вам нужно – частично на русском языке – исполняющие файлы плагина oxygen-ru_RU.mo & oxygen-ru_RU.po необходимо скопировать в специальную папку на вашем хостинге. У всех она выглядит по разному, в зависимости от хостера, но путь одинаковый. Пример: корень вашего сайта/wp-content/languages/plugins – копируете туда 2 файла, про который я сказал выше, и обновляете страницу админки сайта в браузере. И все станет хорошо.