Список постов в категории "Хобби"

Добавил меню

Всем привет! Вам конечно всё равно, но я добавил меню. Теперь у меня есть навигация не только по меткам, но и по рубрикам. Можно посмотреть все Путешествия или рубрику Программирование включая подрубрики C++, Python, Java и так далее. Всё добавлено вручную, никакой автоматизации.

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

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

Дайте знать, если плашка с рубрикой нужна к каждой статье. Хотя кого я спрашиваю, ходит на сайт два с половиной человека. Один из них гуглбот, а второй — это я.

UPD: В мобильной версии сайта добавил меню с помощью плагина WP Mobile Menu.

Последние новости сайта

SSL Сертификат

В связи с событиями на Украине контора Sectigo объявила санкции и перестала выпускать ssl сертификаты для .ru и .рф доменов. За выпуск оного я платил 820 рублей в год.

Благодаря сcанкциям, я перешёл на использование бесплатного сертификата от Let’s Encrypt (с помощью certbot — он есть в портах FreeBSD). Поначалу certbot капризничал и не хотел работать без AAAA DNS записи, но это вылечилось, когда я прописал www как CNAME основного домена. Так что теперь я использую сертификат от Let’s Encrypt, а конторе Sectigo вместе с Comodo могу сказать следующее:

Fuck you asshole!

Кстати, в связи с подобными запретами Минцифры РФ подсуетилось и начало выпускать отечественные SSL сертификаты через госуслуги, которые никем не признаны, доступны только юридическим лицам и принесут больше проблем, чем пользы. Досадно, что настройкой чебурнета занимаются кретины.

IPv6

Решая проблемы с certbot, неожиданно вспомнил, что хостер выдал мне сеть /64 IPv6 адресов. Я не сильно в этом разбираюсь, но судя по калькулятору, могу выдать каждому жителю планеты Земля по два миллиарда адресов в моём личном адресном пространстве. Мне много не надо, поэтому взял циферку один и теперь у моего сайта есть AAAA DNS запись и он открывается по IPv6 адресу.

A-A-Arduino Uno и базовый набор

Уже лет десять периодически слышу про Arduino и Raspberry Pi. Первое — программируемый контроллер, второе — мини-компьютер с ОС Linux.

И, если мини-компьютер мне совершенно не интересен, поскольку с компьютерами общаюсь уже лет двадцать, то контроллер очень даже интересная штука. Запах канифоли, нагретый паяльник связанный должник, припой ПОС-61 — вот это всё будоражит воображение и радует глаз. Плюс к этому контроллер Arduino программируемый на некоем подобии C++.

С детства мечтал соединить опыт программирования с железом. Последнее и единственное, что сотворил такого рода — коробка с двумя кнопками, которая подключалась к COM порту компьютера, где специальная программа отслеживала нажатия кнопок и выполняла некоторый функционал: включала немедленный автодозвон до BBS, отключала/включала модем. Славные были деньки в коммуналке, мать их.

Arduino Uno + Базовый набор

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

  • резисторы 10 кОм
  • резисторы 220 Ом
  • потенциометр (по-нашему, крутилка)
  • фоторезистор (определяет освещенность)
  • датчик температуры
  • светодиоды синие, красные и зелёные
  • светодиод RGB (может светиться любым цветом)
  • кнопочки
  • проводочки
  • макетная плата (для пробы своих задумок перед пайкой)
  • плата Arduino Uno с проводом USB для подключения к компьютеру
  • книга с экспериментами для самых маленьких (7 экспериментов), как я
  • книга с основами и экспериментами для детей постарше

Arduino Uno + Базовый набор

Плата работает с частотой 16MHz и это охренительно круто! С такой скоростью мне работать ещё не приходилось. Каких-то жалких 16 миллионов операций в секунду, оперативная память в 2048 байт, медленная работа с плавающей запятой, тормозные тригонометрические функции — это прекрасно, если вы понимаете о чём я.

Если не понимаете, то ваш мобильник, к примеру, работает с частотой около двух миллиардов операций в секунду на четырёх ядрах с поддержкой быстрой работы с плавающей запятой и оперативной памятью в 32 миллиарда байт. Даже не зная математики, можно почувствовать разницу. И вы используете эту мощь, чтобы в Инстаграм улыбальник фильтрами поправлять. Человечество стремительно тупеет.

Сама по себе плата умеет немного: принимать напряжение 5 вольт, выдавать это напряжение и, в принципе, всё. Выдавать напряжение может в цифровом виде: нет напряжения, есть напряжение и в аналоговом: выдать напряжение от нуля до пяти вольт. Читать умеет тоже в цифровом и аналоговом виде.

Цифровых разъёмов 13 штук, аналоговых 6 штук. Плюс разъёмы питания 3.3 и 5 вольт и земля GND.

Казалось бы — ерунда, а нет! На некоторых разъёмах плата умеет выдавать ШИМ сигнал. Это скачки цифрового сигнала много-много раз в секунду. Этим сигналом управляются двигатели, насколько я понял. Ещё можно динамик подключить и пиликать в него.

Энтузиасты сотворили мини-игровую консоль с экраном, называется Arduboy.

В общем, полёт фантазии не ограничен.

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

Arduino Uno, макетная плата, RGB светодиод

Пока не понял — зачем повсюду втыкать резисторы: для кнопки и светодиода, но со временем до меня дойдёт.

Зато понял, что цифровые порты без значка тильды «~» не поддерживают комманду analogWrite(), как положено.

Кстати, сразу вопрос: почему все порты не сделаны, как цифровые с поддержкой analogRead() и analogWrite()? Это сильно упростило бы работу с платой на мой непрофессиональный взгляд.

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

Программируется через USB заливкой прошивки с помощью Arduino IDE.

Прошивка содержит две функции:

  • setup() выполняется один раз при включении платы или после reset
  • loop() бесконечный цикл во время работы

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

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

Эту информацию и всё вышенаписанное я подчерпнул с канала AlexGyver, за что ему огромное спасибо! Чувак, мой тебе респект, ты молодец, я теперь твой фанат.

А ещё я потрогал резистор щупом мультиметра и обнаружил сопротивление в 220 Ом, как и ожидалось. Здорово, правда?

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

Теперь самое интересное: цены.

Свой набор Arduino Uno с двумя книжками и прочим барахлишком я купил в магазине КЕЙ за 2790 рублей. Просто потому, что хотел всё, сразу и сейчас. Отдельно плата Arduino Uno в Чип&Дип стоит 2270 рублей. У китайцев аналог этой платы стоит от 200 рублей. Оригинальная версия от создателей обойдется вам в €28. Чувствуете некоторый разброс цен?

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

Когда внезапно разбогатею (как раз после выплаты ипотеки), то планирую купить набор у создателей в районе 10-15 тысяч рублей, просто в качестве благодарности за их труд.

SEO сайта, аудит, контент, копирайтеры, реклама

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

Сегодня, в меру своих сил и возможностей, расскажу про оптимизацию своего сайта для поисковых систем. Какими сайтами для проверки пользуюсь, что подправить в functions.php вашей темы, чтобы запись нормально смотрелась при репостинге в социальных сетях типа ВКонтакте и Facebook. Заодно поделюсь плагинами для ускорения работы сайта.

Плагины для WordPress

Начну с конца — плагины для WordPress. Их у меня установлено несколько: WP Super Cache, Autoptimize, Async JavaScript и EWWW Image Optimizer.

WP Super Cache

Плагин для кеширования страниц вашего сайта. Дело в том, что каждая страница в WordPress создается динамически при любом обращении. Динамическая страница каждый раз генерируется налету и лезет в базу данных. Этот плагин сохраняет сгенерированную страницу в кеш и отдаёт пользователю простой статический html файл, что экономит ресурсы сервера.

Ссылка для скачивания и установки: WP Super Cache.

Autoptimize

Простой и удобный плагин для объединения и минификации файлов JavaScript и стилей. В каждой вашей странице используется множество JavaScript и CSS файлов — от плагинов и темы. С помощью этого плагина (в идеале) у вас подключается всего два файла: один JavaScript и один CSS.

Ссылка для скачивания и установки: Autoptimize.

Async JavaScript

Плагин для выставления флажка defer для всех JavaScript файлов. В обычном случае браузер разбирает эти файлы последовательно, по мере обнаружения их в HTML коде. С этим флажком браузер откладывает парсинг файлов и занимается этим паралельно с загрузкой страницы.

Ссылка для скачивания и установки: Async JavaScript.

EWWW Image Optimizer

Плагин пережимает картинки без потери качества. Поддерживает форматы JPEG и PNG. Есть функция создания файлов типа WEBP, который браузер незаметно отдает вместо запрашиваемых для экономии трафика. Посетитель, что любопытно, не замечает подмены даже если попробует этот файл сохранить. Как это работает — понятия не имею, скорее всего замешано какое-то колдунство.

Ссылка для скачивания и установки: EWWW Image Optimizer.

Исправления functions.php вашей темы

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

В этом файле у меня сделано добавление meta тегов для помощи поисковым системам и социальным сетям плюс небольшие вспомогательные фрагменты.

Мета-теги og:type, og: description, og:image, og:title

Добавление мета-тегов og:title, og:description, og:type, og:url, og:locale, og:image и description к посту. В качестве og:description и description берётся первые 55 слов из вашего поста. Эти теги помогают социальным сетям создавать предпросмотр страницы, если вы решите ею поделиться.

Исходный код

function b2k_og_meta() {
    if (!is_singular()) {
        return;
    }

    global $post;
    $description = esc_attr(wp_trim_words($post->post_content, 55));

    $tags = array();
    $tags['og:title'] = '<meta property="og:title" content="'.get_the_title().'"/>';
    $tags['og:description'] = '<meta property="og:description" content="'.$description.'"/>';
    $tags['og:type'] = '<meta property="og:type" content="article"/>';
    $tags['og:url'] = '<meta property="og:url" content="'.get_the_permalink().'"/>';
    $tags['og:locale'] = '<meta property="og:locale" content="'.get_locale().'"/>';
    $tags['description'] = '<meta property="description" content="'.$description.'"/>';

     $images = get_posts(array(
        'post_status'    => null,
        'post_type'      => 'attachment',
        'post_parent'    => get_the_ID(),
        'post_mime_type' => 'image',
        'order'          => 'ASC'
    ));

    if ($images) {
        foreach ($images as $img) {
            $url = wp_get_attachment_url($img->ID);
            $tags[$url] = '<meta property="og:image" content="'.$url.'"/>';
        }
    }

    echo implode("\n", $tags);
}
add_action('wp_head', 'b2k_og_meta');

Автоматический переход на страницу при поиске

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

Исходный код

function b2k_redirect_single_post() {
    if (is_search()) {
        global $wp_query;
        if ($wp_query->post_count == 1) {
            wp_redirect( get_permalink( $wp_query->posts['0']->ID ) );
            die;
        }
    }
}
add_action('template_redirect', 'b2k_redirect_single_post');

Добавление ссылок на следующую страницу и предыдущую

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

Исходный код

function b2k_rel_next_prev() {
    global $paged;

    if ( get_previous_posts_link() ) { ?>
        <link rel='prev' href='<?php echo get_pagenum_link( $paged - 1 ); ?>' /><?php
    }
    else if (is_singular()) {
        $prev_post = get_previous_post(true);
        if (!empty($prev_post)) { ?>
            <link rel='prev' href='<?php echo get_permalink($prev_post->ID); ?>' /> <?php
        }
    }

    if (get_next_posts_link()) { ?>
        <link rel='next' href='<?php echo get_pagenum_link( $paged +1 ); ?>' /><?php
    }
    else if (is_singular()) {
        $next_post = get_next_post(true);
        if (!empty($next_post)) { ?>
            <link rel='next' href='<?php echo get_permalink($next_post->ID); ?>' /> <?php
        }
    }
}
add_action('wp_head', 'b2k_rel_next_prev');

Отключение страниц автора

Яндекс.Робот гораздо глупее робота от Гугла, поэтому в первую очередь он умудрился найти страницы вида https://адрес.сайта/что-то-там/evgenii.zhirnov/. Чтобы этого больше не происходило, страницы такого типа отключаются вот этим кодом.

Исходный код

function b2k_disable_author_page() {
    if (is_author() && !is_404()) {
        global $wp_query;
        $wp_query->set_404();
        status_header(404);
        nocache_headers();
    }
}
add_action('template_redirect', 'b2k_disable_author_page');

Открывать все ссылки в новом окне

Не знаю, как вы, а я привык, чтобы все ссылки открывались в новом окне, поэтому обычно открываю их кликом средней кнопки мыши. Данный скрипт добавляет атрибут target="_blank" всем ссылкам на сайте.

Исходный код

function b2k_target_blank($content) {
    $content = preg_replace_callback(
        '/<a[^>]*href=["|\']([^"|\']*)["|\'][^>]*>([^<]*)<\/a>/i',

        function($m) {
            $url = $m[1];
            $desc = $m[2];
            return '<a href="'.$url.'" target="_blank" rel="noopener">'.$desc.'</a>';
        },
        $content);

    return $content;
}
add_filter('the_content', 'b2k_target_blank');

Полезные ссылки

CY-PR.com

Проверяет сайт целиком на предмет индексации разными поисковиками. После регистрации позволяет обновлять информацию каждые 24 часа.

Ссылка: CY-PR.com.

Reflex grid

С помощью reflex.css сделана тема на моём сайте, так что упомяну из благодарности. Это всего лишь файл стиля, который разбивает сайт на 12 виртуальных колонок. К примеру, центральная часть моей темы занимает 9 колонок на широком экране, правая часть — 3 колонки. При низком разрешении экрана, обе части занимают 12 колонок, на всю ширину экрана.

Ссылка на документацию: Reflex grid.

Постскриптум

А на сегодня всё. Если у вас есть вопросы — не стесняйтесь спрашивать в комментариях, которые я наконец-то привёл в более-менее человеческий вид после смены темы.

За семь лет ковыряния своего блога немного стал разбираться в PHP, HTML, CSS и JavaScript. На самом деле, это несложно — попробуйте и всё у вас получится.

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

Последний раз писал про моделизм, когда загрунтовал два танка из балончика серой грунтовкой Tamiya и успокоился — кисточек нет, красок нет руки из жопы. Отложил всё в сторонку и забыл.

Модель Т-34 после грунтовки

Потом в больнице собрал колёсный танк БТ от безделья:

Модель колесного танка БТ-7 в масштабе 1:35

Затем в санатории склеил ракетную установку Тополь-М:

Модель Тополь-М в масштабе 1:35

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

Долго ли, коротко ли, а красить надо начинать. У родни позаимствовал кисточек и маленьких баночек с красками от наборов «роспись картин по номерам». Затем взял твёрдой рукой танк Т-34 и всё испортил и намалевал на нём что-то несуразное.

Модель Т-34 (корпус) в масштабе 1:35

Будь художником, сказал бы: «Я так вижу» и «Художника обидеть может каждый», поставил бы этот «шедевр» на полку и забыл. Но я не художник и меня хрен обидишь. Поэтому пошёл на поклон к нашим дизайнерам-художникам и упав на колени ненавязчиво поинтересовался — как вообще красить это дело, может секрет какой есть? Для примера, они красят вот так:

Модель космодесантника

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

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

Модель Тигра и Т-34 в масштабе 1:35

Извините за качество съёмки, руки дрожали от волнения и стакана вина.

В видео-уроках встречал такую тему, как легенда для модели. Например, танк подорвался на мине, поэтому два катка у него заменены с обрезиненных на полностью металлические и покраска соответствующая легенде. У моего танка тоже есть легенда: два пьяных маляра ночью покрасили танк и их за это расстреляли, а потом отправили в ГУЛАГ. Суровые времена были, что поделать.

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

Получилось вот так:

Модель Т-34 в масштабе 1:35

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

Следующий этап — высветление и затенение масляными красками, смешанных с уайт-спиритом. Если окна не открывать в этот момент, то бесплатно мультики покажут.

Какие выводы по покраске кистью сделал:

  • кисточка должна быть достаточно большая, с мягким ворсом
  • краску разводить водкой и добавлять лак
  • красить в несколько слоёв
  • на резиновых гусеницах держится только грунтовка
  • автор — рукожоп
  • необходим аэрограф для закрашивания больших площадей

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

Личный блог Евгения Жирнова