- Реєстрація домену та постановка на хостинг.
- Налаштовуємо тему.
- Розуміємо логіку WordPress і втілюємо її у себе.
- Ставимо плагіни в WordPress і радіємо :)
- І тепер хочу виділити плагіни, які мене дуже вже порадували. Зараз буде серія з трьох шорткод-плагінів.
Вітаю всіх майбутніх читачів нашого ресурсу. Сьогодні я хочу розповісти, як без навичок програмування за один день з нуля налаштувати блог на WordPress. Чому саме WordPress? На сьогодні це найпопулярніша платформа в інтернеті для блогерів. У неї купа тим, безліч налаштувань, вона легка в адмініструванні + я в ній уже працював до цього, і вона мені сподобалася.
Я люблю структурувати інформацію, тому розпишу свої кроки по списку:
Реєстрація домену та постановка на хостинг.
1) Перш за все потрібно вибрати доменне ім'я для вашого блогу. Я люблю підбирати доменне ім'я на цьому ресурсі. Реєструємо вподобане доменне ім'я. Краще відразу його реєструвати по можливості у хостинг-провайдера, щоб потім не мучитися з переносом. Можливо, для досвідчених розробників це легка операція, але всім іншим раджу реєструвати доменне ім'я відразу ж у свого майбутнього хостера.
2) Потім ставимо обраний доменну адресу до хостера. Я реєстрував свій домен на сайті Jino . У мене там був купон на безкоштовну реєстрацію в зоні .ru, тому недовго думаючи я зареєстрував домен і поставив його на хостинг сервісу Jino.
3) У компанії «Джино» є хмарний сервіс для сайтів популярних CMS, в тому числі для WordPress. Потрібно прив'язати обране доменне ім'я до цього сервісу. На цьому кроці я мало не зазнав фіаско і вже хотів звертатися до кого-то. Заковика була в тому, що потрібно було почекати пару годин, поки домен причепиться до хостингу. Може бути, я помиляюся в якихось термінах, але у мене було так. Під час періоду очікування виберіть тему для свого блога, щоб часом не проходило даром.
4) Я вибирав тему (зовнішній вигляд сайту) на цьому сайті . Тут представлено безліч російськомовних тим для WordPress + є зручні фільтри. Раджу вибирати адаптивну тему, щоб в майбутньому сайт адекватно відкривався на всіх пристроях. На wp-templates можна без реєстрації скачати вподобану тему в форматі .zip. Я вибрав адаптивну тему від Theme Horse - Interface .
5) Заходимо в адміністративну панель сайту (можна зайти з хмарного сервісу або відразу прописати його в форматі www.вашсайт.ru / wp-admin). Завантажуємо нашу тему. Все це робиться простіше, ніж я думав спочатку. Навіть не довелося розпаковувати файл .zip. Як і де це робиться можна подивитися на скріншоті:
Ставимо тему в WordPress
Налаштовуємо тему.
1) Потрібно прописати назву та короткий опис сайту. Робиться це в меню «Зовнішній вигляд - налаштувати».
2) Статистичної головною сторінкою я вибрав одну зі сторінок сайту. Можна зробити сторінку з вашими записами з блогу.
3) У параметрах теми я налаштував розмітку сайту - вибрав вузький шаблон. Бічну колонку сайдбара прописав справа. Включив адаптивність. Тут же я вставив favicon сайту (favicon - це значок, який відображається при пошуку вашого сайту і у вкладках браузера нагорі). Тут же я прописав свої контакти і автоматично нагорі сайту з'явилися значки соцмереж і мій номер телефону. За цими параметрами я пробігся дуже швидко, так як, швидше за все, у кожної теми вони свої. І так, напевно новачки не знають, що таке сайдбар. У сайдбар можна поставити різні віджети, які додадуть функціонал вашого блогу і поліпшать навігацію в ньому. Зараз я покажу його на прикладі своєї теми:
Sidebar на прикладі мого сайту
4) Сайдбар налаштовується в розділі «Зовнішній вигляд - віджети». Я поставив в Sidebar рубрики блогу, хмара тегів, фотографії зі свого Instagram (далі поясню, як це зробити), архів записів і підписку на розсилку блогу (знову ж поясню, як поставити підписку).
5) Налаштовуємо меню блогу в розділі «Зовнішній вигляд - меню». Під меню тут мається на увазі верхній рядок сайту. На прикладі вище: про нас, блог, наші послуги.
Розуміємо логіку WordPress і втілюємо її у себе.
Я не відразу зрозумів відміну звичайних сторінок від записів блогу. Звичайні сторінки - це якраз сторінки, які можна налаштувати і поставити в меню сайту. Записи блогу - це стрічка записів вашого блогу.
1) Я вирішив зробити наступні види меню:
- Про нас: тут я прописав інформацію про нас з Наталкою.
- Корреспондент: Точка зору власне сюди будуть складатися записи нашого блогу.
- Наші послуги: тут я красиво оформив те, що ми маємо намір пропонувати людям.
В майбутньому я зможу легко додати і інші пункти меню.
Ставимо плагіни в WordPress і радіємо :)
Справжньою знахідкою для мене було безліч плагінів для WordPress, за допомогою яких можна здійснити справжнє диво з вашим сайтом. Для мене це було саме так. Спершу я навіть не думав, що зможу настільки наблизити свій блог до ідеалу. Спочатку хотів налаштувати блог хоч якось, головне, щоб була можливість поділитися своїми думками та ідеями з іншими людьми. У підсумку я налаштував блог максимально близько до ідеалу.
Модулі - це спеціальні інструменти, які додають в адмін.панель сайту додатковий функціонал і дозволяють налаштувати сайт так, як треба. Зараз я пробіжуся по поставленим плагинам, так як інформацію я збирав по крихтах з декількох сайтів. Часто інформація була стара, зустрічалися випадки, коли був класний плагін в описі, але на ділі він опинявся з нульовим рейтингом і ще не підтримувався моєї версією WordPress. Для мене було важливо, щоб плагін бажано підтримувався моєї версією WordPress (були випадки, коли доданок не підтримувався і не працював), був інтуїтивно зрозумілий і додавав потрібний мені функціонал + мав рейтинг вище 3 зірок. Якщо я не міг розібратися з плагіном протягом 10 хвилин, то я тут же видаляв його і переходив до наступного. В результаті у мене вийшов такий топ-лист плагінів на березень 2015 (я спеціально вказую поточну дату, всі плагіни робочі, протестовані мною на працездатність, їх можна сміливо ставити на свій сайт):
1) All In One SEO Pack: даний плагін допомагає оптимізувати ваш сайт, щоб пошукові системи його потім легше знаходили. Також плагін допомагає налаштувати відображення ваших сторінок при расшаріваніє + тут же є налаштування швидкодії. Це дуже потужний плагін і тут багато налаштувань. Я керувався цією інструкцією при його налаштуванні. Спасибі Олександру Борисову за докладну інструкцію.
2) Cyr-And-Lat: плагін дозволяє прописувати url сайту в латинській форматі. Це потрібно, щоб гугл і яндекс любили ваш сайт. Ось так виглядає плагін в своїй роботі при додаванні запису:
Плагін Cyr-and-Lat - приклад
3) Contact Form 7: плагін дозволяє налаштувати форму зворотного зв'язку. З її допомогою відвідали сайту можуть залишати заявки для зворотного зв'язку. При відправці заявки ви отримаєте її на свою електронну пошту, її ж отримає і відправник. Налаштування форми інтуїтивно зрозумілі. На жодні сторонні сайти ходити не потрібно, щоб налаштувати пересилання листів (я боявся, що буде потрібна серйозна настройка). У підсумку ми отримуємо досить симпатичну форму зворотного зв'язку в стилі обраної теми:
Форма зворотного зв'язку
4) Disqus Comment System: плагін для коментування ваших сторінок і записів. За допомогою цього плагіна будь-який відвідувач сайту зможе легко коментувати, авторизувавшись через свою улюблену соц.сетях або через профіль Disqus. Потрібно буде зареєструватися на сайті Disqus і там же прикріпити плагін до свого сайту. Єдиний мінус - не можна авторизуватися через VK. На багатьох сайтах я бачив цю систему коментування, і вона мені сподобалася. В результаті відвідувачі сайту зможуть залишати коментарі ось в такий симпатичною формі:
Система коментування Disqus
5) Google Analytics Dashboard for WP: плагін для перегляду статистики за допомогою Google Analytics. Перед цим потрібно зареєструватися в Google або увійти в свій аккаунт, додати ваш сайт в гугл-аналітику (можна зробити прямо в плагіні або через файл підвалу сайту - краще подивитися окремі топіки в інтернеті по цій темі). В принципі, це необов'язковий плагін. Всю необхідну статистику можна дивитися відразу в Google Analytics, але тут я думаю буде зручно швидко подивитися найважливіші метрики.
6) Instagram Picture: за допомогою цього плагіна ви зможете додати фотографії з Instagram на сайт. Я додав їх в сайдбар нашого сайту. Трохи мучився з цим плагіном, але все-таки зміг його налаштувати. Перш за все потрібно зв'язати ваш інстаграмм-аккаунт з цим плагіном. Робиться це в розділі Configuration, там же є інструкція, як це зробити. Для додавання галереї фотографій в сайдбар використовуйте меню «Зовнішній вигляд - віджети». У підсумку виходить досить симпатична галерея з фото (її можна подивитися праворуч у цьому записі), яка ще й автоматично оновлюється.
7) Kento Post View Counter: плагін, який вважає і відображає кількість переглядів записи блогу або сторінки сайту. Показує число переглядів за сьогодні і загальне число переглядів. Текст «Сьогодні переглядів» і «Всього переглядів» можна налаштувати так, як подобається. Звичайно, це другорядний плагін, але я побачив таку статистику в цьому блозі , Мені сподобалася ідея, і я її втілив у себе. У підсумку виходить так:
вважаємо перегляди
8) MailMunch - Increase your Email Subscribers by over 500%: назва плагіна говорить сама за себе. За допомогою нього я буду збирати базу передплатників блогу. Дуже інтуїтивний і зрозумілий плагін. У мене не виникали складності з його установкою. Буквально «тикаєш» і отримуєш результат, юзабіліті «рівня Бог». Я додав Bottom Bar, який з'являється внизу сайту і пропонує підписатися на блог. Також додав форму підписки в наш улюблений сайдбар. Важливий момент: плагін просто збирає емейли. Він не займається інформуванням абонентів про появу нових записів в блозі. Для автоматичного інформування передплатників потрібно додавати FeedBurner , Але він мені не сподобався за свій убогий вигляд. Я вирішив, що поки буду вручну інформувати передплатників через MailChimp або Unisender : Я ще не зробив свій вибір. На початкових етапах, коли передплатників буде в районі 10-15, то можна взагалі робити це вручну. Ось так симпатично виглядає форма підписки на блог в результаті в сайдбарі:
Форма підписки на основі плагіна Mailmunch
І ось так виглядає форма підписки внизу сайту (можна налаштувати різні варіанти її появи, виходить «поверх» сайту):
Форма підписки Mailmunch внизу
9) Responsive Lightbox - Спливаючі фото: цей плагін дозволяє налаштувати режим відображення фотографій в блозі. Справа в тому, що за замовчуванням фотографії відкриваються в новій вкладці, однак це зовсім незручно. Плагін дозволяє відкривати фотографії у спливаючому вікні + можна налаштувати зовнішній вигляд цього вікна. Я вибрав режим відображення фотографій prettyPhoto. Також додав кнопки соцмереж. Інші параметри залишив за замовчуванням. Всі фотографії в блозі (крім віджета інстаграмма) тепер працюють за допомогою цього плагіна.
10) Social Likes: плагін, який додає соціальності вашого блогу. Тепер будь-який запис блогу можна легко розшарити. Досить симпатичні в підсумку вийшли кнопки (є кілька видів кнопок). Підтримує всі сучасні соцмережі і навіть російські VK і Однокласники (правда, я не став ставити можливість поділитися в Одноклассниках). Мої налаштування плагіна: скін - плоский легкий, вид - горизонтальний, додав лічильники, вибрав потрібні мені соцмережі. Гарний результат на зображенні знизу:
кнопки розшарювання
11) TinyMCE Advanced: плагін розширює можливості стандартного редактора. З його допомогою в запису можна додавати таблиці, вставляти відеофайли, додавати розриви сторінок і т.д. Стандартний редактор в WordPress дуже обмежений, розширена версія редактора мені сподобалася більше. Редакторів дуже багато для WordPress, спробуйте інші. Я спробував їх з десяток і зупинився на цьому.
12) WordPress Backup to Dropbox: плагін «захищає» сайт - робить резервну копію і автоматом складає її в Dropbox , Що дуже зручно. Я налаштував резервне копіювання один раз в тиждень і прив'язав його до свого облікового запису Dropbox. Плагін безкоштовний (як і всі перераховані вище) до певного обсягу в МБ, але я думаю мені його надовго вистачить.
І тепер хочу виділити плагіни, які мене дуже вже порадували. Зараз буде серія з трьох шорткод-плагінів.
До цього я не був навіть знайомий з словом шорткод, але я швидко зрозумів, як ними користуватися і був дуже радий такій функціональності. Модулі шорткодов з мого огляду дозволяють прямо з редактора додавати різні елементи на сайт: іконки, таблиці, колонки, вкладки, гугл-карти, підказки і цілу купу всяких корисних штук. Спочатку я хотів встановлювати собі редактор по типу drag & drop, але, перебравши штук 5 редакторів, зрозумів, що мені вони не подобаються. Ще великий мінус такого редактора в тому, що при його деактивації у мене злітали все настройки запису, які я їм робив. Перейдемо до шорткод-плагинам:
13) Шорткоди: ось так просто називається цей плагін. Його автор Володимир Анохін. Це найкращий шорткод-плагін, який я знайшов. У нього ціла купа можливостей, які я навіть ще не встиг вивчити. Поки я тільки використовував його з метою створення послуг і пробував розподіл на колонки. Швидше за все, даний плагін ще не раз мені знадобиться в майбутньому.
14) Meks Flexible Shortcodes: плагін шорткодов простіше попереднього. Я навіть не впевнений, що я їм буду часто користуватися, але мені сподобалася сила шорткодов в принципі, і тому я встановив ще й цей плагін. Поки з його допомогою я додав тільки пару іконок на сайт.
15) Olevmedia Shortcodes: плагін, дуже схожий на попередній. Тут мені сподобалися шорткоди, які дозволяють робити красиві інформаційні рамки. Також є великий набір іконок.
Ось такий елемент я створив за допомогою плагінів шорткодов:
Зробив за допомогою шорткодов
На всю настройку блогу я витратив один день (розбирався з ранку до самої ночі, правда). Ще хочу додати, що я відразу ж додав яндекс-метрику на сайт. Сподіваюся, стаття буде корисна таким же новачкам, як і я. У наступній темі я відкрию мотиви, які спонукали мене створити свій блог.
Буду радий почути поради або питання по темі настройки WordPress. Використовуйте плагін Disqus, щоб залишити свій коментар нижче. Підписуйтесь на блог, обіцяю - буде цікаво, спамом точно не мучитиме буду
3831 Всього переглядів 1 Сьогодні переглядів
Чому саме WordPress?
