Сайт, который продаёт
20 subscribers
196 photos
38 videos
2 files
330 links
Канал для владельцев интернет-магазинов. Разбираем сайты, показываем ошибки и даём простые шаги для увеличения продаж.
Download Telegram
Поиск постов с одинаковыми таксономиями (например, «продукты», у которых совпадает «brand»)

global $wpdb;

$taxonomy = 'brand';
$sql = $wpdb->prepare( "
SELECT t.term_id,
t.name,
COUNT(*) AS cnt
FROM {$wpdb->term_relationships} AS tr
JOIN {$wpdb->term_taxonomy} AS tt
ON tr.term_taxonomy_id = tt.term_taxonomy_id
JOIN {$wpdb->terms} AS t
ON tt.term_id = t.term_id
WHERE tt.taxonomy = %s
GROUP BY t.term_id
HAVING cnt > 1
ORDER BY cnt DESC
", $taxonomy );

$brands = $wpdb->get_results( $sql );

foreach ( $brands as $b ) {
echo "Бренд {$b->name} используется в {$b->cnt} продуктах<br>";
}

Зачем: быстро находите «популярные» бренды, чтобы, к примеру, добавить их в отдельный фильтр или создать слайдер «Топ‑5 брендов».

#снипеты@computy #wordpress #woocommerce #снипеты@computy
1
Как цвет кнопки влияет на конверсию?
💡 Психология цвета

🔎 Оценка с помощью А/Б‑тестов

Выберите 2–3 цвета, удерживая одинаковый текст и размер кнопки.

Подключите Google Analytics 4 + Metorik для расчета conversion rate (CR).

Проводите тест минимум 1 000 уникальных визитов на каждый вариант (статистически надёжно при 95 % дов.); фиксируйте CR и время до клика.

💡 Практические рекомендации
Контраст – #fff на #1A73E8 (синий) даёт клик‑рейти 1,3‑2,1 × выше, чем текст без фона.

Размер – минимум 44 px (мобильные) и 16 pt шрифт; плохой размер → падение CR 7 % в мобильных.

Тёмный/светлый режим – используйте CSS‑переменные: --btn-bg: var(--color-primary, #FF6200); для быстрых изменений.

Тестируйте — «нечистый» красный может вызывать “стеснительность” у пользователей старшего поколения; для них лучше «зеленый» или «голубой».

Копируйте: 1‑ступенчатый A/B‑тест → Сокра. Цел. → Масштаб.

⚡️ Финальный совет: Начните с красного (тест A) и зеленого (тест B), измерьте. Если «red» показывает +4 % CR vs «green» в +2 % — держите «red», но только после проверки контраста и мобильного виджета.

Сделайте кнопку яркой, а данные — ещё ярче! 🚀

#ликбез@computy #WooCommerce #Оптимизация #A_B_Test #ЦветКнопки #Конверсия
👍1
Идеальная корзина глазами покупателя

🔥 Чек-лист UX:

Минимум отвлекающих элементов — фокус на покупке

Кнопка оплаты — яркая и заметная

Возможность менять количество товаров на месте

Автоматический пересчет цены без перезагрузки

Чёткие варианты доставки и оплаты

💬 Маленький бонус: показывайте «Вы сэкономили ХХ ₽» — это триггерит.

Мобильная корзина
📱 70% заказов в некоторых нишах — с телефона.
Ошибки, которые убивают продажи:

Маленькие кнопки

Поля формы без автозаполнения

Нет закрепленной кнопки «Оформить заказ»

Совет: тестируйте корзину в реальных условиях с телефона, а не только в админке.

Бонусы, акции и психологические триггеры
🎯 Как продавать больше через корзину:

Счетчик бесплатной доставки: «Добавьте ещё на 500 ₽ — доставка бесплатно»

Кросс-селл: «К этому товару часто берут...»

Бонусные баллы: «За этот заказ вы получите 120 баллов»

Ограниченные акции: «До конца распродажи — 02:15:27»

#ликбез@computy #woocommerce #wordpess #корзина
🚀 СЕО за 5 шагов. Как подняться в поиске без бюджета?
Миф: для SEO нужны миллионы.
Правда: 80% работы можно сделать самому — бесплатно.

1️⃣ Разберитесь с ключевыми словами
Найдите фразы, по которым вас ищут (Yandex Wordstat, Google Keyword Planner)

Делайте акцент на низкочастотники — их проще взять в топ

Встраивайте ключи в заголовки и тексты естественно

2️⃣ Почистите сайт от мусора
Уберите битые ссылки и пустые страницы

Настройте человеческие URL (site.ru/katalog/sumki)

Проверьте скорость (PageSpeed Insights) и оптимизируйте изображения

4️⃣ Внутренняя перелинковка
Ставьте ссылки между статьями по теме

Важные страницы — ближе к главной

Используйте якорные тексты (не «читать здесь», а «как выбрать зимние шины»)

5️⃣ Получайте ссылки снаружи
Комментируйте на блогах по теме (со ссылкой на свой сайт)

Размещайте экспертные статьи на чужих ресурсах

Попробуйте обмен ссылками с партнёрами

💡 Фишка: SEO — это марафон, а не спринт. Первые результаты — через 2–3 месяца, но эффект держится годами.

3️⃣ Сделайте контент полезным и живым
Пишите статьи, которые реально отвечают на вопросы клиентов

Добавляйте фото, схемы, видео

Каждый пост — под одну тему, не мешайте всё в одну кашу
# Везде ли нужно внедрение ИИ в IT-компаниях?

Искусственный интеллект (ИИ) — один из главных трендов последних лет. Кажется, что без него уже не обойтись ни в одной сфере, особенно в IT. Но действительно ли каждой компании нужно внедрять ИИ? Давайте разберёмся.

## Где ИИ действительно полезен?
1. Автоматизация рутинных задач
- Чат-боты для поддержки клиентов.
- Обработка больших данных (анализ логов, предсказание сбоев).
- Генерация кода (GitHub Copilot, ChatGPT).

2. Улучшение продуктов
- Персонализация контента (рекомендации Netflix, Spotify).
- Компьютерное зрение (распознавание лиц, медицинская диагностика).
- Предсказательная аналитика (прогнозирование спроса, выявление мошенничества).

3. Оптимизация процессов
- Умный подбор кандидатов (HR-фильтрация резюме).
- Управление ИТ-инфраструктурой (предотвращение перегрузок серверов).

## Когда ИИ — лишняя трата ресурсов?
1. Нетривиальные задачи с малыми данными
- Если у вас узкоспециализированный продукт и мало данных для обучения модели, ИИ может оказаться бесполезным или даже вредным.

2. Процессы, которые проще решить классическими методами
- Не всегда нужен машинный learning там, где хватит простых алгоритмов или ручного управления.

3. Отсутствие экспертизы
- Внедрение ИИ требует компетенций. Без понимания, как работают модели, можно получить неэффективное или даже опасное решение.

4. Высокие риски ошибок
- В критически важных системах (например, медицина, финансы) ошибка ИИ может стоить дорого. Иногда человеческий контроль надёжнее.

## Вывод
ИИ — мощный инструмент, но не панацея. Внедрять его стоит там, где он даёт реальную выгоду: автоматизирует рутину, улучшает продукт или снижает затраты. Если же задача решается проще и дешевле без ИИ, возможно, он вам пока не нужен.

Главное — не гнаться за трендами, а чётко оценивать: что именно ИИ даст вашей компании?

🔹 А как вы используете ИИ в своих проектах? Делитесь в комментариях!
#мыслиВслух@computy
Более человечный ИИ
#мемы@computy
AVIF vs. WEBP: какой формат изображений лучше?
В мире веба скорость загрузки и качество картинок критически важны. Долгое время WebP был лучшим выбором для сжатия изображений без потерь, но теперь у него появился мощный конкурент — AVIF.
Разберём, чем AVIF лучше WebP и когда его стоит использовать.

1. Степень сжатия
🔹 AVIF использует алгоритм AV1 (разработанный Alliance for Open Media), который обеспечивает на 20-30% лучшее сжатие, чем WebP.
🔹 WebP тоже хорош, но уступает AVIF в эффективности, особенно для сложных изображений с градиентами и текстурами.

Пример:

Файл PNG: 500 КБ

WebP: 150 КБ

AVIF: 100 КБ

👉 Вывод: AVIF экономит больше трафика без потери качества.

2. Поддержка прозрачности (альфа-канал)
🔹 AVIF поддерживает глубокую прозрачность (включая плавные переходы), как PNG.
🔹 WebP тоже умеет прозрачность, но иногда даёт артефакты на границах.
👉 Вывод: AVIF лучше для сложных полупрозрачных изображений.
3. Глубина цвета и HDR
🔹 AVIF поддерживает 10- и 12-битный цвет, а также HDR (High Dynamic Range).
🔹 WebP ограничен 8-битным цветом и не поддерживает HDR.
👉 Вывод: AVIF — отличный выбор для фотографий высокого качества и HDR-контента.

4. Анимация
🔹 AVIF поддерживает анимированные изображения (как GIF), но с лучшим сжатием.
🔹 WebP тоже умеет анимацию, но AVIF эффективнее.

👉 Вывод: AVIF выигрывает по качеству и размеру анимированных файлов.

5. Поддержка браузерами
🔹 WebP поддерживается всеми современными браузерами (Chrome, Firefox, Safari, Edge).
🔹 AVIF работает в Chrome, Firefox, Opera и Edge, но в Safari появился только в 2023 году.

👉 Вывод: WebP пока более универсален, но AVIF быстро набирает популярность.

Когда использовать AVIF?
Сайты с высококачественными изображениями (фотогалереи, портфолио).
HDR-контент и широкий цветовой охват.
Анимированные изображения вместо GIF.
Когда важна максимальная экономия трафика.

Когда лучше WebP?
Если нужна максимальная совместимость (например, для старых устройств).
Для простых изображений, где разница в сжатии не критична.

А вы уже пробовали AVIF? Делитесь в комментариях! 🚀
#ликбез@computy #AVIF #WebP #Оптимизация #ВебРазработка
Зачем нужны пакеты в PHP?

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

1. Что такое пакет в PHP?
Пакет — это готовый набор кода (классы, функции, компоненты), который можно подключить к проекту и использовать без написания всего с нуля.

Примеры популярных пакетов:

Guzzle — HTTP-клиент для работы с API.

Laravel Framework — фреймворк для веб-разработки.

PHPUnit — библиотека для тестирования кода.

Monolog — система логирования.

2. Зачем использовать пакеты?
Экономия времени
Вместо того чтобы писать код для стандартных задач (отправка HTTP-запросов, работа с БД, валидация данных), можно взять готовое проверенное решение.

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

Лёгкость поддержки
Если проект использует стандартные пакеты, новым разработчикам проще в него вникнуть.

Автоматическое обновление
Системы управления зависимостями (Composer) позволяют легко обновлять пакеты и следить за их совместимостью.

Повторное использование кода
Один пакет можно использовать в нескольких проектах без копирования кода.

3. Как работают пакеты в PHP?
Основной инструмент для работы с пакетами — Composer (менеджер зависимостей PHP).

Как это выглядит на практике?
В файле composer.json указываются нужные пакеты.

{
"require": {
"guzzlehttp/guzzle": "^7.0"
}
}

Composer скачивает пакет и его зависимости.
composer install

Пакет подключается в проект через автозагрузку (autoload).

require 'vendor/autoload.php';
$client = new GuzzleHttp\Client();

4. Где брать пакеты?
Основной репозиторий PHP-пакетов — Packagist.

5. Когда не стоит использовать пакеты?
Очень специфичная логика — если задача уникальна, проще написать своё решение.
Мини-проекты — если проект маленький, добавление лишних зависимостей может усложнить его.
Устаревшие/неподдерживаемые пакеты — лучше выбирать популярные и актуальные библиотеки.

Вывод
Пакеты в PHP — это мощный инструмент для ускорения разработки, повышения качества кода и снижения количества ошибок. Composer + Packagist — стандартный способ работы с ними в современном PHP.

🔥 Совет: Изучите популярные пакеты в своей области (веб, API, базы данных, тестирование) — это сделает вашу разработку эффективнее!

#ликбез@computy #PHP #Composer #Packagist #ВебРазработка
👍1
Что значит "написано в декларативном стиле"?

В программировании и разработке ПО часто встречаются термины "декларативный" и "императивный" стили написания кода. Они описывают два разных подхода к решению задач.

1. Декларативный стиль (Declarative)
Декларативный код описывает "что нужно сделать", но не расписывает "как именно".
→ Акцент на результат, а не на процесс.
→ Часто используется в SQL, функциональном программировании, шаблонизаторах, конфигурационных файлах.

Примеры декларативного кода:
SQL (запрос к базе данных)
SELECT name, email FROM users WHERE age > 18;

→ Мы не указываем, как именно база данных должна искать записи (перебором, индексами и т. д.), а просто говорим, что хотим получить.

HTML (разметка страницы)
<h1>Привет, мир!</h1>

→ Браузер сам решает, как отобразить заголовок, нам нужно только объявить структуру.

React (фронтенд-разработка)
const UserList = ({ users }) => (
<ul>
{users.map(user => <li key={user.id}>{user.name}</li>)}
</ul>
);

→ Мы не управляем DOM вручную, а просто описываем, как должен выглядеть интерфейс.

2. Императивный стиль (Imperative)
Императивный код описывает "как сделать", шаг за шагом.
→ Акцент на процесс выполнения.
→ Характерен для классического процедурного и ООП-подходов.

Пример императивного кода (JavaScript):
const numbers = [1, 2, 3, 4];
const evenNumbers = [];

for (let i = 0; i < numbers.length; i++) {
if (numbers[i] % 2 === 0) {
evenNumbers.push(numbers[i]);
}
}

→ Здесь мы вручную перебираем массив, проверяем условие и добавляем элементы в новый массив.

Тот же пример в декларативном стиле:
const evenNumbers = numbers.filter(num => num % 2 === 0);

→ Мы просто говорим: "Оставь только чётные числа", не описывая процесс перебора.

3. Плюсы и минусы декларативного подхода
Преимущества:
✔️ Короче и читабельнее – меньше кода, проще понять логику.
✔️ Меньше ошибок – не нужно управлять состоянием вручную.
✔️ Лучше для параллельных вычислений – например, в React или SQL.

Недостатки:
✖️ Иногда менее гибкий – если нужно тонко управлять процессом, императивный стиль удобнее.
✖️ Может быть медленнее – если "под капотом" происходят неоптимальные операции.

4. Где используется декларативный стиль?
SQL (запросы к базам данных)

HTML/CSS (описание структуры и стилей)

Функциональное программирование (Haskell, Elixir)

Фреймворки (React, Vue, Angular – декларативный рендеринг)

Конфигурационные файлы (Docker, Terraform, Ansible)

Вывод
Декларативный стиль – это описание "что нужно", а императивный – "как сделать".

Если хотите писать чистый, лаконичный код, выбирайте декларативный подход.

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

Современные языки (например, JavaScript) позволяют комбинировать оба подхода.

Какой стиль вам ближе? 🚀

#ликбез@computy
Как сделать всплывающее окно об использовании cookies с сохранением выбора в cookie?

1. HTML-разметка

<div id="cookie-banner" class="cookie-ban
<p>Мы используем cookie для улучшения работы сайта. Вы согласны?</p>
<button id="accept-cookie">Принять</button>
<button id="decline-cookie">Отклонить</button>
<a href="/privacy-policy" target="_blank">Политика конфиденциальности</a>
</div>

2. CSS для стилизации

 .cookie-banner {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background: #2c3e50;
color: #fff;
padding: 15px;
text-align: center;
z-index: 9999;
display: none; /* Сначала скрыто */
box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
}

.cookie-banner p {
margin: 0 0 10px 0;
}

.cookie-banner button {
margin: 0 5px;
padding: 5px 15px;
border: none;
border-radius: 3px;
cursor: pointer;
}

#accept-cookie {
background: #27ae60;
color: white;
}

#decline-cookie {
background: #e74c3c;
color: white;
}

.cookie-banner a {
color: #3498db;
text-decoration: none;
margin-left: 10px;
}

3. JavaScript (сохранение в Cookies)


 document.addEventListener('DOMContentLoaded',
const cookieBanner = document.getElementById('cookie-banner');
const acceptBtn = document.getElementById('accept-cookie');
const declineBtn = document.getElementById('decline-cookie');

// Функция для установки cookie
function setCookie(name, value, days) {
const date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
const expires = "expires=" + date.toUTCString();
document.cookie = name + "=" + value + ";" + expires + ";path=/";
}

// Функция для получения cookie
function getCookie(name) {
const cookieName = name + "=";
const decodedCookie = decodeURIComponent(document.cookie);
const cookies = decodedCookie.split(';');
for (let i = 0; i < cookies.length; i++) {
let cookie = cookies[i];
while (cookie.charAt(0) === ' ') {
cookie = cookie.substring(1);
}
if (cookie.indexOf(cookieName) === 0) {
return cookie.substring(cookieName.length, cookie.length);
}
}
return "";
}

// Проверяем, есть ли уже cookie
if (!getCookie('cookie_consent')) {
cookieBanner.style.display = 'block';
}

// Обработка согласия
acceptBtn.addEventListener('click', function() {
setCookie('cookie_consent', 'accepted', 30); // Сохраняем на 30 дней
cookieBanner.style.display = 'none';
// Здесь можно загружать аналитику (Google Analytics и т. д.)
console.log('Cookie приняты');
});

// Обработка отказа
declineBtn.addEventListener('click', function() {
setCookie('cookie_consent', 'declined', 30); // Сохраняем на 30 дней
cookieBanner.style.display = 'none';
// Блокируем cookie (например, отключаем Google Analytics)
console.log('Cookie отклонены');
});
});

🔹 Как это работает?
При первом посещении – показывается баннер.
После выбора – в cookie записывается cookie_consent=accepted или declined.
При повторном посещении – если cookie есть, баннер не показывается.

🔹 Важные моменты
Срок хранения – в примере cookie хранится 30 дней (можно изменить).
GDPR-совместимость – добавьте ссылку на политику конфиденциальности.
Аналитика – подключайте Google Analytics только после согласия.

🔹 Проверка cookie
Чтобы убедиться, что cookie сохраняются, откройте Инструменты разработчика (F12) → Application → Cookies и проверьте значение cookie_consent.

#снипеты@computy

#GDPR #Cookie #JavaScript #ВебРазработка #Frontend
👍2
ИИ-агенты — это автономные интеллектуальные системы, которые могут взаимодействовать с внешней средой, принимать решения и предпринимать действия без вмешательства человека.

Агент — один ИИ, который полностью берет на себя задачу. Например, добавить темный режим: один агент пишет код, тестирует, открывает PR.

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

Мультиагенты — несколько равноправных агентов с разными задачами и взглядами (например, разработчик и UX-специалист), которые взаимодействуют и договариваются.
Когда использовать:

Агент — простые задачи,
Субагенты — сложные, делящиеся на части,
Мультиагенты — когда нужны разные экспертизы и мнение.

В итоге — три способа работы с ИИ, как одиночка, руководитель команды или равноправные коллеги.

#ликбез@computy #ИИагенты