Якщо у вас встановлений Яндекс браузер, то, мабуть, іноді хочеться змінити його зовнішній вигляд. Таких функцій у ньому немає, але можна трохи подумати і скористатися стороннім сервісом. І так, у сьогоднішній статті давайте розбиратимемося, як змінити тему оформлення в браузері Яндекс.
Даний веб-браузер досить часто оновлюється, і, можливо, деякі пункти трохи відрізнятимуться в нових версіях, але суть залишиться та ж. Ось, наприклад, нещодавно вийшов новий інтерфейс, який не дозволяє нам встановлювати сторонні теми. Однак цей інтерфейс поки що можна вимкнути, чим зараз і займемося.
Запускаємо браузер і тиснемо на кнопку меню в правому верхньому кутку. З списку вибираємо пункт «Налаштування»:
Знаходимо рядок «Налаштування зовнішнього вигляду» та натискаємо на кнопку «Вимкнути новий інтерфейс»:
Все тепер зможемо змінювати його зовнішній вигляд. Для того, щоб скачати якусь тему, скористаємося магазином Гугла для Хрома. Можна перейти за посиланням https://chrome.google.com/webstore/category/themes , щоб потрапити відразу в потрібний розділ (заходити в цей магазин і завантажувати звідти потрібно, звісно, тільки з-під Яндекс браузера).
Знаходимо картинку, що сподобалася, і натискаємо на неї. У нас відкривається віконце з її описом, відгуками про неї та іншою інформацією. Тиснемо на кнопочку «Встановити»:
Більшість з нас багато часу проводить в Інтернеті перегляд веб-сайтів, не звертаючи уваги на оформлення свого веб-браузера.
Тим не менш, красиві теми для браузера можуть прикрасити день.
Сьогодні ми розповімо, як змінити таким чином зовнішність.
Тема Space Planet
Не знаю як ви, але я, побачивши космічні, завжди на кілька секунд завмираю, розглядаючи їх, особливо коли бачу такий кадр уперше, адже ними так важко не захоплюватися. Встановлене в цій темі фонове зображення планети незвичайного кольору з кільцями, що світяться навколо, – не є винятком.
Ви можете практично не бачити повне зображення, оскільки воно відображається лише тоді, коли ви відкриваєте нову вкладку. Частини, навпаки, ви спостерігатимете майже постійно (вкладки та панель навігації). Вони однаково красиві та мають загадковий колір індиго, який можна помітити у лівому кутку.
Тема для Google Chrome – Beautiful landscape
Ця тема має золоті акценти, які мають нагадувати користувачеві дерев'яні поверхні, а вкладки виконані в металево-зелених кольорах, які, як я вважаю, є рослинністю.
Фонове зображення в новій вкладці, на мою скромну думку, дуже величне, так що назва цієї точно не вводить в оману користувача і повністю відповідає реальності.
Тема для браузера Raindrops
Отже, перед нами тема зі справжньою фотографією, яка, до речі, виглядає досить умиротворююче на тлі нової вкладки вашого браузера. Частини тієї ж фотографії ви бачите на вкладках навігаційної панелі. Поставляється вона у різних розмірах. У Lite-версії не включена підтримка фотографії HD якості. В інших випадках єдиною відмінністю є підтримка Aero.
Як ви можете бачити на скріншоті, мій не підтримує Aero стиль, тому що я використовую як операційну систему Ubuntu.
Завантажити: Chrome.google.com
Autumn
Чи не зарано встановлювати теми пов'язані з восени? Автор цієї статті, який віддає перевагу зимовим шпалерам робочого столу цілий рік, каже – ні. Так ось, це чудово ілюстрована тема, яка містить чудовий фоновий малюнок для нових вкладок, а також заливає всю верхню частину браузера тим самим малюнком, але вже з іншим розміром.
Ця тема зафарбовує вкладки та панель навігації в різні кольори, включаючи помаранчевий, світло-блакитний, індиго та деякі інші, що створюють разом досить незвичайну, приємну комбінацію кольорів.
Якщо ви користуєтеся браузером Google Chrome і вам набрид його стандартний зовнішній вигляд, можна вийти зі становища, завантаживши та встановивши тему з сайту «Інтернет-магазин Chrome».
Як встановити тему в Google Chrome: Установки – Установки – Особисті матеріали – Отримати тему.
Можна користуватися готовими темами для Google Chrome, а можна створити тему своїми руками за допомогою онлайн-конструктора тем - Сhrome-theme creator.
Онлайн конструктор знаходиться за адресою www.themebeta.com/chrome-theme-creator-online.html
Створити тему для Google Chrome - Сhrome-theme creator
Почну, як створити тему з онлайнового конструктора – Сhrome-theme creator.
Інтерфейс конструктора і двох частин.
а). У лівій частині знаходяться налаштування майбутньої теми.
б). У правій частині відображається тема браузера Chrome під час конструювання.
Почнемо з першої вкладки ("basic" - з англ. Основний). Тут потрібно заповнити поле з назвою теми, що створюється (за бажанням). Я назвав свою тему – myStar
Друга вкладка ("Images" - з англ. зображення) призначена для завантаження деталей теми.
Увага: коли створюватимете зображення в графічному редакторі або змінюватимете готові зображення для майбутньої теми, врахуйте роздільну здатність монітора.
Навівши курсор на розділи у вкладці «Images», з'явиться виділена червоним кольором підказка, яка показує, яку частину в темі ви мінятимете.
Давайте завантажимо фонові картинки для нашої теми натисканням кнопки Choose Image, а палітрою поміняємо колір. Ось що в мене вийшло.
У третій вкладці ("Colors" - з англ. кольору) підбираємо кольори для рамок, тексту і т.д. У третій вкладці «Colors» також є підказки при наведенні курсору на розділи. Дивимося, що в мене вийшло.
Вкладка («Pack» - з англ. упаковувати) – це завершальний етап створення теми для Google Chrome.
"Pack and install theme" - упаковати та встановити тему.
"Pack and download theme" - запакувати та завантажити тему з розширенням. crx. Щоб встановити тему, перетягніть файл .crx у вікно браузера Chrome і все. Чи не так, швидке встановлення теми на Google Chrome?
"Pack and download zip file"- упакувати та завантажити створену тему у вигляді zip-архіву. Zip – архів теми можна розмістити в інтернет-магазині Chrome для загального користування.
От і все!!! за допомогою онлайн конструктора - Сhrome-theme creator ми з'ясували.
Настає час і звичний набридає, хочеться внести родзинку в найпопулярніший браузер і такою «унікальною фішкою» у Chrome може стати «тема», і не завантажена з офіційного інтернет магазину, а власна, ні на кого не схожа.
Як ви вже могли зрозуміти, сьогодні ми розберемо питання про створення власних тем для браузера Google Chrome.
Для створення нам знадобляться:
- Найпростіший графічний редактор (підійде навіть Paint);
- Наша докладна інструкція;
- Трішки бажання.
І я не намагаюся вас обдурити, найкрутіші теми для браузера Chrome створюються за лічені хвилини, але перейдемо від слів до справи.
Існує два способи створення теми для Google Chrome:
- Написати з нуля (створивши один текстовий документ та кілька картинок);
- Використовувати спеціалізований онлайн-сервіс.
Поки ви вирішуєте, яким способом скористатися – я почну з найважчого.
Створення теми для Google Chrome з нуля
Теми, як і розширення для браузерів на движку «chromium» ґрунтуються на файлі manifest.json.
Manifest.json – текстовий документ, що зберігає в собі налаштування тем і розширень, а також назву, опис та іншу службову інформацію.
Давайте створимо на робочому столі нову папку з назвою нашої майбутньої теми, у мене вона буде називатися Do not do it!, а всередині її створимо текстовий документ — manifest.json, де manifest – назва документа, а json – його. На додаток, створіть порожню папку з назвою «images», яка міститиме всі графічні елементи нашої теми.
Наступним етапом у створенні теми буде підготовка зображень.
Ви можете використовувати вже готові картинки, завантажені з інтернету або зробити свої, я робитиму повністю унікальні зображення для подальшого заливання теми в інтернет-магазин Chrome.
Нам знадобляться зображення таких розмірів:
1. 1920x1080px (HD формат) – для використання як основний фон у браузері.
2. 30x256px – дана картинка буде використана як оформлення вікна Chrome.
3. 1100x40px – це зображення буде виступати як заставка в лівому верхньому куті браузера (не знаю навіщо окремо використовувати в цьому місці додаткову картинку – можете використовувати її для додаткової «кастомізації» теми, ).
4. 30x200px – воно буде виступати як заливка неактивних відкритих вкладок браузера.
5. 30x256px – це зображення буде використано для заливки активної відкритої вкладки та панелі закладок Chrome.
Уважно поставтеся до зображень, зокрема їх розмірів, якщо ви не знаєте, як зробити картинку саме такого розміру і форми – вивчіть одну з наших .
Ну а якщо у вас уже все готово - прямуємо далі і складаємо файл manifest.json.
Ви можете завантажити заповнений файл, підготовлений мною як зразок – або скласти його самостійно за запропонованою нижче інструкцією.
Документ, в якому буде описаний код нашої теми починається з фігурної дужки «(», слід заповнити поля:
( "name":"Do not do it!", // поле, що вказує на назву теми; "version":"1", // номер версії вашої теми (згодом, вносячи правки в теми, необхідно оновлювати версію); " description":"Can still think twice?", // короткий опис теми; "manifest_version":2, // версія маніфесту (є дві версії «маніфесту» - 1 і 2, версія 1 – для браузерів Chrome нижче 18-ї версії, 2я для браузерів 18 версії та вище, включно).
"theme":( "images":( "theme_frame": "images/theme_frame.jpeg", // зображення, що використовується в оформленні вікна браузера; "theme_toolbar": "images/theme_toolbar.jpeg", // зображення, що використовується як заливка) активної відкритої вкладки; .jpeg"), // заливання в лівому верхньому кутку.
"theme" : ( "images" : ( "theme_frame" : "images/theme_frame.jpeg" , // зображення, що використовується в оформленні вікна браузера; "theme_toolbar" : "images/theme_toolbar.jpeg" , // зображення, що використовується як заливка активної відкритої вкладки; "theme_tab_background" : "images/theme_tab_background.jpeg", // Заливання неактивних відкритих вкладок; "theme_ntp_background" : "images/theme_ntp_background.jpeg", // Основне тло нашої теми; "theme_frame_overlay" : "images/theme_frame_overlay.jpeg"} , // Заливання в лівому верхньому кутку. |
У коді, на цій сторінці, використовується символ - "//", він необхідний для "коментування" коду. Безпосередньо у файлі manifest.json- Його можна видалити.
Вказавши шляхи до картинок, слід прописати кольори шрифтів та елементів інтерфейсу. У manifest.jsonвикористовуються кольори RGB – їх коди можна отримати в будь-якому онлайн конвертері.
"colors":( "frame":, // Заповнює вказаним кольором порожній простір основного фону; "toolbar":, // Заповнює область у лівому нижньому кутку, на місці відображення «url» сайту; "tab_text":, // Колір шрифту активної відкритої вкладки;"tab_background_text":, // Колір шрифту неактивної відкритої вкладки; "bookmark_text":, // Колір шрифту закладок на панелі браузера; "ntp_text":, // Колір шрифту назв додатків;
"colors" : ( "frame": [0, 0, 0], // Заповнює зазначеним кольором порожній простір основного тла; "toolbar": [0, 0, 0], // Заповнює область в нижньому лівому кутку, на місці відображення «url» сайту; "tab_text": [255, 255, 255], // Колір шрифту активної відкритої вкладки; "tab_background_text": [167, 167, 167], // Колір шрифту відкритої неактивної вкладки; "bookmark_text": [167, 167, 167], // Колір шрифту закладок на панелі браузера; "ntp_background": [0, 0, 0], // Колір заливки фону під іконками "додатків" у браузері; "ntp_text": [167, 167, 167], // Колір шрифту назв додатків; "button_background": [255, 255, 255]), // Колір кнопок «Закрити», «Згорнути», «На весь екран», у верхньому правому кутку. |
Залишилося встановити позиціонування основного зображення фону та пару додаткових налаштувань.
"tints":( "buttons": // Вказуємо відтінки використовуваних кольорів (залишіть значення вказані тут); ), "properties":( "ntp_background_alignment":"bottom", // Вказуємо щодо якого краю вікна буде розташоване основне зображення (bottom - нижній, top - верхній);
Ви робили всі дії разом зі мною? Відмінно, можна закривати файл маніфесту зі збереженням і приступати до тестування теми, попередньо завантаживши створені раніше картинки в папку «images».
Тестування теми для Chrome
Тестування – звучить надто голосно, насправді нам потрібно перевірити – чи не припустилися ми помилок у роботі.
У вас вже встановлена тема в браузері і її потрібно трохи змінити? Не проблема! Файли вже встановлених тем у Chrome зберігаються за адресою C:\Users\Ім'я_Користувача\AppData\Local\Google\Chrome\User Data\Profile 1\Extensions
Відкрийте браузер і перейдіть до "Налаштування" на вкладку "Розширення" і натисніть "Завантажити розпаковане розширення". Обов'язково слідкуйте за пунктом «Режим розробника».
У вікні виберіть папку з вашою темою для Chrome і натисніть "Ok" - в моєму випадку, це папка "Do not do it!".
Вітаю! Тема в браузері повинна була змінитися на вашу, якщо ні – значить повертайтеся до коду вище та шукайте помилки у себе у файлах, і дозволах картинок або завантажте архів з моїми файлами за посиланням – і порівняйте зі своїми.
Тепер можна насолоджуватися власною темою для Google Chrome, але в кожній бочці меду знайдеться ложка, самі знаєте чого.
При кожному відкритті браузера, у правому верхньому куті з'являтиметься вікно, що інформує вас, що одне із встановлених розширень або тем, було завантажено не з офіційного магазину. Є лише один спосіб уникнути цього – завантажити свою тему в офіційний інтернет-магазин Chrome і встановити її в браузер звідти.
Як завантажити тему в магазин Chrome
Якщо ви зважилися розлучитися з кровно заробленими грошима – пройдіть просту реєстрацію в інтернет-магазині за посиланням https://chrome.google.com/webstore/category/extensions .
Створивши красиву та унікальну тему, можна зробити встановлення платним для користувачів – таким чином ви отримаєте невеликий пасивний заробіток.
Після реєстрації та оплати облікового запису розробника, вам стане доступна можливість завантаження власних розширень і тем до магазину з невеликими обмеженнями – не більше 20 розширень для облікового запису, кількість тем – не обмежена.
Перш за все, запакуйте файли теми в і завантажте його в магазин Chrome, як показано на скріншоті.
Якщо не було помилок, на головній сторінці панелі розробника з'явиться інформація про вашу тему з посиланням на сторінку налаштувань, де ви зміните опис, додайте іконку та опублікуєте тему.
Я не описуватиму всі поля доступні для заповнення — вони, отже, добре прокоментовані — у разі появи проблем напишіть коментар під постом і я постараюся вам допомогти.
Створення теми для Chrome за допомогою онлайн-сервісу
У першій частині статті я описав «складний» метод створення тем для браузера Google Chrome, зараз перейдемо до простішого, що не потребує копатися в коді і створювати безліч додаткових зображень. Все що вам знадобиться - зайти на сайт - www.themebeta.com/chrome-theme-creator-online.html із заздалегідь підготовленим тлом великого розміру.
Браузери на платформі Chromium не підтримують анімованих тем, на відміну від Opera.
Потрапивши на сервіс, до речі, що ніяким чином офіційно не належать до корпорації Google, ви побачите робочу область, де зліва розташовані інструменти з коментарями (на англ. мові), праворуч – візуалізоване вікно браузера Chrome, в якому відображатимуться всі внесені зміни, а внизу розміщуються кнопки позиціонування вашого зображення щодо вікна браузера.
Введіть назву теми та завантажте зображення фону. Відразу – зробіть налаштування позиціонування або залиште їх за замовчуванням.
На вкладці «colors» можна встановити кольори шрифтів, що використовуються в різних місцях браузера. Наведіть курсор на будь-який із запропонованих варіантів зліва і місце зміни буде підсвічене червоним у візуалізованому вікні. Вам залишається лише попрацювати з палітрою кольорів, щоб підібрати потрібні.
Не завантажуючи безліч додаткових зображень, розглянутих вище, вікно вашого браузера відображатиме встановлену колірну схему Windows, тобто. для повної «кастомізації» теми – необхідно завантажити всі запропоновані зображення у вкладці «images», відповідно до розмірів, озвучених у першій частині статті.
Перейшовши на вкладку «Pack», вам буде запропоновано на вибір три дії:
- Встановити тему в браузер (згадайте про недолік з вікном при відкритті браузера).
- Упакувати тему у файл формату crxі завантажити його на комп'ютер (цей файл є інсталяційним для тем і розширень у браузері Chrome).
- Завантажити «вихідники» теми у zip архіві (ви зможете одразу завантажити готову тему в інтернет магазин).
Зазначу, що при використанні даного сервісу ваша тема буде поміщена в каталог і стане доступною для скачування та встановлення іншими користувачами.
Якщо буде цікаво, у наступних постах я опишу процес створення анімованих тем для браузера Opera.
Здрастуйте, шановні читачі блогу сайт. Відносно стрімко завойовує серця користувачів у всьому світі. Я теж не виявився винятком із правил і вже близько року працюю з блогом виключно у ньому.
Приваблює мене його абсолютна надійність (взагалі ніяких нарікань з цього приводу немає за період часу), хороша швидкість роботи і досить багатий функціонал, який Хром може отримати за рахунок наявних для нього розширень.
Але надійність і швидкість роботи Мазили сильно падали із встановленням кожного нового плагіна, чого не можна сказати про Google Chrome, який вміє створювати для кожного активного доповнення окремий процес на вашому комп'ютері (це сильно підвищує швидкість роботи та загальну стійкість браузера). Ну, а сьогодні я хочу поговорити про ті з них, які можуть бути корисні не лише вебмайстру, а й пересічному користувачеві глобальної мережі Інтернет.
Розширення Google Хрому загального призначення
- Firebug Lite - аналог надпопулярного плагіна. У Хромі вже інтегрований подібний функціонал (з контекстного меню правої кнопки миші вибрати «Перегляд коду елемента»), проте таке розширення має місце. Мені особисто не подобається його робота і тому я користуюсь варіантом для Мазили, але «на смак і колір усі фломастери різні».
Крім цього, у ColorZilla є досить багаті можливості і навіть свої власні налаштування, але про це ви вже дізнаєтеся за допомогою свого допитливого розуму. Скажу лише, що за допомогою цього плагіна для Google Хром ви зможете переглянути всю палітру кольорів, що використовується на веб-сторінці, отримати код градієнтних кольорів для вставки на свій сайт за допомогою власного генератора, переглядати історію захоплень і використовувати різні палітри для підбору потрібного відтінку.
А, по-друге, в силу вкрай малого поширення тулбара Алекси в рунеті, встановивши цей плагін в той браузер, де працюєте з сайтом, ви зможете злегка підкоригувати цей показник на краще для себе. Більш детальний опис цього дійства ви знайдете в наведеній вище статті.
Статистика сайтів від LiveInternet.ru - диво-розширення для Хрома, яке дозволяє побачити відвідуваність сайту за версією, навіть якщо його власник закрив статистику паролем:
Якщо такого лічильника на сайті взагалі не встановлено, то ви все одно зможете оцінити відвідуваність за займаним ресурсом місцем серед доменів другого рівня в рунеті (схоже, що дані беруться з Олекси) або за охопленням аудиторії (відсоток від загального трафіку рунету), а також зрозуміти відсоткове співвідношення ядра аудиторії (постійних відвідувачів), частку пошукового трафіку та співвідношення чоловічої та жіночої статі серед відвідувачів.
Крім цього, за допомогою кнопки SEO ви зможете потрапити на сторінку Інструменти LiveInternet.ru. Пройшовши просту реєстрацію ви отримаєте доступ по ряду сервісів, які допоможуть вам, наприклад, вибрати оптимальний розмір текстів і кількість входження ключових слів для попадання в ТОП пошукової видачі за пошуковим запитом, що вас цікавить (ми якраз про це говорили в недавній статті по ):
Там же буде можливість провести аналіз сайту, що цікавить вас, перевірити позиції потрібних пошукових запитів у видачі (аля, ), а ще .
SEO Site Tools – буржуйський сео плагін для Chrome, який відображає на своїй кнопці значення відкритої у браузері сторінки. Якщо поруч розташувати згаданий вище RDS-бар, то вийде наочний огляд пузомірок сторінок, що відкриваються в браузері:
Крім цього, при натисканні на його іконці, ви можете отримати масу статистичних даних, що стосуються просування. Серед них буде також кількість додавань відкритої в браузері сторінки та інші популярні в буржунеті соцмережі та соцзакладки.
SEO Quake — популярний додаток для багатьох браузерів, який дозволяє виводити вгорі всіх веб-сторінок, що відкриваються в Хромі, панель з різними показниками просування. Дуже зручний під час перегляду потенційних сайтів донорів. Аналогічну панель цей плагін вміє виводити і в пошуковій видачі:
Налаштувань у плагіна SEO Quake дуже багато, так що розбиратися доведеться довго, але воно того варте.
Хромом я теж активно користуюсь на своєму планшеті, але він, на жаль, не підтримує доповнень, а дуже цього хотілося б. Сподіваюся, що розробники з часом виправлять це неприємне непорозуміння.
Теми для Google Chrome
Можливість зміни тем у Google Хромі інтегрована за умовчанням, втім, як і у всіх інших популярних браузерах. Щоб змінити або відновити тему за промовчанням, вам доведеться зайти в налаштування, клацнувши по іконці гайкового ключа в правому верхньому куті, а потім вибравши пункт «Налаштування». На сторінці, що відкрилася, знову ж таки виберіть однойменну вкладку, а вже там шукайте розділ «Зовнішній вигляд»:
Перейдіть по кнопці " Вибрати темуі спробуйте оглянути все різноманіття краси, що є там. Встановлюються теми так само, як і розширення
Якщо завантажена тема вам не сподобалася, то сміливо можете продовжувати пошук, ну а при повному розчаруванні в ній ніхто не заважає вам повернутися до теми, яка використовується в Google Chrome за умовчанням (відповідна кнопка на попередньому скріншоті).
Удачі вам! До швидких зустрічей на сторінках блогу сайт
Вам може бути цікаво
Rds Bar та Page Promoter бар на допомогу вебмайстру 
Візуальні закладки Яндекса для Mozilla Firefox, Google Chrome - як встановити та настроїти вкладки в популярних браузерах 
Chromium - що це за браузер, як Хроміум пов'язаний з Google Хромом і які ще браузери працюють на його основі 
Яндекс Браузер - розширення та теми підходять від Хрома, а функціонал його навіть перевершує 
Яндекс Елементи - завантажити та встановити бар у Firefox, Internet Explorer, Opera та Chrome 
SEObar - зручний та інформативний SEO плагін для Опери 
Mozilla Firefox - завантажити, встановити і налаштувати найрозширюваніший з браузерів під назвою Мазіла Фаєрфокс 
Закладки в браузері Яндекса, Гугл Хром і Фаєрфорс, а також віртуальні онлайн-закладки