.
МЕСТО ПОД РЕКЛАМУ
2 Март 2020

JQuery tabs — как сделать простые табы (вкладки)

Не претендую на авторство, вырвал из видеоурока по вёрстке
Очень простая реализация табов — буквально несколько строчек.


$(".tabs li").click(function() {
var tabName = $(this).attr("data-tab-name");
$(this)
.addClass("active")
.siblings()
.removeClass("active");
$(".tab-content." + tabName)
.addClass("active")
.siblings()
.removeClass("active");
});

У лишек должен быть атрибут data-tab-name одноимённый с классом содержащим контент.

Рабочий код с минимальной стилизацией — ссылка.

рубрики: Javascript - JQuery, Полезности | Комментарии (0)

27 Февраль 2020

Как быстро и просто вставить SVG иконки на сайт?

Продолжаю ковыряться в методиках современной вёрстки, сегодня нашел отличный ролик на тему работы с SVG иконками.
Собственно ролик https://www.youtube.com/watch?v=R2YC3SrTYHk

Если в 2х словах о технологии — необходимые иконки загружаются в онлайн сервис https://icomoon.io/
(жмякаем в правом верхнем углу по ссылке IcoMoonApp)
(кстати там тоже есть хорошая библиотека, например я именно там и взял бесплатные иконки)
Всё — загрузили, или выбрали необходимые иконки — жмём загрузить шрифт и вуаля — скачиваем архив с необходимым веб-фонтом и html файликом с демонстрацией подключения и использования.
Если окошко IcoMoonApp сразу не закрывать — можно удобно копировать код нужных элементом для вставки в проект.

Очень круто и очень быстро и просто!



рубрики: Вёрстка, Лайфхак, Полезности | Комментарии (0)

25 Февраль 2020

Возможно ли быстрое саморазвитие?

Если Вы более конкретный и прямолинейный человек и понимаете, что Ваше вектор развития вполне конкретен — например Вы видите себя программистом, то для Вас больше подойдут конкретная техническая литература, а лучше курсы — тогда рекомендуем Вам посетить сайт webshake.ru где Вы найдёте массу интересных курсов, например https://webshake.ru/kurs-php-dlya-nachinayushih — курс по PHP для начинающих.

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

Но можно ли, спросите Вы, достичь подобных результатов в такой короткий срок?
Читать полностью »

рубрики: Размышления, Реклама | Комментарии (0)

25 Февраль 2020

Лайфхак — как быстро почистить почту GMail

С некоторых пор гугл начал ругаться на заканчивающееся свободное место и предлагать приобрести дополнительное и как оказалось все 15 гигабайт у меня забиты именно почтой, которую я тотально не чистил ещё ни разу.
Первое что пришло в голову — удалить письма с объёмными вложениями, проще говоря самые тяжелые письма
Запрос в gmail larger:10M помог мне найти письма более 10 мегабайт, но после их удаления особо легче не стало:(
А вот чистка автоматически отсортированных писем по Категориями — Соцсети, Оповещения, Форумы, Промоакции лично мне очень круто почистили почту — убил более 40 тысяч писем, освободил 40% общего объёма дисковой ёмкости.

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



рубрики: SEO | Комментарии (0)

20 Февраль 2020

Технологии современной вёрстки pug + gulp + sass + sublime text + emmet

Последнее время совершенно нет времени даже на пост в блоге — помимо текущей работы погрузился в технологии современной вёрстки.
Собственно, случайно наткнулся на видео FrontCoder-a Современная верстка сайта с нуля и понеслось …
Информации для переваривания ОЧЕНЬ много, и вся на вес золота!
Одно дело изучать сухую теорию, другое дело видеть своими глазами непосредственно процессинг, причём не только вёрстка но и описание работы рабочих инструментов веб-программиста, а так же информация по их установке и настройке.
Так же автор даёт скачать свой рабочий настроенный шаблон для связки gulp + pug + sass
Если кратко gulp — инструмент для работы с проектом (автообновление в браузере, поддержка препроцессоров pug sass less slylus и других). Непосредственно для кодинга я пока остановился на sublime text т.к. с VS Code я постоянно сталкивался с неудобствами, последнее что выбило — кривое подключение emmet.

Собственно, для начинающих веб программистов настоятельно рекомендую канал FrontCoder-a, а так же его группу ВКонтакте https://vk.com/frontcoder

Так же случайно натыкал на курсы htmlacademy — пример https://htmlacademy.ru/courses/44/run/18
Немного теории без воды + сразу же практическая часть = идеально для начального обучения (отлично подойдёт совсем совсем для новичков)

PS
Мне ещё с GIT ом нужно подружиться, всё руки не доходят, да особой необходимости пока нет…

PPS
Внимание — шаблон для видео «Современная верстка сайта с нуля» разработанный на gulp3 для современной версии node.js и не подходит

рубрики: Вёрстка, Сайтостроение | Комментарии (0)

31 Январь 2020

Установка сертификата для https — как проверить валидность ключевых файлов?

Итак — присылает клиент приватный ключевой файл и файлы сертификата (сам сертификат, корневой и промежуточный), задание — прикрутить к nginx и настроить https
Делаю всё как обычно — нифига! nginx валит ошибку и всё тут, хоть убейся

nginx: [emerg] SSL_CTX_use_PrivateKey(«/etc/nginx/ssl/site.key») failed (SSL: error:0B080074:x509 certificate routines:X509_check_private_key:key values mismatch)

Уже всяко разно перепробовал, всё перепроверил — нихрена!
Ну, что — думаю нужно как то проверить валидность этих двух файлов, а точнее проверить их на совместимость.

Быстренько загуглил и вот решение:

openssl x509 -noout -text -in [path of public key]
openssl rsa -noout -text -in [path of private key]

Если поля «MODULUS» и «PUBLIC EXPONENT» совпадают для каждого из ключей, то и сами ключи соответствуют паре.

В случае, если поля не совпадают, вероятнее всего, Вы используете неверный приватный ключ.
Решений здесь может быть несколько, вот, некоторые из них:
1. Попробовать найти верный приватный ключ и повторить попытку;
2. Сгенерировать новый CSR запрос с новым приватным ключом и отправить запрос на перевыпуск сертификата.

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

минус два часа рабочего времени из за косорукости заказчика 🙁

рубрики: NIX, Администрирование | Комментарии (0)

30 Январь 2020

JQuery — как проверить существование элемента

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

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

// Способ первый - стандартный:
if($("#findID").length>0) {
// exists
}
//еще проще:
if($("#findID").length) {
// exists
}
// Еще вариант:
if($('#findID')[0]) {
// exists
}
// Способ второй - удобный (создадим пользовательскую функцию exists() ):
// Один раз объявляем функцию, потом используем так, как в примере
jQuery.fn.exists = function() {
return $(this).length;
}
// Пример использования:
if($("#findID").exists()) {
// exists
}
// Можно и так:
jQuery.exists = function(selector) {
return ($(selector).length > 0);
}
// Пример использования:
if ($.exists(selector)) {
// exists
}

рубрики: Javascript - JQuery | Комментарии (0)

24 Январь 2020

Как значительно ускорить скорость загрузки сайта

Скорость загрузки сайта была улучшена с 7.9 секунд до 1.45 секунды!
Кому интересно — читаем 🙂

Преамбула — обратился ко мне клиент с просьбой ускорить загрузку сайта, т.к. ну уж очень медленно всё — более 7 секунд!!! на загрузку главной страницы
изначальная версия главной (для тестирования обновляем страницу со сбросом кэша браузера)
Реклама крутится — бабки ввалены, а с такой скоростью врят ли стоит чего то ловить…
Сайт — очень красивая лендинг простыня, с кучей красивой графики и всяких не менее красивых эффектов появления другой графики — в общем полный треш в плане веса страницы, со всеми вытекающими …
Причём именно для этого сайта тормознутость загрузки очень явно видна т.к. пока не прогрузится вся страничка на видимой части не всплывёт непосредственно главное содержание странички — заголовки и футболист! До этого страничка будет выглядеть пустой.



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

Читать полностью »

рубрики: Bitrix, Javascript - JQuery, PHP, Лайфхак, Полезности, Программирование | Комментарии (0)

23 Январь 2020

Как переоформить домен в онлайн режиме — без нотариуса и личного посещения офиса

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

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

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

Всё!

PS
Если у вашего регистратора нет аукциона доменов, сначала перетащите домен на webnames.ru — это делается в онлайн режиме с помощью кода переноса, правда скорее всего на это уйдёт несколько дней.

рубрики: SEO | Комментарии (0)

23 Январь 2020

VS Code — форматирование HTML кода в PHP файлах

Всем привет!

Собственно, в качестве среды программирования поставил себе Visual Studio Code и начал потихоньку настраивать.
Судя по отзывам — лёгкий, удобный, функциональный и главное — бесплатный!
Для старта глянул видос от ITDoctor обзор редактора и начал осваивать.

Первая проблема с которой я столкнулся это то, что редактор не форматирует html разметку в php файлах
В том же Битриксе все шаблоны создаются в *.php файлах соответственно, вся html разметка там же
Всё что нашел в рунете — а ля расширение phpfmt умеет, но нифига оно не форматирует 🙁

Решение подсказали на форуме cyberforum.ru — ветка

Расширение Format HTML in PHP справилось с поставленной задачей!

рубрики: PHP, Программирование | Комментарии (0)

Яндекс.Метрика