⬜️ Книги про wordpress ⬜️

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

Для удобства был создан сборник качественных книг про wordpress, которые улучшат ваши знания, а не просто потратят время.

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

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

WEB PANDA | #wordpress

⬜️ Gutenberg в комментариях wordpress 🔥 ⬜️

Blocks Everywhere — плагин от известной команды Automattic (разработчики woocommerce, wordpress и многого другого). Он внедряет блоки gutenberg в комментарии wordpress сайта.

Помимо комментариев от wordpress, он также совместим с bbPress и BuddyPress.

🔗 Посмотреть плагин 🔗

👍 Средняя оценка: 5
✨ Количество скачиваний: 10+
🎯 Последнее обновление: 1 месяц назад

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

WEB PANDA | #плагины #wordpress

⬜️ Изменение руководства ранжирования Google ⬜️

Google обновил «Руководство по системам ранжирования».
Что изменилось:
1) Удалено "Система ранжирования по удобству страниц"
2) Удалено "Ранжирование по оптимизации для мобильных устройств"
3) Удалено "Оптимизация загрузки страниц"
4) Удалено "Ранжирование по безопасности сайтов"

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

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

WEB PANDA | #seo

⬜️ Анимированный рейтинг ⬜️

Красивая анимация и внешний вид. Написано на html, css (scss) и js.

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

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

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

⬜️ Конвертер таблиц в html ⬜️

Удобный сервис, который генерирует из exel таблиц html код. Очень упрощает и ускоряет работу, если нужно перенести таблицу на сайт.

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

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

WEB PANDA | #сервисы

⬜️ Фильтры в css ⬜️

CSS filter — это свойство CSS, которое позволяет применять эффекты на изображения и другие элементы на веб-странице. С помощью CSS filter можно изменять цвет, яркость, контрастность, размытие, насыщенность, наложение градиентов и многое другое.

Синтаксис CSS filter выглядит следующим образом:

filter: <filter-function> [<filter-function>]* | none

Здесь <filter-function> представляет функцию фильтра, которая может быть применена к элементу. Несколько функций могут быть объединены через пробелы для применения нескольких эффектов фильтрации одновременно.

Например, чтобы применить размытие к картинке, можно использовать функцию blur():
img {
filter: blur(5px);
}

Другие функции фильтра CSS включают grayscale(), brightness(), contrast(), hue-rotate(), invert(), opacity(), sepia(), drop-shadow(), url(), blur(), brightness(), contrast(), grayscale(), hue-rotate(), invert(), opacity(), saturate(), sepia() и т.д.

CSS filter позволяет создавать красивые эффекты и улучшать визуальную привлекательность сайта. Однако, следует учитывать, что использование фильтров может замедлить работу страницы, особенно на мобильных устройствах.

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

WEB PANDA | #верстка

⬜️ HuggingChat — аналог ChatGPT от Hugging Face ⬜️

Компания Hugging Face выпустила HuggingChat — конкурента ChatGPT от OpenAI. Попробовать чат-бота можно по ссылке.

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

В основе HuggingChat лежит модель OpenAssistant на 30 млрд параметров. В то время как размер ChatGPT оценивают в 175 млрд параметров.


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

WEB PANDA | #сервисы

🧹 Плагин для очистки базы данных 🧹

WP-Sweep — плагин, который удаляет старые данные в базе данных от удаленных плагинов. Иногда даже после удаления плагина с сайта, он оставляет после себя много контента в базе данных. Данный плагин позволит очистить базу данных от мусора.

💬 Делайте резервную копию перед очисткой.

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

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

WEB PANDA | #плагины #wordpress #оптимизация

⬜️ Портал с AI сервисами ⬜️

Сайт с коллекцией ai сервисов, которые разделены на категории. Содержит в себе очень большой список.

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

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

WEB PANDA | #сервисы

⬜️ Грозовое небо ⬜️

Красивое грозовое небо. Сделано на css и js с использованием библиотеки three.js

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

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

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

⬜️ Использование CSS-фреймворков для ускорения разработки сайтов ⬜️

Чтобы ускорить процесс разработки сайта, многие разработчики используют различные инструменты и библиотеки. Одним из таких инструментов являются CSS-фреймворки.

CSS-фреймворк — это набор готовых CSS-стилей, которые можно использовать для оформления вашего сайта. Фреймворк содержит все базовые стили для типовых элементов интерфейса: кнопок, форм, таблиц, сеток и т.д. Это позволяет сэкономить много времени, которое ушло бы на написание собственных стилей.

Существует множество популярных CSS-фреймворков: Bootstrap, Foundation, Tailwind, Semantic UI, UIkit и другие. Они имеют схожую функциональность, но отличаются дизайном компонентов и набором доступных элементов. Выбор конкретного фреймворка зависит от предпочтений разработчика и требований к проекту.

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

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

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

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

⬜️ Изменение внешнего вида писем woocommerce ⬜️

Decorator WooCommerce Email Customizer — плагин позволяет бесплатно создавать свои шаблоны писем, которые отправляются клиенту при оформлении заказа. Есть шаблоны, чтобы упросить процесс.

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

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

WEB PANDA | #плагины #wordpress #woocommerce

⬜️ Плагин для создания полей ⬜️

Smart Custom Fields — бесплатный плагин для кастомных полей. Аналог ACF и подобных плагинов. Поддерживает 13 самых распространённых видов полей и подойдёт для решения простых задач

👍 SCM позволяет создавать повторяемые (repeater) поля, а также произвольные страницы настроек - и всё это бесплатно.

Благодаря подробной статье на wp-kama в нем можно легко разобраться и использовать в работе.

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

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

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

WEB PANDA | #плагины #wordpress

⬜️ Бесплатный фотосток Skitterphoto ⬜️

Skitterphoto — сайт с множеством хороших фотографий с бесплатной лицензией.

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

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

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

⬜️ Кнопка с интересным эффектом ⬜️

Реализована с помощью CSS и библиотеки GSAP.

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

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

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

⬜️ Создание wordpress шорткодов ⬜️

Shortcoder — плагин, который позволяет создавать собственные шорткоды для использования на сайте без знания программирования.

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

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

WEB PANDA | #плагины #wordpress

⬜️ Скорость против дизайна и функциональности. Что важнее? ⬜️

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

Скорость загрузки сайта играет очень важную роль. Если страницы сайта грузятся долго, это раздражает пользователей и негативно влияет на их впечатление о сайте и компании. Согласно исследованиям, пользователи ожидают загрузки страницы менее чем за 3 секунды, и если это время выше, то многие из них покинут сайт. Также скорость загрузки влияет на позиции сайта в поисковой выдаче.

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

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

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

WEB PANDA | #оптимизация

⬜️ Калькулятор для жидких размеров ⬜️

Жидкие размеры — это значения, которые меняются в зависимости от ширины экрана. В css они задаются через функцию clamp(). Там указывается максимальный размер, минимальный размер, максимальная ширина устройства и минимальная ширина устройства.

Например, вы задаёте, что размер будет 40px на мониторах 1600px и выше, а минимальный размер в 30px на мониторах 360px. В итоге у вас будет пропорционально меняться размер.

Такой подход позволяет адаптировать все цифровые размеры (размеры шрифтов, отступы, закругления и тд) без медиа-запросов. Но единственный минус заключается в том, что самому выписывать всё это довольно трудно. Специально для этого были созданы калькуляторы, где вы задается нужные значения, а на выходе получаете готовую функцию clamp().

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

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

WEB PANDA | #верстка