Как создать сайт на Wordpress самостоятельно без знания языков программирования - новые возможности
Vložit
- čas přidán 2. 07. 2024
- Всем привет! Вы узнаете, как создать сайт на Wordpress самостоятельно и без знания языков программирования. Этот сайт может быть как для компании, так и ваш личный. Будут применены новые возможности - искусственный интеллект и др.
Если вы зарегистрируете домен и хостинг по этим ссылкам ниже, то мне будет бонус.
Ссылка на хостинг - beget.com/p195453
Мой партнерский код для хостинга 195453.
kwork.ru/ref/3618322 тут вы сможете заказать логотип и другие услуги с передачей вам авторских прав.
t.me/progerwebru мой телеграмм-канал, где я буду размещать новости и анонсы видео
Страница с кодом из видео progerweb.ru/sozdanie-sayta-n...
Мое первое видео • Создаем сайт на Wordpr...
Контакты - progerweb7@mail.ru
Timecode
00:00 какие возможности будут на сайте
03:06 регистрация на хостинге и выбор тарифа
09:15 аренда хостинга двумя способами на выбор:
11:27 оплата сразу за год для экономии и за это 1 домен в подарок
14:47 бесплатный 30-дневный период и нужно внести сумму за домен
16:07 как выбрать домен - бесплатный сервис для подбора
17:40 как проще продать домен
18:47 сервис для просмотра истории домена (снижаем вероятность его бана в поисковых системах)
20:37 завершаем второй способ регистрации на хостинге
21:35 заказываем бесплатный SSL-сертификат для надежного шифрования (защита данных ваших пользователей, протокол https)
22:45 подготовка и установка системы управления сайтами Wordpress (CMS Вордпресс) и почему стоит выбрать его
28:32 ставим редирект с протокола http на https
29:20 из-за чего важно установить SSL-сертификат (защита от Man-in-the-Middle и др.)
31:10 плагин Really Simple SSL для переадресации на https
33:08 плагин Maintenance для скрытия сайта во время разработки (страница с оповещением о скором возобновлении работы сайта)
35:13 настройка панели управления: ее главная страница, пункты меню колонки слева
37:10 как добавить нового пользователя: его роли и возможности
41:10 настройка вида ссылок для удобной их читаемости
42:06 плагин Cyr-to-lat для замены в ссылках русских букв на на латинские
44:55 установка плагина Classic Editor для удобства редактирования материалов
46:29 как сделать резервную копию сайта и восстановить его из нее при сбое
57:23 установка темы Astra
58:25 установка плагина Starter Templates - шаблоны Elementor, Wordpress и Beaver Builder
59:29 выбираем шаблон для создания сайта
01:02:44 настройка Elementor: включение опции для SVG и Flex-контейнера
01:04:18 преимущество Flex-контейнера перед внутренней секцией
01:06:43 настройка шапки сайта (header)
01:07:12 как законно создать логотип и какой сервис выбрать
01:14:28 редактирование номера телефона и установка кода для звонка по клику
01:17:33 настройка пунктов меню и кнопки Get a quote
01:24:27 настройка прозрачного заголовка
01:26:13 как добавить шаблон на новую страницу
01:30:21 перемещаем меню выше
01:31:52 прижимаем нижнюю часть сайта к низу экрана (подвал или другое название - footer)
01:35:07 плагин Simple Custom CSS and JS для безопасного добавления кода
01:37:27 настраиваем внешний вид сайта
01:40:25 конвертируем формат изображений в WebP для более быстрой загрузки страниц через онлайн-сервис
01:44:20 плагин Converter for Media для автоматической конвертации изображений в WebP
01:53:34 как менять текст на страницах
01:53:52 редактируем текст с применением искусственного интеллекта (AI)
02:00:38 меняем стили, расширенные настройки, эффекты движения и остальные эффекты
02:21:16 атрибуты Alt и Title для изображений, как их нужно заполнять
02:26:47 настройка остальных секций
02:31:30 установка и настройка контактной формы Contact Form 7
02:37:27 добавление плагина Country & Form Field Contact Form 7 к номеру телефона для выбора кода страны
02:56:49 добавляем политику конфиденциальности и чек-бокс в контактной форме
03:07:29 как с нуля создавать секции страниц и добавлять готовые
03:21:50 учитываем расстояние фона для верхней части сайта (шапки или header)
03:23:14 как настроить подвал сайта (Footer)
03:26:31 плагин Yoast SEO для продвижения сайта, его установка и настройка
03:37:26 как заполнять метатеги Description и Keywords
03:42:19 плагин Codevyne SEO Meta Keywords для добавления метатега Keywords - ключевые слова для страницы
03:44:54 как добавить сайт в Вебмастер Яндекс
03:48:57 добавляем Favicon
03:56:16 адаптируем сайт под планшеты и смартфоны
04:01:11 настройка ширины поля телефона в контактной форме под разные устройства
04:02:18 настройка ширины строки текста под контактной формой
04:06:38 плагин Updraft Plus для автоматического резервного копирования сайта с хранением копий на хостинге или на Google Disk
04:20:00 мое мнение о Captcha и схожих сервисах из официального исследования
04:23:07 счетчики для сайта и его безопасность - инструкция есть в моем другом видео, ссылка на него в описании
04:24:43 завершение, и важно перевести опцию Maintenance в off.
Как только вы создадите сайт, важно отключить опцию его скрытия в плагине Maintenance (если вы его ставили, как я рассказал в этом видео). Для этого всего лишь нужно нажать на переключатель on/off для установки значения Off. И если в плагине Yoast нет поля File Editor, то оно появится, если отключите плагин Really Simple SSL - предварительно проверьте, включена ли переадресация с http на https в опциях на хостинге. Теперь о плагине Simple Custom CSS and JS - если через панель управления он не находится, то можно скачать его (будет в архиве) на официальном сайте ru.wordpress.org/plugins/custom-css-js/ , и после скачивания в панели управления в установке плагинов нужно нажать на кнопку "Загрузить" и выбрать скачанный архив. После установки нажимаете на "Активировать". И если с плагином для ключевых слов конфликты, то его можете удалить, так как keywords не все прописывают и находятся на первой странице выдачи, вы это сами можете легко проверить по любому ключевому запросу, и крупные сайты (может и не все) не прописывают keywords.
Прекрасно. Обясняет понятным простым русским языком. Подписался. Посоветую друзьям . Ждем продолжения твоих работ. С уважением.
Спасибо. Следующее видео будет в этом месяце. Планирую добавлять ежемесячно по 1, и может быть, 2 и более - чаще, чем раньше.
Ждем. Твои видео и рассказы как букварь лично для меня. Если , что не понятно и не получается пересматриваю и переделываю по несколько раз. Спасибо. @@progerweb
Долго ждал я второе видео и дождался. Спасибо.
Спасибо и вам, что ждали. Теперь видео будут выходить чаще.
Супер. Мне понравился дизайн!
Спасибо, выбирал получше, чтобы при этом был ровный и не нужно было дописывать код для корректного отображения макета.
Шедеврально! Спасибо, подписался!)Формат бомба, не бросай! Успехов и жду еще манульчиков))А лендинг в таком стиле трудоемко?
Спасибо за такой отличный отзыв! Видео о лендинге планирую изготовить после следующего, которого обещал ранее по запросам в комментариях
Топ!
Спасибо вам, отлично, что вы высоко оценили труд
Ого сделал такой топовый сайт. Спасибо
Спасибо и вам. Есть ещё одно видео, ссылку оставил в описании, с него тоже, может быть, пригодится информация
Добрый день! Спасибо большое за инструкцию! Подскажите пожалуйста по возможности по проблеме: после добавления слов "keywords" и обновления страницы, WP перебрасывает на страницу с сообщением: "Предупреждение: неопределенная переменная $new_meta_value в /var.... и т.д." Возможно и нужно ли это исправить? Спасибо!
Добрый, с данной ошибкой не сталкивался. Могу сразу вам порекомендовать, если не найдется решение (бесплатное), то не стоит тратить время на плагин для ключевых слов. Это было объяснено на всякий случай, если хотите соблюдать все правила. Но по факту, если вы посмотрите на крупные (да и некрупные) сайты, даже на первых строчках поисковиков, вы навряд ли найдете те, которые прописывают ключевые слова. И при этом они на первых строчках. Поэтому мое мнение, как и других, пусть может и не у всех - не стоит тратить время на данный плагин. Если хотите все же починить - рекомендую обратиться с вопросом на сервис qna от сайта habr.
@@progerweb спасибо большое за оперативный ответ!
Отличный материал! Все понятно👌🏻 Благодарю!!!решила сделать сайт по Вашему видео!
Подскажите пож, по какой причине WP может не пропускать картинки из соображения безопасности (их мне сгенерировал ИИ, формат jpg и png, вес менее 100 кб), а также часть картинок создала в canva, тоже допустимый формат и вес.
Большинство фоток не пропускает…
Спасибо. Изображения, которые не загрузились, вы дополнительно ещё не редактировали, например, в фотошопе? Иногда бывает, что при сохранении в таких программах формат один, а сохраняется в другом и в итоге wp такие изображения не пропускает. Либо есть способ, перед которым важно сделать резервную копию сайта, и после в корневой директории в файле wp-config.php внизу пропишите define('ALLOW_UNFILTERED_UPLOADS', true); сохраните и после сможете загрузить файлы через именно Медиафайлы - Добавить новый. Получше способ - попробуйте получить ответ на сайте qna.habr.ru или stackoverflow, подробно расписав ситуацию
@@progerweb Благодарю за совет!Я сейчас переименовала файл картинки на латинице (до этого было на кирилице), и WP принял 👍🏻 надеюсь, с остальными картинками так же будет… не знала об этом ))
@@user-ov8iy6kk7f , отлично, обращайтесь, если будут вопросы
Добрый день! У меня еще вопрос возник: на новых страницах шапка безцветная,
сделала в настройках AStra как Вы показали, но не помогло… скажите пож-ста, может сейчас по-другому это можно исправить?
@@user-ov8iy6kk7f добрый день, вы нажали на Добавить страницу, затем внутри редактора нажали на перейти в elementor и загрузили для неё шаблон страницы из той же темы или другой? Далее нужно нажать на кнопку Обновить для сохранения, и затем нажать вверху "Редактировать страницу", после этого спускаетесь в редакторе вниз и увидите " Прозрачный заголовок", выбираете Включено и сохраняете. Я сегодня недавно так редактировал, всё применяется, попробуйте
Добрый день! Еще раз благодарю за материал! Благодаря Вам создала себе многостраничный сайт в elementor, на что не решалась несколько лет! Единственно не получается реализовать 2 вещи, казалось бы простые, но здесь я остановилась. Эти темы Вы не раскрывали в своем видео, но если сможете подсказать, была бы очень благодарна! 1) когда установила в предложение текста внутренние ссылки, на некоторых страницах предложение с ссылкой обесцветилось, хотя в Стилях показывает, что шрифт стоит такой какой надо и не получается это исправить.
2) не пойму как прикрепить якорь на какой-нибудь подзаголовок или на телефон, указанный в шапке, куда будет направлять одна из моих кнопок. Сейчас все создаваемые кнопки автоматом направляют вверх, меня это устраивает, но происходит это резко, возможно потому что якорь не прикреплен).
Заранее благодарю!
Добрый день, стили проще посмотреть в самом коде через панель разработчика и, возможно, на некоторые ссылки вы нажимали для проверки и бывает так, что посещённые ссылки обесцвечиваются, тогда можно назначить свой стиль, например, поменяв цвет. На счёт якоря, тут проще видео снять, поэтому я бы вам советовал найти соответствующие на ютубе у других авторов.
@@progerweb Благодарю!
ВАУ!!!!!! Классс урок!!! СПС.
Спасибо вам за положительный отзыв
Доброго времени. У меня , в инсрументах плагина Yoast SEO, почему то нет *Редактор файлов*. Есть импорт и экспорт, Групповой редактор, Оптимизация SEO данных. А в низу написано -Оптимизация SEO данных завершена.
Доброго, может быть на хостинге есть ограничения на редактирования файлов. Эта ссылка должна быть, был на сайте у них на днях, новостей о удалении этой ссылки не было. Есть и другой выход - на хостинге в корне сайта вы можете сами создать robots, и заполнить его, потому что через эту программу записи в нём не всегда точные. И htaccess и так должен присутствовать ещё до установки yoast.
Посмотрел я подробнее, вероятнее всего, дело вот в чем - у вас отключены опции редактирования. Включить можно так - в корне сайта на хостинге в файле wp-config.php может быть строка define( 'DISALLOW_FILE_EDIT', true ); - тут слово "true" нужно заменить на false.
Здравствуйте, имя домена пока не зарегистрировано, просто хотел бы узнать на будущее. У меня вопрос по операции "Полная передача домена на другой аккаунт". Возможна ли передача домена между аккаунтами, зарегистрированными в Казахстане, т.е. между гражданами Казахстана? Также есть вопрос по последующему изменению уровня доступа в редактировании сайта. Исчезнет ли он полностью у аккаунта, передающего домен?
Здравствуйте, о передаче домена в Казахстане не подскажу, только могу посоветовать вам обратиться к регистратору. Доступы к редактированию останутся, потому что вы при передаче сайта передаёте все его файлы, и если на момент передачи пользователь не был удалён, то логин и пароль будут действительны.
Спасибо, буду следить за вами! Еще очень хотелось бы увидеть видео подобного формата по созданию маркетплейса
@@Khalych , на данный момент другие видео планирую. Не обещаю о маркет плэйсах, ваш запрос учту.
Подскажите, только начал пробовать WP. Установил тему. Создал несколько страниц, на свой текст в теме позаменял. А потом страницы перестали видеться в редакторе ВП, в консоли их видно. И при редактировании не сохраняет, пишет нет полномочий, что-то такое. И так на двух админских аккаунтах. Что случиться могло и как исправить?
И еще, как темы удалить не могу понять, которые пробовал, устанавливал? Они же место занимают.
Тут могут быть разные причины, например: включен плагин для визуального редактора, или мешает плагин для бэкапа - тогда есть способ - вписать произвольный набор символов константам AUTH_KEY, SECURE_AUTH_KEY, LOGGED_IN_KEY и NONCE_KEY в файле wp-config.php. Темы удаляются так - Внешний вид → Темы - нажимаете на неактивную тему и внизу в открывшемся окне увидите кнопку "Удалить". Важно переключить на другую тему, сделав ее активной, и затем тогда удалять неактивные. Если тема от Wordpress.com, то она не хранится у вас на сайте.
@@progerweb спасибо! Буду вникать) А еще подскажите, погуглил, пишут, что темы на Гутенберге более быстрые, чем на Элементоре, что для продвижения сайта важно. На Гутенберге можно такие же красивые спйты делать? Намного сложнее?
@@sergey_ra , Гутенберг выигрывает у elementor в производительности, например, при добавлении записи через Гутенберг запросов к базе данных будет меньше, чем если через Элементор. На втором из них делается дизайн, лендинги, а записи бывает проще создать с Гутенбергом в этом смысле.
Привет. Создаю новую страницу, делаю как вы показали контейнер в контейнере, но не получается сделать общий фон, чтобы он заходил на хэдер. Хэдер получается отдельным цветом(
Привет. Может быть, вы не досмотрели ещё до момента, когда я рассказываю о прозрачном хедере, в видео рассмотрен он. Нужно нажать на опцию редактирования материала, чтобы перейти в редактор нужной страницы, и будет опция включения прозрачного хедера
@@progerwebспасибо разобрался👍👍👍
Цитата: (Доброго времени. У меня , в инсрументах плагина Yoast SEO, почему то нет *Редактор файлов*. Есть импорт и экспорт, Групповой редактор, Оптимизация SEO данных. А в низу написано -Оптимизация SEO данных завершена.) Оказавается -Редактор файлов не отображается из-за конфликта с плагином really-simple-ssl. При отключении really-simple-ssl редактор появляется. Если его оставить отключенным что будет с сайтом? Пробовал переустановить, при активации возникает такая же проблема, после деактивации проблема исчезает.
Ставлю на сайты really simple ssl, и не было таких ситуаций. Это странно, что возникает конфликт. При отключении этого плагина не будет трудностей, в том числе с переадресацией на https, так как на хостинге, если у вас beget, есть опция в панели управления для переключения на https. На других она тоже должна быть. Плагин ставится как дополнение, поэтому главное в панели управления настроить переадресацию, либо в файле htaccess, который находится в корне сайта.
Понял , спасибо. Значит really simple ssl можно не включать. У меня beget.
@@user-sk8yh9yk7w, да, всё верно, really simple ssl не требуется
Понял, спасибо.
Посмотрел я подробнее, вероятнее всего, дело вот в чем - у вас отключены опции редактирования. Включить можно так - в корне сайта на хостинге в файле wp-config.php может быть строка define( 'DISALLOW_FILE_EDIT', true ); - тут слово "true" нужно заменить на false.
У меня почему то нет такой строки в корне сайта на хостинге. Что за невезуха......
Тогда я советую обратиться в службу поддержки хостинга, подробно описав ситуацию с плагином. В большинстве случаев они решают вопросы, потому что они могут возникать из-за их настроек.
Спасибо. Попробую.
Есть только плагин Simple Custom CSS Plugin где можно * Введите сюда ваш произвольный CSS */ Можно и его установить?
Проверил, действительно в панели wp нет этого плагина, его можно скачать на официальном сайте ru.wordpress.org/plugins/custom-css-js/ и после скачивания в панели управления wp в установке плагинов нужно нажать Загрузить, и выбрать скачанный архив. После установки нажимаете на Активировать. Будут вопросы, пишите
@@progerweb скачала, установила, скопировала код, но он занимает 138 строчек, а у вас в ролике всего 6. И надо нам вставлять код "div#content{
flex-grow:1
}" ? Может не тот код про который говорите в ролике?
@@progerweb и еще: сделать резервную копию сайта и восстановить его из нее при сбое делаем когда нет самого моего сайта на вордпресс - ни темы, ни контента?
@@orhideja52 , на странице есть несколько вариантов кода, скорее всего, вам нужен другой. На счет резервной копии уточните ваш вопрос, что именно вы хотели узнать. Starter Templates так и должен предлагать установку.
один скромный вопрос. В каком году был записан этот контент?
Я планировал поменять thumbnail на более точный, так как на данный момент он не всегда может соответствовать ожиданиям. Если вы о нём.
04:02:18 настройка ширины строки текста под контактной формой - не работает! конкретно не передвигается чекбокс после внесения изменений в css, изменение сохранил, поставил галочки для администратора и для стороннего просмотра, даже !important поставил напротив строки с margin-ом, зашел с firefox - ни чего не помогло! что может быть? подскажите!
Возможно, кэш браузера нужно очистить. Либо не тот элемент был выбран. Проверьте также и другие свойства, селекторы. Для более простой проверки попробуйте сначала свойства применить в панели разработчика, как я в видео пример показал перед копированием кода.
почистил кэш, сделал всё как на видео - не помогло(@@progerweb
Мне из-за чего-то не пришло уведомление о вашем комментарии. Нашли решение?
почему никто никогда не говорит, что эти бесплатности - домен, сертификат только на год !. а потом все ой ай )))..откуда домен 900...сертификат 2000 ). (ну разумеется серификат все бесплатный оформляют потом)
В видео говорил, сертификат действительно бесплатный, продляется через определенное время. Продление домена - это смотря где, на beget на данный момент 390 р за год, у других хостеров бывает бесплатно, но оплата за сам хостинг при этом может быть дороже
НЕ ВСТАВЛЯЕТСЯ ФОРМА ОБРАТНОЙ СВЯЗИ
Вы всё пошагово делали? Сделайте всё именно как я рассказывал, всё получится
@@progerweb да, а отдельно ставится