Интересные работы

Свежие записи

Создание вариативных товаров в WooCommerce (создание вариаций)

Создаем вариации для товаров в WooCommerce. 1. Во вкладке Product data выбираем Variable Product 2. В разделе Attributes создаем при необходимости новые Атрибуты, которые будут...

Выводим цену товара в WooCommerce в произвольном месте
Выводим цену товара в WooCommerce в произвольном месте

Выводим базовую цену товара в WooCommerce: Выводим цену со скидкой, а если она не менялась, тогда выводим основную цену: Выводим общую стоимость товара при изменении...

Меняем внешний вид вариаций — вместо селектов делаем радио-кнопки

Задача — сделать красивый внешний вид для вариаций товаров в WooCommerce. По умолчанию, стандартный вид вариаций — это простое выпадающее поле с селектами, а нам...

Выводим таймер обратного отсчета для продукта в WooCommerce

Задача такая — выводить для различных товаров таймер обратного отсчета, когда заканчиваются скидки или акции на данный товар. Поставленную задачу мы решим с помощью кастомного...

Получаем ссылку на запись или страницу в любой языковой версии (Polylang)

В некоторых шаблонах иногда приходится выводить статические ссылки в коде, лучше, конечно, это делать через плагин Advanced Custom Fields, но, если по каким-то причинам нужно...

Выводим дату мероприятия через ACF

В плагине ACF есть возможность вывода даты, и это — очень крутая фишка, с помощью которой можно много чего интересного сделать. Самое элементарное — это...

Как стилизовать стрелки для input[type=number]

Для начала уберем стандартные стрелки Для Chrome Для Firefox Такой примитивный код (это упрощенный код из магазина на WooCommerce) Такой примитивный Скрипт

Как изменить изображение флага в переключателе плагина polylang

Как изменить изображение флага в переключателе плагина polylang? Например, вы хотите вставить в переключатель языков свое изображение, стилизованное под ваш дизайн. В общем, нет ничего...

Получаем описание и заголовок из плагина AIOS и используем его для og-метатегов

На одном из проектов требовалось вывести Open Graph Title и Open Graph Description, что это такое, читайте здесь. Так вот эти данные должны были дублироваться...

Конвертируем SVG-иконку в код для использования в CSS

В одном из проектов возле меню выводились небольшие иконки в формате svg, и нужно, чтобы при наведении курсора на пункт меню, текст и иконка меняли...

Полезные ссылки для вебмастеров

Ссылки на ресурсы, которые я использую в своей работе. Это мои реферальные ссылки, плохого не посоветую. https://www.ukraine.com.ua/ — Отличный хостинг в Украине и в СНГ....

Как удалить круглые скобки вокруг количества постов в виджете «Рубрики»

Есть задача — удалить круглые скобки вокруг количества постов в виджете «Рубрики«. Добавьте этот код в файл functions.php и круглые скобки вокруг количества записей будут...

Вывод ссылки на следующую и предыдущую запись внутри поста

Самый простой вариант вывода ссылки на предыдущий или следующий пост на странице поста: Вариант с выводом тегов и указанием классов необходимых для верстки, а так...

Как ускорить загрузку своего сайта (советы от студии Themes Zone)

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

Простой таймер обратного отсчета на Javascript

Самый простой и удобный таймер обратного отсчета HTML CSS Javascript Рабочий пример Таймера обратного отсчета

Использование «$» вместо «jQuery» в шаблонах WordPress

В WordPress по умолчанию подключается библиотека jQuery. Поэтому не обязательно подключать дополнительные библиотеки jQuery, достаточно в файле functions.php подключить уже имеющуюся: а подключать скрипты, для...

Кнопки «Поделиться в социальных сетях» без сторонних плагинов

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

Child theme

Создаем дочернюю тему. первым делом создается папка с таким же именем как у родителя с добавлением суффикса -child, например, получится twentyfifteen-child. Обязательным является один единственный...

Форма обратной связи с прикреплением файла (Send attachments with PHP Mail())

Форма обратной связи с прикреплением файла (attach) Самый простой внешний вид формы обратной связи с тремя полями и полем для прикрепления файла: Даже добавим пару...

Простой jQuery-скрипт для табов (вкладок)

Сам скрипт целиком и полностью взят с сайта dimox.name HTML Обязательные CSS-стили для вышеуказанного HTML-кода Для красивого отображения на сайте нужно использовать свои стили. Подключаем...

Какой размер для фавиконок использовать?

Чтобы далеко не ходить, сразу укажу, что остановился я на трех таких размерах для фавиконок, которые подходят всем браузерам и всем экранам: Для сайта на...

Форма HubsPot отображается в неправильном месте

Быстрая заметка о проблеме, которая иногда встречается с форматами HubSpot, неправильно отображающимися на сайтах. Это происходит не всегда, но иногда формы HubSpot (при использовании стандартного...

Фиксированное меню при прокрутке страницы только для мобильных

Немного другая вариация фиксированного меню. Меню фиксируется к верхней части экрана только на мобильных устройствах. Меню находится в середине страницы, то есть оно прилипает к...

[CSS Animation] PCPP Loading Boxes

Красивая и не слишком сложная анимация, например, для загрузочной страницы сайта. HTML CSS Готовый пример:

Вертикальные параллакс-эффекты при прокрутке страницы с помощью Stellar.js

Делаем параллакс-эффект для больших блоков с фоном и для отдельных элементов на сайте. Подключаем jQuery Библиотеку stellar.js качаем здесь, подробную документацию по stellar.js читаем здесь....

Фиксированное меню при прокрутке страницы

Один из множества примеров сделать фиксированное меню при прокрутке. HTML CSS JS Готовый пример:

Как настроить VPN в браузере Opera

В общем, из-за санкций против российских компаний возникли некоторые сложности у многих украинских компаний. Допустим, доступом к социальным сетям можно и пожертвовать, но многие не...

Открытие новых вкладок скриптом

Появилась необходимость сделать открытие дополнительной вкладки в браузере без желания на то пользователя. Технически сделать это можно, но только браузеры не разрешат открыться вкладке, если...

Gulp — подробное руководство

Источник — http://webdesign-master.ru/blog/tools/2016-03-09-gulp-beginners.html Видео: Основные ресурсы урока: Node.js: https://nodejs.org/en/ Gulp: http://gulpjs.com/ Bower: http://bower.io/ Browsersync: https://browsersync.io/ Проект-пример из данного урока вы можете посмотреть на GitHub и...

Содержимое файла gulpfile.js

Содержимое файла gulpfile.js для рабочей папки app с билдом в папку dist: Содержимое файла gulpfile.js для рабочей папки app без билда: