My Green WordPress

Introduction

Приветствую вас всех! Сегодня на данной статье мы рассмотрим проект My Green WordPress, как создавать многостраничный и профессиональный веб-сайт про альтернативные источники энергии на такой CMS платформе как WordPress. Тематика проекта My Green WordPress является зеленая энергетика или энергия будущего, что очень актуальна на текущее время. Сам проект очень легкий и увлекателен для всех. А самая главная цель данного проекта заключается в том, что мы научимся тому как использовать плафторму для создания сайтов, с которым уже было создано более 75 МЛН сайтов.

Glossary

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

CMS –  это система создания и управления сайтом. Это визуально удобный интерфейс, с помощью которого можно добавлять и редактировать содержимое сайта.

Plugin (Плагин)- независимо компилируемый программный модуль, динамически подключаемый к основной программе и предназначенный для расширения и/или использования её возможностей.

Theme (Тема) — это инструмент для изменения макета и дизайна вашего сайта. Темы настраивают внешний вид вашего сайта, включая макет, типографику, цвет и другие элементы дизайна.

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

Goal

Наши цели:

  • создать сайт с несколькими страницами и хорошим дизайном
  • заполнить контент сайта информацией про зеленую энергетику
  • загрузить наш сайт на бесплатный хостинг
  • создать WORDPRESS_URL.txt файл и записать туда ссылку на наш загруженный веб-сайт
  • отправить проект на проверку

Plan

Итак, у нас есть понимание цели и видение того, как делать My Green WordPress. Но как это все реализовать на практике ??? Сейчас рассмотрим. Наш подход будет таковым:

  1. Сначала мы должны получить домен используя бесплатный хостинговый сервис
  2. Загрузить WordPress на наш пустой сайт(мы только что получили домен и наш автоматический созданный «сайт» пока что пустой).
  3. И уже там начать редактировать внешний вид сайта используя WordPress. (Мы уже загрузили сайт на хостинг и на данном этапе мы лишь редактируем наш сайт.)
  4. Добавить определенное количество информации про зеленую энергетику и отправить на проверку.

1. Получение бесплатного домена

В качестве бесплатного хостингового сервиса будем использовать вот такой сервис — КЛИК-КЛИК.

На главной странице этого сервиса нажимаем на get started и создаем аккаунт, далле заходим через этот же аккаунт в свой личный кабинет.

Далее в личном кабинете должно быть лейбл Start a new project, нажимаем туда.

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

Установка WordPress на наш сайт

После предыдущего шага нам будут представлены на выбор несколько cms. Выбираем WordPress и ждем загрузку. Загрузка занимает немало времени.

Ура! Мы на пол пути! Теперь у нас создался пустой сайт и для того чтобы, его увидеть нажмаем на Visit Development Site.

Далее, появится окно WordPress-а. WordPress запросит вас заполнить кое-какие данные о вашем сайте, заполяете и ВУАЛЯ! Загрузку на хостинг уже сделали и теперь осталось лишь добавить чуть-чуть красоты и содержания.

Редактирование внешнего вида

Для начала познакомимся с консолем. Консоль — это место где, вы можете редактировать, смотреть аналитику, добавлять, удалять записи, медиа вашего сайта. В верхнем панеле стоит имя вашего сайта, наводя к этому, вы можете увидеть visit website. Нажав на него, вы увидете как выглядит ваш сайт.

В разделе Dashboard или же Консоль нам нужно для начала установить определенные темы и плагины для быстрого и красивого старта и удобного дальнейшего расширения сайта. Начнем сначала с установки Theme.

В боковой панели консоли -> Appearance -> выбираем Themes.

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

Нажимаем Add New чтобы добавить и в search-bar-е вводим Ocean WP. Тема которую мы собираемся установить. После установки данной темы — в сохраненных темах наводим на Ocean WP и активируем его нажав Activate. После установки должно выйти такое уведомление.

При установке данной темы, Ocean WP для ее корректной работы запросит установить определенные плагины которые ей нужны. Нажимаем на эту ссылку, меняем bulk actions на install и нажимаем на apply. В случае ошибки вы можете перейти на плагины -> нажать на add new -> и выбрать там ocean extra и установить. Не забудьте активировать.

После активации выходит еще одно уведомление как:

Нажимаем на синюю кнопку и нас приветствует акула, или дельфин. Нажимаем на get started -> выбираем шаблон, который вам нравится -> Install demo -> после этого нажимаем на все плагины где стоят install now. Ждем….. и нажимаем снизу на import. Пропкускаем следующий этап и у нас должно выйти такое окошко.

Нажимаем на view your website и смотрим наш сайт. Вау! Наш сайт стал привлекательным.

В WordPress вы можете редактировать сайт двумся способами:

  • Customize
  • Через установленный плагин, для нас Elementor. Он скачивается автоматический после Ocean EXTRA

Редактирование с Customize

В Customize можно редактировать сайт:

  • Через боковую панель
  • Через синие иконки карандаша

В боковой панели представлены элементы блока такие как, меню, виджеты, сайта идентити и тд. Каждый блок имеет свои настройки, стили и тд. С боковым панелем можно редактировать все элементы.

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

Редактирование с Elementor

Нажав на верхней панели на Edit with Elementor. Вы переходите на пространство Elementor. В рабочем пространстве Elementor, вы можете менять содержаения сайта лишь нажав на них.

Например, я нажал на текст как Green Energy в Elementor. У меня откроется окно настроек данного текста. Вы можете редактировать Content | Style и добавлять разные анимации к своему виджету.

Добавление информации

Теперь ваша очередь улучшить внешний вид, добавить хорошее содержание на данную тематику. Do your best!

Recap

Мы рассмотрели как получить бесплатный домен, как установить WordPress на свой сайт, познакомились с терминами такие как, theme, plugin. Узнали что такое, консоль и что используется для быстрого старта вашего сайта. Надеюсь я смог описать данный проект и желаю вам успешной сдачи My Green WordPress. До встречи!

Submit files

После того, как вы закончили свой красивый и информативный веб-сайт на WordPress, ваше чудо обязательно должны увидеть ревьюер или же ваши друзья. Поэтому чтобы поделиться с вашим творением, просто скопируйте URL-адресс вашего сайта до .pantheonsite.io и вставьте эту ссылку в файл WORDPRESS_URL.txt в DoCode. Затем отправьте на проверку :D.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.