ИльяКомментарии к записи Как скрыть URL входа админ-панели WordPress отключены
Приветствую, дорогой гость! В данной статье мы рассмотрим, как скрыть URL входа админ-панели WordPress. Похожая тема уже была затронута на блоге DayAfterNight, она называлась “Как изменить адрес входа в админ-панель WordPress“. Ко мне очень часто обращались со следующим: Почему не скрывается админ-панель? Если набрать wp-admin, откроется новая страница логина. Друзья, прошлая статья была направлена именно на замену страницы логина WordPress, а не на ее скрытие от посторонних глаз. Мы заменяли wp-login.php на свое название, например, admin-login.php. Сегодня, скроем данную страницу. Итак, для того, чтобы скрыть страницу входа, нам потребуется зайти на хостинг и отредактировать файл .htaccess, который находится в папке вашего WordPress. Например: Ваш_хостинг/httpdocs/wordpress/.htaccess В файл .htaccess нужно вставить следующий код: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 # Hide admin URL start <IfModule mod_rewrite.c> RewriteEngine On RewriteRule ^my_admin_url/?$ /wp—login.php?my_secret_key [R,L] RewriteCond %{HTTP_COOKIE} !^.*wordpress_logged_in_.*$ RewriteRule ^my_admin_url/?$ /wp—login.php?my_secret_key&redirect_to=/wp—admin/… Читать далее »
ИльяКомментарии к записи Параллакс-эффект на чистом CSS отключены
В этой статье показано, как с помощью CSS-трансформаций, перспективы и небольших хитростей с масштабированием сделать параллакс-эффект на чистом CSS. Параллакс чаще всего делается на JavaScript, и почти всегда он реализован плохо: отлавливается событиепрокрутка, изменения в DOM вносятся напрямую в обработчике и вызываются лишние перерасчёты и перерисовки. Всё это происходит асинхронно с потоковым рендерингом браузера, в результате чего некоторые кадры пропускаются и эффект выглядит прерывистым. Впрочем, это не так уж страшно —requestAnimationFrame и отложенное обновление DOM позволяют управлять внешним видом сайтов с параллакс-эффектом. Но что если вы могли бы совсем не зависеть от JavaScript? Перенос параллакс-эффекта на CSS избавит вас от упомянутых проблем и позволит браузеру положиться на аппаратное ускорение — почти всё будет обрабатываться компоновщиком. В результате вы получите согласованную частоту кадров и гладкую прокрутку страницы. Кроме того, можно сочетать этот эффект с другими CSS-приёмами, такими как медиавыражения и поддержка CSS-свойств. Как насчёт отзывчивого параллакс-эффекта? Теория Прежде чем говорить о принципе работы, давайте выполним базовую разметку: <div class=«parallax«> <div class=«parallax__layer parallax__layer—back«> … </div> <div class=«parallax__layer parallax__layer—base«> … </div> </div> А вот основные стили: .parallax { perspective: 1px; height: 100vh; overflow-x: hidden; overflow-y: auto; } .parallax__layer { position:… Читать далее »
Люди часто используют JavaScript, чтобы сделать выпадающее меню. Но на самом деле это можно сделать на чистом CSS. И в этом уроке вы узнаете, как это сделать. Принцип работы Для начала, чтобы вы поняли принцип работы выпадающих элементов, разберём простой пример. Возьмём простой html-код для работы: 1 <div class=»example_shown»>Наведи на меня курсор > <div class=»example_hidden»>я — скрытая часть</div></div> и применим к этому коду такие стили: .example_shown { display:inline-block; } .example_hidden { display:none; } .example_shown:hover .example_hidden { display:inline-block; } Наведи на меня курсор > В css мы скрыли нужную часть текста, изменив его отображение на display:none;. При наведении курсора (:hover) на родительский элемент .example_shown у дочернего элемента .example_hidden меняется тип отображения на видимый. По такому принципу и строятся выпадающие меню. Создание выпадающего меню Теперь займёмся реализацией самого меню. Для его организации воспользуемся тегами списков ul и li 1 2 3 4 5 6 7 8 9 10 11 12 13 14… Читать далее »
Ну кто из нас не знает, что такое псевдоселекторы (или псевдоклассы) в CSS? Да-да, это то, что обычно пишут после селектора через двоеточие. Самые известные псевдоклассы это :link, :hover, :visited и :active. Такие конструкции в CSS, как правило, можно встретить в каждом файле стилей, но их использование ограничивается лишь описанием состояния ссылок и не более того. В общем, тема псевдоселекторов еще не обсуждалась на нашем сайте, так что самое время приступить 😉 Итак, как я уже сказал, веб-разработчики используют псевдоклассы в основном для задания стилей ссылок, например :link для непосещенной ссылки, :hover для ссылки при наведении, :active для нажатой и удерживаемой ссылки и :visited для посещенной. Кстати, у нас есть отличная статья про оформление ссылок, рекомендую.Идем дальше. Как вы думаете, сколько, помимо этих четырех, существует псевдоклассов? :first-child, last-child? Кто еще? Все? А на самом деле всего их 33. Рассмотрим все детально. Название и назначение псевдоклассов :link — отвечает за стили непосещенной ссылки;… Читать далее »
Дорогие друзья, сегодня я расскажу о том, как добавить кнопку Google +1 на свой сайт. Недавно Google анонсировал кнопку, а сейчас она стала доступной для всех желающих разместить ее на своих интернет ресурсах. Вообще-то я собирался сегодня опубликовать новый пост про Америку, но спешу поделиться с вами новой кнопкой от Гугла. А про Америку рассказ готов, и опубликую его завтра 😉 . Что дает кнопка Google +1? Например, посетителям вашего сайта понравилась какая-либо статья (новость, страница товара, услуги и т.д.). Если вы предусмотрительно добавите кнопку Google +1 на страницы своего сайта, то посетители смогут кликнуть по ней на понравившейся странице. Что происходит дальше? А дальше друзья ваших читателей в результатах поиска Google будут видеть, кто уже поделился какой-либо страницей. Кроме этого, вы сможете видеть отметки о страницах, за которые вы сами голосовали, то есть будет проще искать нужную информацию. Покажу на примере. Набираю я запрос «indigotlt.ru» в Google, и… Читать далее »
От автора: Эта статья отображает лишь одно из многих решений проблемы адаптивных изображений. До выбора конкретного решения мы предлагаем вам рассмотреть разные подходы, включая эти два:Как избежать дублирования загрузки адаптивных изображений (How To Avoid Duplicate Downloads In Responsive Images ) и Выбор решения для адаптивных изображени (Choosing A Responsive Image Solution). При разговорах о таких новых стандартах HTML5, как атрибут srcset и элемент picture, а также технологиях серверной стороны, таких как Адаптивный веб-дизайн +компоненты серверной стороны (Responsive Web Design + Server Side Components ) (RESS), простительно, если вы решите, что простые статические вебсайты сейчас не в состоянии поддерживать адаптивные изображения. Однако такое заключение может оказаться преждевременным. Фактически, существует легкий прямой способ доставки адаптивных изображений, поддерживаемых всеми современными веб-браузерами: фоновые изображения CSS. Однако этот подход имеет свои ограничения и не всегда работает. Но если при несложных требованиях вы готовы сделать дополнительное усилие и обеспечить доступность ваших изображений, то все, что вам… Читать далее »
От автора: анимация CSS очень интересна; ее красота состоит в том, что с помощью множества простых свойств можно сделать что угодно от элегантного плавного проявления до очень красивых эффектов. Одно из средств CSS, находящееся где-то в промежутке между ними – это эффект переворота CSS, где при этом на обеих сторонах контейнера, как с лицевой, так и изнаночной, имеется контент. Этот учебник покажет вам, как легко и просто создать его. Краткое примечание: это не первый учебник о подобном эффекте, но все остальные показались мне слишком сложными. Во многие другие статьи добавлены дополнительные стили для кодирования примеров, требующие затем от читателя расшифровки, что из них нужно, а что нет. В данном учебнике этот вопрос опускается, предоставляя вам только необходимые стили; можете украсить любую сторону каждого оборота как вам заблагорассудится. ДЕМО HTML Структура HTML для получения ожидаемого вами двустороннего эффекта: 01.<div class=»flip-container» ontouchstart=»this.classList.toggle(‘hover’);»> 02.<div class=»flipper»> 03.<div class=»front»> 04.<!— front content —> 05.</div> 06.<div… Читать далее »
Совместимость Joomla 3+ Установка Установка через стандартный установщик Joomla. Описание Плагин публикует материал компонента K2 на стене группы Вконтакте. Запись включает в себя наименование материала, вступительный текст, очищенный от html кода, изображение материала, ссылка на материал. Если установлено время публикации, то к записи еще прикрепляется таймер. Плагин позволяет публиковать материалы, опубликованные в компоненте K2, на стену группы Вконтакте; указать категории, чьи материалы не будут публиковаться; задать время отложенной публикации; Для работы плагина необходимо Создать Standalone-приложение. Копируем ID приложения. Сформировать запрос вида https://api.vk.com/oauth/authorize?client_id=##ID##&redirect_uri=https://api.vk.com/blank.html&scope=wall,photos,offline&display=page&response_type=token где ##ID## — id приложения полученный ранее. В ответ приходит токен доступа, который нужно скопировать в поле Access token. В поле ID группы скопировать id группы на стене которой будут публиковаться сообщения (если у Вас публичная страница, то перед id следует поставить знак «-«). В поле ID альбома скопировать ID альбома, куда будут сохраняться изображения материалов. В поле ID категорий записать через запятую id категорий, материалы из которых… Читать далее »
Статья не будет чем-то новым для профессионалов, но думаю будет полезна для новичков. Итак, как быстро и без проблем перенести сайт на другой сервер? Стандартно при переносе мы делаем архив сайта, бэкап базы, затем заливаем архив на новый хостинг и, создав базу, импортируем туда дамп. После этого вносим правки в configuration.php. Это хороший, рабочий метод, но нужно знать, как на конкретном хостинге создать архив, нужен доступ к PhpMyAdmin, а также аккуратно вносить изменения в configuration.php, предварительно уточнив абсолютные пути к папке сайта у данного хостера. Можно (и нужно) поступить гораздо проще — использовать расширение JoomlaPack, кстати, одно из самых популярных на extensions.joomla.org. Итак, по порядку. Скачиваем и устанавливаем JoomlaPack. Заходим в компоненты — JoomlaPack — Backup Now и делаем полный бэкап сайта. В зависимости от скорости хостинга и объема сайта эта процедура занимает от нескольких минут до нескольких секунд. На некоторых хостингах, к сожалению из-за ограничений времени выполнения бэкап создать… Читать далее »
Для проверки ссылок на редиректы и индексацию, можно спокойно воспользоваться сервисом от https://www.bertal.ru/. Данный сервис показывает в коде все возможные nofollow, noindex редиректы типа перехода через специальный файл или сервис.
