Як створити власну тему Google Chrome

Ви коли-небудь хотіли налаштувати зовнішній вигляд свого веб-браузера? Для цього можна використовувати теми для Google Chrome. Магазин тем Chrome може мати величезний вибір варіантів, від космічних тем до автомобілів і красивих пейзажів, але що робити, якщо жоден з цих варіантів не відповідає вашим потребам, або якщо ви хочете налаштувати Chrome, щоб мати одну зі своїх фотографій як замість фону? Ну, на щастя, ви можете зробити саме це.

Існує два способи створення власної теми. Chrome має просту вбудовану функцію, яка дозволяє імпортувати фонове зображення для сторінки нової вкладки та налаштовувати колірну схему інтерфейсу користувача з ряду попередніх налаштувань. Якщо вбудована функція Chrome не має потрібної кількості параметрів налаштування, веб-сайт під назвою ThemeBeta пропонує вам багато функцій, але простий у використанні конструктор теми Chrome (хоча процес встановлення невеликий складніше). У цій статті ми розповімо вам, як створити власну тему Chrome за допомогою обох інструментів.

Простий вбудований інструмент Chrome

Щоб скористатися вбудованим редактором тем Chrome, відкрийте нову вкладку. У нижньому правому куті сторінки нової вкладки є значок олівця. Натисніть на нього, щоб налаштувати зовнішній вигляд Chrome.

Натисніть значок олівця, щоб відкрити редактор теми.

У спливаючому вікні, що з’являється після натискання значка олівця, ваш перший варіант – налаштувати фонове зображення. Тут ви можете вибрати між дуже обмеженою кількістю попередньо встановлених параметрів або завантажити власне зображення. Це фонове зображення застосовуватиметься лише до сторінки нової вкладки, воно не стане фоном на жодних реальних веб-сайтах.

Виберіть фонове зображення для сторінки нової вкладки.

Вибравши фонове зображення, перейдіть на вкладку «Колір і тема». Тут ви можете вибрати з набору колірних поєднань. Ці параметри кольору впливають на кольори вкладки та панелей пошуку та закладок, які утворюють інтерфейс користувача Chrome. Іншими словами, на більшості сайтів, які ви відвідуєте, ці кольори будуть помітнішими, ніж ваше фонове зображення, тільки тому, що верхній рядок браузера завжди буде цього кольору!

Виберіть попередньо встановлену колірну схему.

Якщо жодна із попередньо встановлених колірних схем не відповідає вашим потребам, колір у верхній лівій частині дає змогу вибрати власну колірну схему з повним спектром кольорів на вибір. Щоб вибрати колір, спочатку клацніть символ у верхньому лівому куті, а потім скористайтеся спливаючою кнопкою, що з’явиться, щоб вибрати свій колір. Налаштуйте перехрестя в колірному спектрі, щоб отримати свій відтінок, і чорну стрілку праворуч від вікна, щоб вибрати яскравість тону. Якщо ви не впевнені, як це працює – чим далі вгору або вниз ви рухаєте чорну стрілку, тим світлішим або темнішим стає ваш колір. Для більш інтенсивних відтінків встановіть перехрестя вгорі, а стрілку посередині. Для більш блідих кольорів перемістіть перехрестя трохи нижче, а стрілку вгору.

Вибравши потрібний колір, натисніть «Додати до спеціальних кольорів» унизу праворуч. Далі виберіть свій власний колір зі списку «Спеціальні кольори» в нижньому лівому куті, а потім натисніть «ОК», щоб застосувати. Якщо ви вибираєте власну колірну схему, ви можете вибрати лише один колір, Chrome вибере другий схожий колір, щоб завершити тему тим, що, на його думку, найкраще підходить.

Порада: Chrome майже завжди припускає, що вибраний колір є темнішим із двох кольорів теми, і вибирає світліший другий відтінок. Вибирайте відповідно!

Виберіть власну колірну схему.

Коли ви задоволені своїм фоновим зображенням і набором кольорів, натисніть «Готово», щоб зберегти власну тему, і ви готові до роботи!

Спрощені сторонні теми

Якщо вам потрібна проста тема, то вбудованого інструменту Chrome має бути достатньо, але якщо ви хочете більше індивідуальності, ThemeBeta пропонує більше контролю. Веб-сайт дозволяє вручну змінювати кольори вкладок переднього плану та фону, текст на панелях вкладок тощо.

Перш за все, вам потрібно перейти на веб-сайт ThemeBeta. Ви можете переглядати теми, надіслані користувачами, на їхній домашній сторінці , або ви можете перейти безпосередньо на сторінку їх створення теми, щоб розпочати роботу зі своєю власною. Перший крок, коли ви перебуваєте у створенні теми, — це вибрати фонове зображення. Натисніть «1. Завантажте зображення», а потім завантажте зображення зі свого жорсткого диска. Це зображення буде основою вашої теми і буде фоновим зображенням на сторінці нової вкладки.

Порада. Будь-яке зображення, яке ви завантажуєте, має бути у форматі PNG або JPG, оскільки це єдині підтримувані формати. Використовуйте онлайн-конвертер, якщо ваше зображення відрізняється.

Якщо зображення, яке ви завантажили, виглядає не зовсім правильно, можливо, воно занадто збільшене або має смуги з боків або зверху – спробуйте змінити параметри «Фонове зображення». Відповідно, вони налаштовують горизонтальне вирівнювання, вертикальне вирівнювання, якщо зображення повторюється, якщо воно замале для екрана, як зображення масштабується, щоб відповідати екрану, і ручне коригування масштабу. Перевіряйте варіанти, поки не знайдете те, що вам подобається!

Налаштуйте розташування фонового зображення.

Щойно ваше зображення буде завантажено, попередній перегляд у правій частині сторінки оновиться, щоб уявити, як буде виглядати ваша тема. Другим кроком є ​​натискання «2. Створити кольори», ця кнопка використовуватиме кольори, присутні на завантаженому вами зображенні, щоб створити смак подібних кольорів для використання в решті інтерфейсу користувача.

Якщо автоматично створена колірна схема відповідає бажаному вигляду, ви можете перейти до інструкцій із встановлення . Але якщо ви хочете вручну налаштувати кольори таких речей, як вкладки переднього плану, фонові вкладки та панель інструментів, деталі описані в розділі розширеної конфігурації нижче.

Розширена конфігурація

У верхньому лівому куті доступні дві вкладки розширених параметрів конфігурації, перша – «Зображення». Тут ви можете налаштувати фонове зображення для певних елементів. Коли ви наведете курсор миші на кожен із параметрів, він виділить елемент, який це налаштування буде змінено в попередньому перегляді, червоним кольором.

Наведіть курсор миші на параметри, щоб побачити, яку частину інтерфейсу користувача вони змінюють.

Порада: NTP означає «Сторінка нової вкладки», параметри, які починаються з цієї абревіатури, присутні лише на сторінці нової вкладки, інші видно на інших сторінках.

• «NTP Background» налаштовує основний фон, якщо ви імпортували зображення раніше, воно вже буде «Завантажено».
• «Рамка» налаштовує інтерфейс користувача, за винятком списку вкладок, панелі пошуку та панелі закладок.
• «Панель інструментів» налаштовує активну вкладку, панель закладок і область навколо панелі пошуку.
• «Фон вкладки» налаштовує колір фону для неактивних вкладок.
• «Накладання кадру» дозволяє налаштувати друге зображення, яке накладає зображення в «Рамка».
• «NTP Attribution» додає зображення в нижній лівий кут сторінки нової вкладки, як правило, для водяних знаків.

Порада: якщо ви завантажили зображення і вам не подобається, як воно виглядає, ви можете видалити його, натиснувши кнопку «X» поруч із відповідним маркером «Завантажено». Якщо завантаження зображення змінило колір фону для цього елемента, ви можете змінити його вручну або знову натиснути «Створити кольори» на вкладці «Основні», щоб скинути колірну схему.

Друга розширена вкладка називається «Кольори». Тут, як і у випадку з параметрами на попередній сторінці, поруч із якими було поле, ви можете використовувати поле, щоб відкрити засіб вибору кольору та вибрати суцільний колір для відповідних елементів. Ще раз, якщо ви наведете курсор на параметр конфігурації, він виділить уражений елемент у попередньому перегляді червоним кольором.

Клацніть поле, щоб відкрити засіб вибору кольору для відповідних елементів.

• «Панель інструментів» налаштовує колір фону мітки атрибуції ThemeBeta у нижньому лівому куті сторінки нової вкладки.
• «Текст вкладки» налаштовує колір тексту на поточній активній вкладці в списку вкладок. Він також встановлює колір тексту атрибуції ThemeBeta у нижньому лівому куті сторінки нової вкладки.
• «Фоновий текст вкладки» налаштовує колір тексту на неактивних вкладках у списку вкладок.
• «Текст закладки» налаштовує колір тексту елементів на панелі закладок.
• «NTP Text» налаштовує колір тексту або рекомендовані/звичайні посилання на сторінки в центрі сторінки.
• «NTP Link» не має жодного ефекту.
• «Кнопки керування» налаштовує колір кнопок згортання, розгортання та закриття у верхньому правому куті.
• «Кнопки» налаштовує колір кнопок «Вперед», «Назад», «Перезавантаження» та «Додому».

Після того, як ви налаштували всі додаткові параметри так, як вам потрібно, ви готові перейти до процесу встановлення.

Установка сторонньої теми

З міркувань безпеки Google тепер дозволяє встановлювати розширення та теми лише через веб-магазин Chrome. Щоб встановити власну тему, вам потрібно буде ввімкнути функцію розробника. На жаль, ця зміна означає, що проста кнопка «Упакувати та встановити» на вкладках «Основна» та «Пакетувати» більше не працює. Якщо ви спробуєте метод «Упакувати та встановити», ви отримаєте повідомлення про помилку.

Файли CRX сторонніх розробників не можна встановити в Chrome.

Щоб обійти це, перейдіть на вкладку «Упакувати» та натисніть «Упакувати та завантажити Zip-файл».

Натисніть кнопку «Упакувати та завантажити Zip-файл» на вкладці «Упакувати».

Після завантаження zip-файлу розпакуйте файли та збережіть їх на жорсткому диску. Двічі клацніть файл, який ви завантажили, і виберіть Витягнути у верхній частині програми перегляду файлів. Вам потрібно буде вибрати, куди розпакувати файли. Запам’ятайте, де ви їх зберігаєте, щоб легше завантажувати їх знову.

Порада: якщо ви перейменуєте папку, щоб вказати, що це за тема, можливо, буде легше знайти її знову в майбутньому, якщо ви коли-небудь захочете використовувати її повторно.

Витягніть файли з файлу ZIP і збережіть їх на жорсткому диску.

Наступним кроком є ​​сторінка розширень Chrome. Ви можете отримати доступ до нього, натиснувши три крапки у верхньому правому куті, у розділі «Інші інструменти», потім «Розширення», або ви можете натиснути тут .

Натисніть три крапки, а потім виберіть Інші інструменти > Розширення.

Коли ви перебуваєте в меню розширень, у верхньому правому куті сторінки є повзунок з позначкою «Режим розробника». Увімкніть його. Після ввімкнення режиму розробника у верхньому лівому куті повинні з’явитися три кнопки. Те, що вам потрібно, це «Завантажити розпакований». Натисніть «Завантажити розпакований» та імпортуйте папку, яку ви розпакували з zip-файлу раніше.

Увімкніть режим розробника, а потім натисніть «Завантажити розпакований».

Порада. Ви хочете імпортувати батьківську папку, а не папку «images», яку вона містить. Якщо ви не перейменували його раніше, він буде називатися щось на кшталт «theme1234567890»

Після імпортування теми на поточній вкладці з’явиться сповіщення, яке підтверджує, що тему встановлено, і пропонує кнопку скасування. Перш ніж закрити це сповіщення, відкрийте нову вкладку та переконайтеся, що все виглядає так, як ви хотіли.

Не ховайте сповіщення про підтвердження, поки не переконаєтеся, що ви задоволені результатом!

Якщо ваша тема вийшла не так, як ви сподівалися, натисніть «Скасувати» та спробуйте змінити шаблон ще раз. Коли ви будете задоволені результатами, не соромтеся закрити сторінку «Розширення» та продовжувати перегляд за допомогою нової блискучої спеціальної теми Chrome.