Видалити порожні рядки в CSS стилях і збільшити швидкість веб-сайту, ІТ Блог

Головне меню » Блог-платформа wordpress » Найкращі підручники з WordPress » Видалити порожні рядки в CSS стилях та збільшити швидкість веб-сайту

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

Менше рядків у результатах вихідного коду покращує час завантаження. Ви можете використовувати безкоштовний Notepad ++ замість Dreamweaver.

Quickest Fix

За допомогою командиFind & Replace я показуватиму вам, займає менше 2 хвилин.

Порожні рядки у CSS стилях

Я великий шанувальник WordPress, але навіть у таблицях стилів є деякі порожні рядки.

За умовчанням, типова тема WordPress має єдиний простір рядка після кожної дужки, що закриває.

Я виділив ці простори на скріншоті нижче:

Це нема про що турбуватися. Є безліч сайтів на WordPress з таблицями стилів, де така ж проблема.

Але було б краще, якщо видалити прогалини і досягти трохи швидше завантаження.

Порожні рядки та нечитабельність коду

Хоча поодинокі порожні рядки між правилами CSS не є проблемою, багато і багато просторів.

Декілька порожніх рядків, як правило, з'являються, коли зроблені численні налаштування до CSS.

У минулому я знаю, що я зробив помилку, не закриваючи прогалини, потенційно додаючи небажаний час завантаження.

Ось скріншот того, про що я говорю:

З цією ситуацією, ви можете зіткнутися, якщо ви попросили, оновити веб-сайт на WordPress інший дизайнер / розробник.

Стає гірше

Добре, ще одна історія, перш ніж ярозповім вам, як видалити ці прикрі лінії.

На днях я завантажив свою таблицю стилів з мого сервера з наміром зробити кілька змін.

Я скопіювавstyle.css на робочий стіл за допомогою FileZilla.

Тим не менш, коли я відкрив таблицю стилів у Dreamweaver я зіткнувся з цим жахом:

Ага. Додатковий порожній рядок був вставлений між кожною лінією. Таблиця стилів тепер вдвічі довша!

2582 рядків коду стали 5164 рядків коду!

Усі білі простори нагадували мені про невдалу гру Tetris -).

Як це відбулося?

Зрештою, я зрозумів, що це було пов'язано з CloudFlare.

Хоча це відмінний інструмент для кешування, безпеки та загальної швидкості веб-сайту на WordPress, ви повинні бути обережні з їх налаштуваннями CSS мініфікації.

Я не знаю, як це трапилося у вас, але я триматиму пару рішень нижче, які вирішує цю проблему.

Видалити порожні рядки з таблиці стилів у Dreamweaver

Ось те, що вам потрібно зробити:

  1. Відкрийте таблицю стилів у будь-якій версії Dreamweaver.
  2. Натисніть CTRL та F (або виберітьFind and Replace з менюEdit ).
  3. Введіть[\r\n] у полеFind (знайти).
  4. Введіть\n у полеReplace (Замінити).
  5. НатиснітьReplace All (Замінити всі).

Dreamweaver витратить 1 – 2 хвилини, автоматично видаляючи порожні рядки.

Зрештою таблиця стилів буде коротшою і швидше завантажуватися.

Збережіть його та скопіюйте назад у свій каталог веб-сайту.

Якщо перше рішення не працює, спробуйте це замість того:

  1. Введіть\r\n\r\n у полеFind (знайти).
  2. Введіть\n у полеReplace (Замінити).
  3. НатиснітьReplace All (Замінити всі).

Для отримання кількості часу, який потрібно, ви також можете використовувати тактику видалення порожніх рядків.

Це особливо важливо, якщо ви зробили багато правок та забули закрити ці прогалини. Це робить ще легшим, якщо ви працюєте з іншими веб-дизайнерами.