Даний мануал показує процес швидкого створення affiliate сайту на WordPress без допомоги розробників в найкоротші терміни. Важливо – якщо ви любите бомжатські варіанти за копійки – це мануал не для вас. Тут ми будемо будувати сайт на якісній інфраструктурі та якісній темі.
Витрати:
- Хостинг $120 на рік – на анлім кількість сайтів.
- Тема $318 на рік – на анлім кількість сайтів.
Що отримаємо на виході:
- Сучасний адаптивний дизайн.
- Рейтинг 70 + для Mobile Core Web Vitals і Google Page Speed Insights.
- Повністю підконтрольні області сайту – header, меню, footer, сайтбари, контентний блок.
- Сучасна якісна drag n drop верстка, без допомоги верстальника або програміста.
- Налаштування будь-яких патернів URL для будь-яких типів сторінок.
- Повністю SEO-friendly – від мета-тегів до мікро-розмітці і hreflang.
Що будемо юзати:
- Дефолтний WordPress з автоустановкою на будь-якому хостингу
- Тему і фічі від Thrive – Thire Themes Thrive Architect
- CloudFlare для склеювання дзеркал і кешування
- В даному випадку – хостинг SiteGround* оскільки він якісний і має купу вбудованих зручних фішок.
* Важливо з березня 2021 посилилися правила реєстрації – тепер обов’язково потрібно ввести СМС/прийняти дзвінок з іноземного номера. UK/US/Canada. Не вводьте російські та українські номери – смс не прийдуть, а бабки спишуть, потрібно буде запитувати повернення коштів.
Однак, реєстрація в ньому не така вже й проста – тому як альтернатива піде Ukraine, Fozzy або будь-який інший
- Хостинг і сетап WP
- Реєстрація на хостингу
- Налаштовуємо схему: реєстратор CDN-хостинг
- Процес сетапа CloudFlare
- Де взяти IP хостітнга?
- CDN & SSL (HTTPS)
- Які ще є варіанти?
- Вирішення проблеми http на тесті vs https
- Міграція на siteground з тестових майданчиків
- Бекапи
- Налаштування Cloudflare
- Сетап тем і плагінів WordPress
- Що нам знадобиться з тем і плагінів
- Перша і важлива настройка
- Really simpe ssl
- Встановлення та налаштування Rank Math
- Додаткові плюшки та фічі
- Налаштування Permalink Manager Lite
- Налаштування Thrive
- Які ще плагіни можуть стати в нагоді?
- Як зробити ідеальну affiliate сторінку
- Робимо логотип самостійно без дизайнерів
- Проблеми на сайті та шляхи їх вирішення
- Що ми отримаємо в результаті?
Хостинг і сетап WP
Як зареєструвати аккаунт на SiteGround з 99% ймовірністю.
Реєстрація на хостингу
Отже:
- Вибираєте тариф
- Вибираєте країну США
- Вибираєте не рідкісний штат, а нормальний – типу Флориди або Каліфорнії
- Йдемо в Google Maps в обраний штат, тикаємо на вулицю яка сподобалася – копіюємо всю інфу і вбиваємо
- Вбиваємо номер в міжнародному форматі + (код країни) (номер)
Приклад “+150*********” – по-іншому СМС не прийде. Де знайти номер – я регаю через фрі сервіс temporary-phone-number – номери можуть періодично вмирати, дивіться нові. Як перевірити, що сервіс який ви вибрали прийме СМС від SiteGround? Все просто – робите лівий аккаунт на GoDaddy і в профілі включаєте двофакторку на тимчасовий номер сервісу. Якщо СМС від Godaddy прийшло – прийде і від SiteGround – у них один шлюз відправки і майже однаковий анти-фрод. - Вбиваємо карту, оплачуємо
- Вводимо СМС від провайдера лівих номерів
- Потім у вас спишуть дрібну суму з карти – потрібно буде її вбити.
Все! У вас супер хостинг за супер ціною.
UPD: – добрі люди накидали ще хороших сервісів, куди можна прийняти СМС.
UPD2: якщо ви не пройшли реєстрацію – не прийшла СМС – у слідуйчий раз вбивайте іншу карту, інакше зв’яжуть акаунти і побанять
UPD3: краще взяти у реальну сімку в ЄС і прийняти СМС на неї.
Підсумок: реєструєтеся, встановлюєте коробку WordPress в 1 клік і можна починати.
Налаштовуємо схему: реєстратор CDN-хостинг
Базова схема настройки всієї конструкції:
- Потрібно отримати NS у CloudFlare
- Прописати NS CloudFlare на хостингу
- Потрібно отримати IP хостингу
- Прописати IP хостингу в CloudFlare
- Готово!
Розберемо докладніше:
Як змінити NS у реєстратора?
- У кожного реєстратора свій інтерфейс, але в цілому це знаходиться в Налаштуваннях домену
- На прикладі найпопулярнішого реєстратора – GoDaddy-заходимо в “мої продукти” — > управління DNS –> вводимо NS-сервера, які отримали в CloudFlare
- Йдемо в CloudFlare – натискаємо “перевірити”.
Процес сетапа CloudFlare
- Додаємо сайт (так, у вас для всієї цієї схеми повинен бути домен)
- Вибираємо Free тариф
- Вказуємо IP вашого хостингу
Де взяти IP хостітнга?
- SiteGround: на вкладці “Websites” навпроти потрібного сайту вибираємо – site tools.
- Далі відразу бачимо IP сервера.
- Міняємо в CloudFlare A-запис = IP сайту – на той, що взяли у хостера і тиснемо Продовжити.
- Далі CloudFlare видасть вам NS-сервера, які потрібно вказати у реєстратора.
CDN & SSL (HTTPS)
Для SSL (HTTPS) рекомендую юзати CloudFlare – вистачить безкоштовної версії. Чому?
- Безкоштовний SSL-сертифікат (SSL)
- У CF багато опцій по роботі з кешуванням
- Базовий захист від DDoS
- Можна налаштовувати редиректи і склейку дзеркал прямо через CF
- Не палите реальний хостинг, що досить приємно – як для того, щоб заховати себе так і свої PBN.
Важливо! У безкоштовної версії CF – один NS на всі сайти. Якщо хочете ховати свої дропи – купіть платну версію або регайте акаунти під кожен сайт.
Які ще є варіанти?
- SiteGround пропонує безкоштовний SSL сертифікат “з коробки” – можна юзати його
- Можна купити свій сертифікат і налаштувати все “руками” – але мені лінь. Та й навіщо? 🙂
Вирішення проблеми http на тесті vs https
Якщо ви робите сайт на локальному комп’ютері або створили сайт без HTTPs, і використовували міграцію на Siteground – змінити ім’я і URL сайт на HTTPS не вийде – WP не дасть.
Для цього юзаємо плагін Simple HTTPS – він замінить в базі всі шляхи з HTTP на HTTPS.
Ставимо даний плагін, далі – включаємо плагін, активуємо – все має запрацювати. Якщо не працює – куримо мануал. Класичний приклад такого багу – на сайті не будуть відображатися картинки. Якщо ви створюєте сайт відразу на хостингу – даної проблеми бути не повинно
Міграція на siteground з тестових майданчиків
Зробили сайт на локальному комп’ютері? Або на іншому хостингу і хочете перенести на SiteGround? – у них є крута фіча-плагін для WP – Migrator – і працює він наступним чином:
- На SG створюєте новий сайт і вибираєте “міграція” – отримуєте ключ
- Ставите плагін у свій WP, вводите ключ і тиснете “далі”
- Через 1-5 хвилин сайт буде вже на хостингу з усіма настройками
Бекапи
Бекапи нам потрібні:) якщо ми щось зламаємо або нам зламають. Можна юзати будь-які плагіни, але я юзаю вбудований функціонал SiteGround. Бекапи робляться автоматично. Але можна робити і вручну.
Автоматом бекапиться код і база, розгортається так само автоматом.
Налаштування Cloudflare
Після того як прописали NS-сервера CloudFlare у реєстратора і направили CloudFlare на IP хостингу – настав час його засетапити.
Що налаштовуємо?
- HTTPS = SSL – якщо не хочете паритися з установкою на хостингу – включаємо відразу – це безкоштовно
- Always use HTTPS – по факту склейка дзеркал в 1 клік
- Авто-стиснення JS/CSS / HTML засобами CDN – на етапі сетапа я не включаю щоб було простіше ловити баги. Увімкніть потім – зараз не треба.
- Brotli-стиснення. Я включаю, особливо ніяк на роботу сайт не впливає.
- Готово!
Можна зробити ще краще, для цього:
- Перевіряємо розділ Cache в CloudFlare – повинен бути включений.
- Включаємо на SG прискорення на рівні сервера – Nginx Direct Delivery.
- Врубаємо і налаштовуємо MemCached (опціонально) – дасть приріст сайтам де багато динамічного контенту, вибірок з БД, сортувань на лістингах і т. д.
Сетап тем і плагінів WordPress
Що нам знадобиться з тем і плагінів
- Тема – Thrive ShapeShift від ThriveThemes + плагін ThriveArchitect
Складається з двох плагінів
- Thrive Product Manager
- Thrive Architect
- Для SEO-Rank math / Yoast SEO – за смаком
- Permalink Manager Lite – управління URL – дає робити будь-які URL для будь-яких сторінок, ігноруючи структуру WP (категорії, теги та інше сміття)
- Really Simple SSL – якщо ви переносите сайт без HTTPS на бойовий сервер – виправить биті URL. Потрібно в 90% випадків – практично всі хостинги створюють сайт з HTTP
- WPML – опціонально робимо наш сайт багатомовним з коробки!
- ВСЕ, більше нічого не потрібно для старту.
Перша і важлива настройка
Поки пиляємо сайт – наш домен вже доступний! Потрібно закрити його від індексу.
Закриваємо у налаштуваннях – автоматом скрізь пропишеться Noindex
В Налаштуваннях вибираємо кастомну структуру URL – щоб ми могли прописувати які завгодно ЧПУ (/%postname%/)
Пам’ятайте, що Custom патерн урла не може бути порожнім! Інакше настройка просто не збережеться
Якщо налаштування не зберігається – проблема з правами запису в HTACCESS на вашому хостингу – гайд як вирішити це.
Really simpe ssl
Завантажуємо плагін з магазину плагінів – вбиваємо в пошук назву плагіна
УВАГА – Я тестував тільки цей плагін на коректну роботу. Інші плагіни можуть викликати нескінченні редиректи в адмінці та інші артефакти. А можуть і не викликати 🙂
Активуємо плагін в 1 клік.
Якщо далі не буде запускатися Thrive Themes – швидше за все проблема в HTTPS. Гайд з пошуку таких проблем.
А ще CTRL + SHIFT + J показує, що конфліктує
Встановлення та налаштування Rank Math
- Як і будь-який плагін на WP-Rank math встановлюється в магазині плагінів –> Activate –> потрапляємо у ВІЗАРД Налаштування.
- Можете скіпнути логін в акаунт, але краще зробити (дозволяє зберігати бекапи і інші плюшки).
- Вибираємо розширені налаштування. Вбиваємо базові настройки сайту (ніша, ім’я, тощо).
- Налаштовуємо що буде потрапляти в авто-генерений сайтмап. Я не додаю категорії, бо їх не юзаю. Юзаєте – додавайте.
- Можна налаштувати, щоб порожні категорії і теги відразу були в noindex – на ваш розсуд. Я юзаю
- Налаштовуємо вбудований захист від дурня – якщо на вашому affiliate проекту будуть працювати редактора / контентери – можна відразу заборонити їм ламати мету та інші SEO-Налаштування.
- Врубаємо дві прикольні настройки:
- Монітор 404 помилок – буде показувати звіт якщо трафік йде на 404
- Менеджер редиректів – зручна штука, щоб не писати регулярки в HTACCESS – стане в нагоді
- Залежно від типу вашого контенту – налаштовуємо пре-сети мікро-розмітки Schema. Я юзаю для Review-кластера типу сторінок – pages, ніколи не post – тому завжди роблю там типу Article. Якщо не знаєте як точно буде виглядати контент – не партеся, залиште дефолтні настройки, як я ☻ потім можна поміняти. Але те, що мікро-розмітка є з коробки – вкрай приємно
- Мета-теги і канонікли. Важливо поки сайт закритий від індексу – Canonical не буде видно в коді
Додаткові плюшки та фічі
- В цілому у плагіна купа налаштувань і фіч – можете покопатися.
- Всі коди аналітики підключаються в 1 клік.
- Можна правити robots і htaccess прямо з інтерфейсу плагіна.
Налаштування Permalink Manager Lite
Ставимо плагін з магазину плагінів, переходимо в Налаштування.
Включаємо слеш-склеювання (чекбокс slashes redirect).
Якщо не хочете десь робити свої кастомні URL, а слідувати базовим налаштувань WP – поставте галочки у постах та сторінках.
Якщо у вас проблема з URL – наприклад неможливо виставити кастомний патерн URL в Налаштуваннях WP-натисніть кнопку Fix custom permalinks в Налаштуваннях плагіна
Налаштування Thrive
Потрібно купити доступ до фреймворку. Це не просто тема – там ще купа маркетингових пропозицій – від збору підписників, квізів і повноцінного функціоналу онлайн курсів. Купуємо suite у thrivethemes.
Качаємо плагін в особистому кабінеті і встановлюємо.
Встановлюємо плагін у WP за допомогою завантаження плагіна
Після установки плагіна з’явиться Thrive Product Manager – там логинимося в свій акк Thrive
Ставимо Thrive Architect і тему. Більше нічого для даного гайда нам не знадобиться, але інші їх продукти теж круті – погугліть.
Далі активуємо тему — > починаємо налаштовувати
Важливо не пробуйте встановити Legacy теми – вони застарілі. Все, що вам потрібно є в поточній темі – ShapeShift.
Які ще плагіни можуть стати в нагоді?
В цілому – все залежить від ваших потреб.
З корисних – WordFence для захисту від брута і WPML – для створення багатомовної версії.
Як зробити ідеальну affiliate сторінку
Юзаємо тільки Pages – оскільки 90% сторінок – це review – там можна робити все що завгодно.
Що нам потрібно для ідеальної review – сторінки?
- Title, Description, H1
- Перший екран з featured product
- Рейтинг продуктів
- Текст, картинки, списки, таблиці і ось це ось все
- Блок з автором
- Щось ще до смаку 🙂
Важливо працюючи з Thrive не можна використовувати стандартний редактор WordPress – це поламає всю верстку. Вся тема і дизайн підкоряються фреймворку Thrive.
Якщо ви натиснете Edit поста або сторінки то потрапите в режим редагування – вкрай важливо нічого не додавати в звичайному редакторі і завжди натискати “Edit with Thrive Architect”.
Отже, запилимо Review-сторінку
- Title, Description робимо через Rank Math
- Всі потрібні елементи знаходяться з права в панелі Thrive – просто як конструктор Drag and Drop перетягуємо все, що нам потрібно в контентний блок
- Все – набиваємо тими, елементами, які потрібні на Ленді
- Всі елементи адаптивні з коробки
- Кожен едлемент можна кастомізувати – натисніть на нього і опції з’являться в лівому меню – приклад як додати пункти в списки.
- Блок “Автор” додає в режимі редагування шаблону сторінки, не контенту – так само – просто перетягуєте в шаблон і на всіх сторінках, зроблених на цьому шаблоні з’явиться блок з автором
Робимо логотип самостійно без дизайнерів
Потрібне круте лого для сайту, але чортові дизайнери-фрілансери пропадають?
Знайшов рішення looka – крутий сервіс який генерить класні логотипи і віддає в потрібному форматі!
- Вибираємо індустрію
- Вибираємо стайли які нам подобається
- Кольори
- Вводимо назву сайту / бренду і слоган
- Патерни символів
- Отримуємо круті лого!
Ціна – $5!
Проблеми на сайті та шляхи їх вирішення
Боти, дивні відвідувачі, кеш.
- Скидаємо кеш в CloudFlare (Purge у вкладці Cahing)
- І в адмінці
Дзеркала не склеїлися автоматом
- Рекомендую використовувати CloudFlare Page Rules і там прописати маску редиректів.
- У CF є функціонал Page Rules
Докладний хелп з написання правил знаходиться нижче – можна зробити взагалі будь-які редиректи, нічого не програмуючи.
Базові маски для склеювання дзеркал:
WWW-склейка HTTP://*. .com / — > https:// .com
WWW-склейка HTTPS://*. .com / –>https:// .com
Що ми отримаємо в результаті?
Готовий, технічно ідеальний сайт (вся технічка працює).
Повністю підконтрольний до кожного пікселя адаптивний дизайн
Ні строчки коду
Без дизайнерів фрілансерів
Витратили менше 300 баксів
Термін запуску 2-3 дні щільної роботи
Дизайн і структура сторінок легко реюзается на інші сайти / PBN
ENJOY! Автор Олег Шестаков.
PS. Що до мене, то я Thrive не використовую і не планую, тому частину налаштувань з гайду тут не вказував. Юзаю теми та плагіни від WPShop, які майже аналогічні по функціоналу, а коштують в десятки разів дешевше (1 раз купив і забув).