Задача такая, слева размещена картинка, а справа блок, внутри которого какой-то контент или другие блоки. Нужно сделать так, чтобы картинка была такой же высоты как...

Задача – выводить в десктопной версии несколько слайдов с определенным дизайном, а в мобильной версии выводить больше слайдов с другим дизайном. Нашел одно решение –...

Простой пример, как можно задать для текста фоновое изображение с помощью CSS-свойства background-clip. HTML – проще некуда: CSS – максимально упрощенный, чтобы было понятно, что...

Уже давно не давал мне покоя вопрос в чем разница между функциями _e() и esc_html_e… Но я везде использовал _e() и не парился, пока не...

Простая функция, которая позволяет не отображать в виджете Recent Posts Widget текущую запись, которая открыта в данный момент, например, если вы открыли последнюю запись в...

CSS генератор треугольников, иногда приходится применять, чтобы создать уголки для каких-то элементов с помощью CSS. Простой пример, нескольких треугольников И очень крутой пример, как же...

В общем, очередная секретная разработка для ускорения процесса создания сайтов.  Обычно для верстки я использовал десктопный препроцессор Prepros, но появилась необходимость работать независимо от сторонних...

Мой репозиторий – https://github.com/DenisShapkun/images-optimization. Используем вместо Tinypng десктопный вариант Gulp. Пакетная оптимизация изображений формата PNG, JPEG, GIF, SVG. PNG без альфа-канала (без прозрачности) лучше сначала...

Столкнулся с такой задачей, что нужно было импортировать базу через консоль по SSH, хотя обычно я это делаю стандартным способом через PhpMyAdmin. В общем ничего...

Если по дизайну для текста нужна тень то обычно мы используем CSS-свойство text-shadow в таком формате: И получаем такую простую тень: Темная тень на светлом...

Задача – добавить на сайт всплывающие подсказки, но без подключения дополнительных библиотек, потому как их и так подключено много (но ни в одной нет tooltips)....

Когда-то давно была задача продвинуть несколько страниц небольшого сайта, который я же когда-то и делал, в поисковиках с ограниченным бюджетом. Главным плюсом было то, что...

В общем, background-position – очень простое свойство в CSS используемое, чтобы указать позицию фонового изображения. Есть несколько вариантов синтаксиса, чтобы указать позицию фона: Числовое значение...

Простой полезный скрипт для анимаций или какого-либо отдельного функционала Пример, как скрипт определяет направление скролинга в браузере, просто поскрольте колесом, и будет виден текст направления...

Задача такая, для IE11 и Edge задать отдельные стили для SVG, потому что в этих браузерах не поддерживаются фильтры для свг и соответственно свг-шка не...

Не буду лить воду про важность продвижения сайтов в интернете и про ссылочное продвижение, которое “должно было умереть” еще 10 лет назад по версиям различных...

Для e-commerce проектов особенно важна устойчивая работа хостинга. Плохой Uptime и медленная работа сервера негативно отражаются на прибыли проекта и SEO-показателях. Причиной смены хостинга также...

Цитата записи (excerpt) выводится внутри цикла таким кодом: По умолчанию, она обрежется длиной в 55 слов и в конце будут такие символы […], что не...

Репозиторий с оптимизатором картинок на Github – https://github.com/DenisShapkun/images-optimization. В общем, это моя секретная разработка для сжатия картинок (PNG, JPEG, GIF, SVG). Все сейчас гоняются за...

Копирование сайта с помощью Website Scraper – https://www.npmjs.com/package/website-scraper. Запускаем консоль в нужной директории и устанавливаем плагин website-scraper с помощью команды: Создаем файл scraper.js с примерно...

Суть задачи в том, чтобы сделать плавное появление и скрытие flex-контейнера. Если использовать просто fadeIn(), то блоку будет задано свойство display: block;. Можно, конечно, flex-контейнер...

Редирект с .html Задача простая – убрать из урла расширение страницы .html. Чтобы вместо было: Нужно в файл .htaccess добавить такие директивы:

Простой пример, как объединить 2 массива в один, чтобы соответствующие элементы каждого массива были помещены в отдельные объекты объединенного массива. Скрипт: Получаем такой массив с...

Простой пример, как добавить эффект свечения для svg-элемента с помощью добавления тени. Итак, у нас есть такой svg-файл с градиентом: Первым делом, кидаем файл в...

Простой пример очередной анимированной кнопки с эффектом свечения при наведении. Можно сделать свечение кнопки и без наведения, это уже дело вкуса и дизайна. HTML для...

Тема вопроса на самом деле гораздо шире. Что лучше использовать для своего сайта? Статичную верстку на HTML, популярную CMS или самописный движок? Я не буду...

Разберемся, какие видео нужно использовать на своем сайте, какие нужны форматы и какого размера видео должно быть. Разбирать будем видео для тега <video>, понятно, что...

Когда-то я уже делал небольшую статью про создание видео-фона в блоке (Делаем видео-фон для блока с помощью CSS). Но в статье было много лишнего кода...

Суть проблемы – мобильные браузеры, в частности, Safari отображают семизначные числа как ссылку на телефон. В общем-то, это было бы удобно, если бы, это был...

Для различных вариантов дизайна страниц нужно указывать разный цвет для плейсхолдеров в формах. Рассмотрим такой вариант input’а: Для изменения цвета placeholder пропишем такие правила в...