Все для WordPress и WEB разработки от TechBlogSD
66 subscribers
2.18K photos
2.18K links
Download Telegram
JavaScript - Отложенная загрузка внешних скриптов или добиваемся повышения в глазах Google Page Speed
02.03.2017
#JavaScript #jQuery #PageSpeed_Insights #WEB #WordPress #WordPress_jQuery

Достаточно часто при тестировании скорости страницы появляется потребность в отложенной загрузке внешних скриптов подключенных к странице. В поисках решения данной проблемы я наткнулся на весьма интересный вариант решения данного вопроса, за которое отдельная благодарность его автору Patrick Sexton.Ниже приведен код который необходимо вставить в конец страницы перед закрывающим body () function downloadJSAtOnload() { var element = document.createElement("script");…

https://techblog.sdstudio.top/javascript-otlozhennaja-zagruzka-vneshnih-skriptov-ili-dobivaemsja-povyshenija-v-glazah-google-page-speed/
JavaScript — Повышаем скорость загрузки страницы при помощи отложенной загрузки изображений
15.03.2017
#WordPress #WordPress_jQuery #Все_для_разработки_плагинов #Все_для_разработки_шаблонов

В этой статье описывается простой способ отложить загрузку изображений без использования JQuery, максимального повышения скорости загрузки страницы. Теперь для Вас не будет являться секретом как разобраться с тяжелыми изображениями, на которые так жестоко ругается гугл при тесте скорости страницы. Одной из главных причин медленной загрузки, это изображения. Для того что б облегчить страдания браузера воспользуемся…

https://techblog.sdstudio.top/javascript-povyshaem-skorost-zagruzki-stranicy-pri-pomoshhi-otlozhennoj-zagruzki-izobrazhenij/
Google Maps API + B-Lazy + King Composer - или отложенная загрузка карт
18.09.2017
#Google #Google_Maps #WordPress #WordPress_jQuery

Задача загрузить карты Google отложено, то есть после того момента когда пользователь доскролил до блока с картой. Для этого нам понадобятся: Знание Google Maps API и и Ваш личный key Подключение библиотеки отложенной загрузки B-Lazy Изображение которое будет отображаться место нашего блока с картой Изображение маркера Вариант 1 — без кастомизации карты (перед блоком с…

https://techblog.sdstudio.top/google-maps-api-b-lazy-king-composer-ili-otlozhennaja-zagruzka-kart/
jQuery - плавный скрол к якорю при переходе с другой страницы сайта или по прямой ссылке
25.10.2017
#JavaScript #jQuery #WordPress #WordPress_jQuery #Все_для_разработки_плагинов #Все_для_разработки_шаблонов

За данный скрипт очень благодарен humster_spb первый его вариант опубликован здесь. Скрипт: jQuery(document).ready(function($) { var myHash = location.hash; //получаем значение хеша location.hash = ''; //очищаем хеш if(myHash[1] != undefined){ //проверяем, есть ли в хеше какое-то значение $('html, body').animate( {scrollTop: $(myHash).offset().top - 110} , 700); //скроллим за полсекунды location.hash = myHash; //возвращаем хеш }; }); В строке «.top…

https://techblog.sdstudio.top/jquery-plavnyj-skrol-k-jakorju-pri-perehode-s-drugoj-stranicy-sajta-ili-po-prjamoj-ssylke/
Popups — запуск попап окна из jQuery функции
13.11.2017
#PopUps #WordPress #WordPress_jQuery #Плагины

Часто при создании сайта требуется открытие попап окон (созданных при помощи плагина Popups) при чем это открытие должно происходить в зависимости от тех, или иных правил. Код ниже служит примером как можно это осуществить. jQuery(document).ready(function($) { /*Центрирование элемента - ФУНКЦИЯ*/ jQuery.fn.center = function() { this.css("position","absolute"); this.css("top", Math.max(0, (($(window).height() - $(this).outerHeight()) / 2) + $(window).scrollTop()) +…

https://techblog.sdstudio.top/popups-zapusk-popap-okna-iz-jquery-funkcii/
Лайт бокс для всех изображений блога
14.11.2017
#JavaScript #WordPress #WordPress_jQuery #Плагины

Для того что бы  изображения (которые имеются массово в наших записях ) блога не открывались во весь экран тем самым заводя посетителя на черный экран новой вкладки, а открывались в приятных лайтбоксах имеется у меня решение ниже: В начале пропишем данный код в файл function.php: //START MediaDoma.com - автоматическое добавление rel="lightbox" к ссылкам на картинки…

https://techblog.sdstudio.top/lajt-boks-dlja-vseh-izobrazhenij-bloga/
jQuery - перевод текста в зависимости от языка страницы
20.12.2017
#WEB #WordPress #WordPress_CSS #WordPress_HTML #WordPress_jQuery #Все_для_разработки_шаблонов

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

https://techblog.sdstudio.top/jquery-perevod-teksta-v-zavisimosti-ot-jazyka-stranicy/
WordPress и горячие клавиши на Java Script (быстрый вход в консоль)
27.01.2018
#WordPress #WordPress_jQuery #WordPress_Админка #Все_для_functions_php #Все_для_разработки_плагинов

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

https://techblog.sdstudio.top/wordpress-i-gorjachie-klavishi-na-java-script-bystryj-vhod-v-konsol/
Contact form 7 - Событие после успешной и не успешной отправки + экспорт Popups + jquery сценарии
07.02.2018
#Contact_Form_7 #PopUps #WordPress #WordPress_jQuery #Плагины

Достаточно плотно работая с легендарными плагинами Contact Form 7 и Popups у меня возник вполне очевидный вопрос “-Как сделать оповещение в виде попап окна после отправке формы?”. Методом проб и ошибок все таки удалось отобразить попап окна которые сами открываются (и закрываются тоже самостоятельно — конечно же благодаря jQuery) после того как пользователь нажал на…

https://techblog.sdstudio.top/contact-form-7-sobytie-posle-uspeshnoj-i-ne-uspeshnoj-otpravki-jeksport-popups-jquery-scenarii/
Адаптивная таблица за счет скрола
08.02.2018
#CSS #jQuery #WEB #WordPress #WordPress_CSS #WordPress_jQuery

Всем добра, не давно на работе пришлось переносить весьма старый сайт со всем его содержимым с Joomla 1,5 (одно слово Joomla у меня давно вызывает дрожжжжжж и нервный тик) на WordPress 4.9.3. Учитывая что весь контент наполнялся девушкой которая переносила таблицы на страницы старой версии сайта копипастом из Word документов, мне пришлось весьма нелегко с…

https://techblog.sdstudio.top/adaptivnaja-tablica-za-schet-skrola/
JetPack - Кнопки социальных сетей (перевод)
08.02.2018
#WordPress #WordPress_jQuery #Плагины

Это руководство покажет вам как добавить кнопки общего доступа к сообщениям на блоге чтобы дать вашим читателям возможность легко поделиться своим контентом в Twitter, Facebook, Google+, LinkedIn, а также множество других соцциальных сетях чтобы помочь распространить Вашу запись на сайте как можно “шире” в сети интернет. И так, в итоге блок с кнопками для социальных…

https://techblog.sdstudio.top/jetpack-knopki-socialnyh-setej-perevod/
Video Background - полностью адаптивный видео бекграунд (работающий из вложенного div)
08.02.2018
#King_Composer #WEB #WordPress #WordPress_CSS #WordPress_jQuery #Плагины

Так как я в основном делаю проекты на King Composer’e для меня важен видео бэкграунд, но к сожалению на данный момент плагин поддерживает в качестве источника видео только сервис YouTube, что весьма грустно. Для того чтобы добавить свой источник (в том числе и локальную медиатеку) пришлось немного поизвращаться. В итоге получился практически универсальный вариант, который…

https://techblog.sdstudio.top/video-background-polnostju-adaptivnyj-video-bekgraund-rabotajushhij-iz-vlozhennogo-div/
Липкое меню с прозрачностью до начала скрола страницы
08.02.2018
#JavaScript #jQuery #WEB #WordPress #WordPress_CSS #WordPress_jQuery

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

https://techblog.sdstudio.top/lipkoe-menju-s-prozrachnostju-do-nachala-skrola-stranicy/
Google Maps - С отложенной загрузкой и прилоадером (полностью адаптивное)
11.02.2018
#Google #Google_Maps #jQuery #WEB #WordPress #WordPress_jQuery

Друзья в данной записи предоставлю пример кода в котором фрейм карты отображается с отложенной загрузкой, а до тех пор пока отобразится карта Google во весь блок отображается прелоадер сигнализирующий о загрузке блока с картой. Друзья в данной записи предоставлю пример кода в котором фрейм карты отображается с отложенной загрузкой, а до тех пор пока отобразится…

https://techblog.sdstudio.top/google-maps-s-otlozhennoj-zagruzkoj-i-priloaderom-polnostju-adaptivnoe/
Bootstrap 3 - Создание мобильного меню для WordPress
11.02.2018
#CSS #HTML #JavaScript #jQuery #WEB #WordPress #WordPress_CSS #WordPress_HTML #WordPress_jQuery #Все_для_разработки_шаблонов

Как организовать скрытие меню в бутерброд? На этот вопрос далеко не все веб мастера могут найти внятный вопрос, в данной записи я попытаюсь ответить на него приведя пример кода. В коде который используется в данном примере, мной использовались стили и скрипты Bootstrap, которые можно взять из CDN по ссылкам ниже. CDN Bootstrap LINK: https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js

https://techblog.sdstudio.top/bootstrap-3-sozdanie-mobilnogo-menju-dlja-wordpress/
jQuery – Как сделать одинаковую высоту всех блоков по самому высокому из них
07.12.2018
#CodePen #JavaScript #jQuery #WEB #WordPress #WordPress_jQuery

Согласитесь когда высота блоков одинаковых по сути элементов на веб странице идет в разнобой – это не есть хорошо. В начале разработки я “кошмарился” с данными блоками при помощи @mediaquery в CSS стилях и убивал огромное количество времени что бы все это дело привести к более мение качественному виду. Но появился отличный плагин jQuery который…

https://techblog.sdstudio.top/blog/jquery-kak-sdelat-odinakovuiu-vysotu-vsekh-blokov-po-samomu-vysokomu-iz-nikh
jQuery – Как найти элемент (блок, div) с определенным текстом
12.12.2018
#CodePen #JavaScript #jQuery #WEB #WordPress #WordPress_jQuery

При создании сайтов а именно при написании скриптов веб разработчики часто сталкиваются с необходимостью найти определенный текст, а если быть точнее то найти блок с определенным текстом. В данном примере мы разберем как именно можно найти блок с текстом и произвести с ним определенные манипуляции. Задача Необходимо найти блок с текстом “featured”и удалить span блок…

https://techblog.sdstudio.top/blog/jquery-kak-naiti-element-div-s-opredelennym-tekstom
Как подключить файл стилей через jQuery скрипт
26.12.2018
#Grav #WEB #WordPress #WordPress_CSS #WordPress_jQuery

Данный пример поможет подключить любой файл стилей к вашей странице сайта без особых знаний JavaScript. В примере моего кода, jQuery скрипт подключит файл стилей только в случае если на странице есть данный блок: body.kc-live-editor.kc-request-iframe jQuery скрипт для подключения файла с стилями Код который необходимо добавить в файл скриптов своей темы: jQuery(document).ready(function($){ $('button').click(function(){ /*=========== // В…

https://techblog.sdstudio.top/blog/jquery-kak-podcliuchit-fail-stilei-cherez-jquery-skript
WordPress 5.6 крупные изменения в jQuery
09.11.2020
#WordPress #WordPress_jQuery

WordPress 5.6 будет поставляться с последней библиотекой jQuery в следующем месяце. Это серьезное обновление, с которым все разработчики плагинов и тем должны начать тестирование. На прошлой неделе Мариус Дженсен объявил об изменении в блоге Make Core. Ожидается, что следующие библиотеки, связанные с jQuery, будут поставляться с обновлением (билет WordPress Trac ): jQuery 3.5.1 jQuery Migrate…

https://techblog.sdstudio.top/wordpress-5-6-krupnye-izmenenija-v-jquery/
Обновление кода jQuery в неподдерживаемом плагине или теме WordPress
11.12.2020
#WordPress #WordPress_jQuery

Это очень обобщенное введение, оно ни в коем случае не является исчерпывающим или полным. Вам предлагается продолжить изучение проблем, с которыми вы можете столкнуться. С выпуском WordPress 5.5 инструмент, известный как jQuery Migrate, больше не был включен по умолчанию (это часть пути обновления до jQuery 3 в ядре WordPress). К сожалению, на некоторых пользователей это…

https://techblog.sdstudio.top/obnovlenie-koda-jquery-v-nepodderzhivaemom-plagine-ili-teme-wordpress/