😂 С наступающим Новым годом! 😄
Пусть этот год будет для вас великолепным, пусть он принесет вам множество радости и успехов.
Желаю вам здоровья, счастья и хорошего настроения!

👍 Спасибо за то, что остаетесь с нами 🥹

⬜️ Автоматическое обновление корзины ⬜️

По умолчанию в WooCommerce не встроен механизм автоматического обновления корзины при изменении количества товара.

Данный код позволяет включить этот функционал без использования плагинов.

Код сниппета в комментариях.

💥 Если статья была полезна, то буду рад, если вы поделитесь ей с друзьями разработчиками.

WEB PANDA | #wordpress #woocommerce #сниппет

👩‍💻 Как увеличить продуктивность и не выгореть при этом?

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

⬜️ Забудьте о многозадачности. Да, много проектов можно делать одновременно, но многочисленные исследования показали, что это приводит к:
— Снижению эффективности работы
— Снижению качества работы
— Увеличению риска выгорания
Лично я рекомендую брать не больше 2 задач и ни в коем случае не делать их вместе, а чередовать каждый день.

⬜️ Определите приоритеты. Все задачи нужно просто распределить на четыре группы:
1) Важные и срочные.
2) Важные и несрочные.
3) Неважные и срочные.
4) Неважные и несрочные.
Так вы увидите, с чем нужно разобраться сразу, что передать другим, а что делать вообще не обязательно.

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

⬜️ Слушайте музыку. Исследования доказывают, что музыка повышает продуктивность, креативность и настроение в целом. Если с ней вам тяжело сосредоточиться, слушайте любимых исполнителей в перерывах.

⬜️ Занимайтесь спортом. Физические нагрузки не только укрепляют здоровье, но и улучшают внимание, концентрацию и скорость работы мозга. А ещё поднимают самооценку и делают более устойчивым к стрессовым ситуациям. Это огромный плюс к продуктивности, так что делайте хотя бы зарядку.

➡️ Важно ваше мнение. Интересны ли вам такие посты на канале? Которые напрямую не связаны с веб-разработкой и созданием сайтов, но помогают работать эффективнее.
Пишите в комментариях или просто поставьте лайк.

💥 Если статья была полезна, то буду рад, если вы поделитесь ей с друзьями разработчиками.

WEB PANDA | #советы

➡️ Если вы знаете интересный плагин, тему, сервис, сниппет кода и хотите им поделиться, то можете написать о нем боту @web_panda_bot и я опубликую пост по этой теме.

✏️ Пост не будет размещен, если это уже размещалось на канале или если тема не будет подходить тематике канала.

🔗 Сайт с коллекцией изображений 🔗

Сервис с огромным количеством векторных изображений.
Интересные фишки сервиса:

⬜️ Позволяет кастомизировать изображение. Убрать объекты и фон. Изменить фон и цвет.

⬜️ Позволяет анимировать изображение. Если лень делать анимацию, то также есть кнопка "рандомная анимация", которая поможет сгенерировать красивую анимацию.

⬜️ Бесплатное скачивание в noscript и png.

🔗 Ссылка на сервис

💥 Если статья была полезна, то буду рад, если вы поделитесь ей с друзьями разработчиками.

WEB PANDA | #дизайн #сервисы

⚙ Локальная wordpress разработка ⚙

Локальная разработка — это когда хостингом сайта выступает ваш компьютер.
Основной её минус всегда был в том, что сайт доступен только с вашего ПК и его нельзя показать клиенту, пока он не перенесен на хостинг. Но эта проблема была решена с помощью LocalWp.

⭐ В чем преимущества LocalWP в отличие от других локальных серверов (OpenServer, Laragon и тд)?

⬜️ Позволяет создавать сайты в 1 клик с установленным wordpress.

⬜️ Вход в админку в 1 клик без ввода логина и пароля.

⬜️ Позволяет делать Live Links. Этот функционал добавляет вашему сайту временный домен по которому вы можете показать сайт своему клиенту или посмотреть его с телефона.

⬜️ Имеет много бесплатных крутых расширений. А именно:
— сжатие картинок при загрузке
— проверка на битые ссылки
— Xdebug + Vs Code / PhpStorm
— мгновенные изменения на странице при редактировании css без перезагрузки страницы

⬜️ Создание заготовок для сайтов. Один раз создал готовую заготовку wordpress со всеми настройками и при новом проекте её копируешь и не нужно делать одно и то же с каждым новым проектом.

Программа полностью бесплатна.

🔗 Перейти на сайт LocalWP

💥 Если статья была полезна, то буду рад, если вы поделитесь ей с друзьями разработчиками.

WEB PANDA | #сервисы #wordpress

⭐ Интересная кнопка лайка ⭐

Кнопка лайка на чистом css, js, html, которую хочется нажать. Очень хорошо подойдет для внедрения в статьи или какой-то информационный контент на сайте.

🔗 Посмотреть codepen

💥 Если статья была полезна, то буду рад, если вы поделитесь ей с друзьями разработчиками.

WEB PANDA | #codepen #верстка

⬜️ Скрытие значка распродажи woocommerce ⬜️

Код убирает вывод бейджа "распродажа" с товаров в каталоге и в карточке товара.

💥 Если статья была полезна, то буду рад, если вы поделитесь ей с друзьями разработчиками.

WEB PANDA | #wordpress #woocommerce #сниппет

⬜️ Мета-теги dns-prefetch, preconnect, prefetch, prerender, preload ⬜️

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

➡️ Кратко о каждом:
1) dns-prefetch — просит браузер в фоновом режиме получить информацию об указанном домене (узнать его IP), чтобы затем использовать её при реальных запросах к указанному домену.

2) preconnect — просит браузер в фоновом режиме создать соединение (рукопожатие, коннект) с указанным доменом для дальнейшей работы с ним.

3) prefetch — просит браузер в фоновом режиме загрузить и положить ресурс в кэш. Является необязательной инструкцией, то есть браузер может проигнорировать.

4) preload — говорит браузеру загрузить и положить ресурс в preload кэш. Обязательная инструкция в отличие от prefetch.

5) prerender — просит браузер загрузить URL-адрес и обработать его в фоновом режиме. Когда пользователь нажимает на ссылку, страница должна отобразиться моментально.


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

🔗 Посмотреть подробнее 🔗

WEB PANDA | #оптимизация #верстка

🎆 WordPress исполнилось 20 лет 🎆

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

В то время, как другие технологии зарождались, набирали популярность и умирали — wordpress только рос в популярности и развивался.

В 2022 году 43% сайтов сделано на wordpress во всем интернете. А общая доля 64%. Приложил скриншот статистики, где видно, что wordpress явный лидер.

Его прямой конкурент отстает на около 30% (сайты без cms). Интересно, что с годами такая статистика только растет.

💥 Если статья была полезна, то буду рад, если вы поделитесь ей с друзьями разработчиками.

WEB PANDA | #wordpress #новости

⬜️ Выделение текста другим цветом ⬜️

По умолчанию в браузерах выделение текста происходит синим цветом. Но цвет можно легко перекрасить под стиль сайта с помощью пару строчек css кода.

::selection {
background: #333; /* цвет для браузеров */
}
::-moz-selection {
background: #333; /* цвет для поддержки firefox */
}

💥 Если статья была полезна, то буду рад, если вы поделитесь ей с друзьями разработчиками.

WEB PANDA | #верстка

⬜️ Сервис для уникализации фотографий ⬜️

Сервис предоставляет возможность пакетно бесплатно делать картинки уникальными.

Уникальные картинки нужны для более лучшего SEO продвижения.

➡️ К сожалению фотография становится после обработки более худшего качества (так как добавляется шум и другие эффекты), поэтому подойдет не для всех страниц.
Идеален для уникализации фотографий в статье блога.

🔗 Посмотреть 🔗

💥 Если статья была полезна, то буду рад, если вы поделитесь ей с друзьями разработчиками.

WEB PANDA | #сервисы #seo #оптимизация

⬜️ Шпаргалка для свойства display:grid ⬜️

Сайт разбирает каждое свойство для grid. Полезен для ознакомления с возможностями grid, а также для освежения своих знаний.

🔗 Посмотреть 🔗

💥 Если статья была полезна, то буду рад, если вы поделитесь ей с друзьями разработчиками.

WEB PANDA | #верстка #сервисы

⬜️ Подборка креативных checkboxes. Сделано на чистом css, html ⬜️

8 видов уникальных по дизайну чекбоксов. Каждый очень креативный и красивый. В зависимости от проекта может вписаться. Например для сайта про животных хорошо подойдет 6 чекбокс, а для тематики космос 4.

🔗 Посмотреть 🔗

💥 Если статья была полезна, то буду рад, если вы поделитесь ей с друзьями разработчиками.

WEB PANDA | #верстка #codepen