![Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя (створити) Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя](https://images-on-off.com/images/117/kaksozdatkrossvorddlyablogaveclipsecross-aece5b21.jpg)
Новорічні свята тривають, з чим всіх Вас і вітаю. Сьогодні я розповім Вам, як не тільки створити кросворд для блогу чи сайту, але і русифікувати його, зробити гарне оформлення, прибрати відповіді з коду, а також зробити клітини для букв ключового слова.
Для створення онлайн-кросворду використовується спеціальна програма під назвою Eclipse Crossword. Завантажити програму можна на офіційному сайті.
Якщо Вас цікавить створення кросвордів для книги, рекомендую почитати цю статтю.
Як створити кросворд в Eclipse Crossword
Після установки запускаємо програму. Програма пропонує нам 2 варіанти - зробити новий кросворд, або змінити раніше збережений проект кросворду.
![Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя (crossword) Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя](https://images-on-off.com/images/117/kaksozdatkrossvorddlyablogaveclipsecross-b50b8fb1.jpg)
Натискаємо кнопку Next.
У наступному вікні пропонується створити новий список слів для кросворду, або створити кросворд з раніше створеного і збереженого списку.
![Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя (eclipse crossword) Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя](https://images-on-off.com/images/117/kaksozdatkrossvorddlyablogaveclipsecross-d1cc49ed.jpg)
У третьому вікні приступаємо до створення відповідей і питань до кросворду. В поле Word вбиваємо відповідь, в поле Cue for this word вписуємо питання.
За допомогою кнопки Tools ... можна відкрити раніше створений список питань і відповідей, Add word to list додати питання і відповідь в список слів, а також видалити слово за допомогою Remove word.
![Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя (букв ключового слова) Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя](https://images-on-off.com/images/117/kaksozdatkrossvorddlyablogaveclipsecross-8ca5cfe4.jpg)
Натискаємо Next. Задаємо ім'я кросворду, і можна написати своє ім'я.
![Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя (як створити кросворд) Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя](https://images-on-off.com/images/117/kaksozdatkrossvorddlyablogaveclipsecross-0d4b2f1b.jpg)
На п'ятому кроці задаємо ширину кросворда в клітинах. Зазвичай програма сама підбирає оптимальну ширину кросворда.
![Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя (як створити кросворд) Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя](https://images-on-off.com/images/117/kaksozdatkrossvorddlyablogaveclipsecross-f9284784.jpg)
На наступному етапі програма вже згенерує готовий кросворд. Якщо цей варіант Вас не влаштує, можете натиснути на посилання «Make another puzzle like this one» і програма перегенерірует розташування слів.
![Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя (eclipse crossword) Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя](https://images-on-off.com/images/117/kaksozdatkrossvorddlyablogaveclipsecross-905dcd08.jpg)
![Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя (eclipse crossword) Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя](https://images-on-off.com/images/117/kaksozdatkrossvorddlyablogaveclipsecross-edb5b6b8.jpg)
На цьому роботу з програмою Eclipse Crossword можна завершити.
Одержаний кросворд виглядає не тільки непрезентабельно, але і містить непотрібні речі, наприклад кнопку Solve, при натисканні на яку відповідь сам собою вписується в клітини. Більш того, всі відповіді можна подивитися в вихідному коді. І ще не завадило б русифікувати кросворд - не всі ж розуміють англійську.
![Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя (кросворд) Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя](https://images-on-off.com/images/117/kaksozdatkrossvorddlyablogaveclipsecross-5f81b48c.jpg)
У коді знаходимо такі рядки:
І після них, видаливши всі, вставляємо ось цей код:
Кросворд русифікований, тепер потрібно зробити так, щоб кросворд і питання до нього раполагаться поруч. Стандартне розташування кросворду і блоку питань виглядає так:
![Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя (букв ключового слова) Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя](https://images-on-off.com/images/117/kaksozdatkrossvorddlyablogaveclipsecross-305246b2.jpg)
Для того, щоб змінити розташування елементів кросворда, знайдіть наступний рядок:
І ДОДАЙТЕ до неї ось це:
Тепер розташування елементів кросворда виглядає так:
![Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя (блогу) Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя](https://images-on-off.com/images/117/kaksozdatkrossvorddlyablogaveclipsecross-4690c49a.jpg)
Йдемо далі. Напевно Вам не сподобається те, що кросворд розташований по лівому краю веб-сторінки, а не по центру. Тому потрібно відразу після відкриваючого тега body вставити це:
Не забудьте закрити тегом div в самому кінці коду всієї веб-сторінки перед закриває тегом body.
Тепер необхідно знайти і видалити з коду відповіді до кросворду. Знаходяться вони в цьому рядку:
Рядок видаляємо цілком!
Від відповідей позбулися і тепер переходимо до останнього - оформлення клітин для букв від ключового слова. На жаль, пронумерувати їх у вигляді тексту не вийде, тому доведеться використовувати цифри у вигляді зображень. Цифри-картинки (від 1 до 9) Ви можете завантажити за посиланням.
Все готово для редизайну клітин букв ключового слова.
![Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя (crossword) Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя](https://images-on-off.com/images/117/kaksozdatkrossvorddlyablogaveclipsecross-8ab2ffeb.jpg)
Дізнаємося id клітини. В даному прикладі це c001002.
![Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя (eclipse crossword) Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя](https://images-on-off.com/images/117/kaksozdatkrossvorddlyablogaveclipsecross-03ac24fb.jpg)
![Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя (eclipse crossword) Як створити кросворд для блогу в eclipse crossword, замітки вебмастера-любителя](https://images-on-off.com/images/117/kaksozdatkrossvorddlyablogaveclipsecross-f1ae7ba0.jpg)
Таким же чином задаємо оформлення для інших клітин, вказуючи шлях до відповідних цифрам-картинкам і змінюючи колір фону.
Ви можете змінити загальне оформлення кросворду (фон, шрифт і т.д.) на свій розсуд. Як приклад подивіться, як я змінив новорічний кросворд.
Успіхів у створенні і розгадуванні онлайн-кросвордів!