Один из вариантов определения реального IP-адреса пользователя, который я использую и который меня не подводил:

function client_ip()
{
	if(isset($_SERVER['HTTP_X_REAL_IP'])) {
		return $_SERVER['HTTP_X_REAL_IP'];
	} else {
		if (!empty($_SERVER['HTTP_CLIENT_IP'])) {
			return $_SERVER['HTTP_CLIENT_IP'];
		} elseif (!empty($_SERVER['HTTP_X_FORWARDED_FOR'])) {
			return $_SERVER['HTTP_X_FORWARDED_FOR'];
		} else {
			return $_SERVER['REMOTE_ADDR'];
		}
	}
}

Вывод на экран:

echo client_ip();

Ну вот, наконец-то, и настало то время, когда я разместил свой сайт в сети Интернет. В этот морозный зимний вечер я перейду сразу к теме записи, а то глаза уже закрываются :)

Итак, допустим, вы разместили свой сайт в сети интернет. Что делать дальше? Что нужно чтобы люди вас находили и заходили на ваш, не сомневаюсь, очень нужный и полезный веб-ресурс? Как настроить сервер чтобы не было проблем?

Начнем по-порядку (в принципе то, что я сегодня вечером и делал):

Регистрируем сайт в популярных системах поиска

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

• Яндекс — http://webmaster.yandex.ru/addurl.xml
• Google — http://www.google.ru/intl/ru/addurl.html
• Апорт — http://catalog.aport.ru/rus/add/AddUrl.aspx
• Рамблер — http://www.rambler.ru/doc/add_site.shtml

——
UPD от 3 января 2012: С недавних пор Рамблер использует алгоритмы поиска системы Яндекс. Поэтому ссылка битая.

Создаём файл robots.txt

Наверняка на вашем сайте есть файлы и папки которые вы не хотите чтобы индексировались роботом. Это такие директории как, например, папка администрации сайта, конфигурационный файл или любые другие, которые сочтете нужными. Для таких случаев и нужен файл robots.txt.

Вот так файл robots.txt выглядит на одном из моих сайтов:

User-agent: *
Disallow: /administration
Disallow: /config.php
Disallow: /edit_profile.php

В данном случае имеется ввиду, что:
User-agent: * — дает право всем роботам индексировать все ресурсы сайта, так как используется символ подстановки «*».
Disallow: /administration — запрещает роботам заходить в каталог administration. (Если поставите Disallow: / — запретит индексировать все файлы сервера).
Disallow: /config.php — запрещает роботу индексировать файл config.php и т. д.

Загружаем файл robots.txt в корневую директорию и готово.

Ставим счетчик на сайт

Ну и напоследок, поставим счетчик на сайт, что бы быть в курсе всей статистики (откуда люди пришли, сколько человек посетило сайт, сколько страниц было просмотрено и т. п.). Мне всегда нравился счетчик от LiveInternet. В нем нет лишних наворотов, он очень простой и можно подобрать на нем цветовую гамму вашего сайта. Переходим по ссылке, регистрируемся и вставляем полученный код к себе на сайт.
——
UPD от 3 января 2012: Спустя где-то год после публикации, я полюбил систему статистики от Яндекса и люблю до сих пор :-)

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

Ну вот, как и обещал в прошлой записи, выкладываю заметку еще об одном сервисе от Yahoo!. На этот раз это будет интересный медиа плеер.

Почему интересный? Сейчас попробую объяснить...

Все дело в том, что подключается медиа плеер всего лишь одной строкой:

<script type="text/javascript" src="http://mediaplayer.yahoo.com/js"></script>

Затем выкладываем на странице MP3 файлы и далее скрипт автоматически считывает страницу на наличие музыкальных треков, превращая веб-страницы в плейлист. Также к каждой ссылке он подставляет значек со стрелочкой — «плей», которая меняется на знак «пауза» как только запущена песня. Еще раз повторюсь, что все это он делает сам! От вас нужно лишь разместить код, написанный выше. Как видите все очень просто! :)

Сам плеер располагается в левом нижнем углу экрана и разворачивается когда вы хотите послушать выложенные на странице песни:



Узнать о еще бОльших возможностях плеера от Yahoo! можно на официальной странице плеера.

Ну вот, наконец-то, я нацелился написать то, о чем вы меня так долго просили и так долго ждали. А именно, о неограниченном списке ссылок при нажатии на которые выпадает текст.

Как обычно, сразу к делу. Создаем страницу следующего вида:

<!DOCTYPE HTML>
<html>
<head>
	<meta charset="windows-1251">
	<title>Неограниченный список ссылок с выпадающим текстом</title>
	<script src="http://yandex.st/jquery/1.4.4/jquery.min.js"></script>
	<script>
		$(function() {
			$("#cat p").hide();
			$("#cat h4").click(function() {
				$(this).next("p").slideToggle("slow");
			});
		});
	</script>
</head>
<body>
	<div id="cat">
		<h4>
			<a href="#">Продукты питания</a>
		</h4>
		<p>
			<a href="#">Печенье</a><br>
			<a href="#">Суши</a><br>
			<a href="#">Хлебные изделия</a><br>
		</p>

		<h4>
			<a href="#">Безалкогольные напитки</a>
		</h4>
		<p>
			<a href="#">Вода</a><br>
			<a href="#">Газировка</a><br>
			<a href="#">Минеральные воды</a><br>
			<a href="#">Сок</a><br>
		</p>

		<h4>
			<a href="#">Алкогольные напитки</a>
		</h4>
		<p>
			<a href="#">Вино</a><br>
			<a href="#">Водка</a><br>
			<a href="#">Ликер</a><br>
			<a href="#">Шампанское</a><br>
		</p>
	</div>
</body>
</html>

Теперь пару слов по коду.
C 8 по 13 строки идет jQuery код, который сначала скрывает все параграфы в элементе cat, а затем, при клике на ссылку в тэге h4, ищет следующий непосредственно за ним параграф и делает его видимым.

Добавив в jQuery-код немного магии, мы сможем добиться такого эффекта, что, при нажатии на ссылку с выпадающим текстом, другой выпадавший ранее текст свернется. Таким образом нам будет показан только один выпавший текст. Это достигается путем добавления пары манипуляций в 11 строке:

$(this).next("p").slideToggle("slow").siblings("p:visible").slideUp("slow");

Можно посмотреть пример с разными вариантами.

За последнее время самой популярной и самой комментируемой стала запись о выпадающем тексте при нажатии на ссылку. Сегодня я расскажу о еще одном способе добиться желаемого результата с помощью библиотеки jQuery.

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

Начнем с того что создадим файл index.html:

<!DOCTYPE HTML>
<html>
<head>
	<meta charset="windows-1251">
	<title>Выпадающий текст при нажатии на ссылку с помощью jQuery</title>
	<script src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
	<script>
		$(function() {
			$(".btn-slide").click(function() {
				$("#panel").slideToggle("slow");
				$(this).toggleClass("active"); return false;
			});
		});
	</script>
	<style>
		#panel {    
			display: none;
			padding: 5px;
			width: 400px;
			height: 200px;
			background: #09F;
			color: #FFF;
			}
		.btn-slide {
			background: #CCC;
			color: #06F;
			}
		.active {
			background: #FF9;
			}
	</style>
</head>
<body>
	<a href="" class="btn-slide">Нажми на меня!</a>
	<div id="panel">
		Lorem ipsum dolor sit amet, 
		consectetuer adipiscing elit, sed diam 
		nonummy nibh euismod tincidunt ut  
		laoreet dolore magna aliquam erat 
		volutpat. Ut wisi enim ad minim veniam, 
		quis nostrud exerci tation ullamcorper 
		suscipit lobortis nisl ut aliquip ex ea 
		commodo consequat. Duis autem vel eum 
		iriure dolor in hendrerit in vulputate 
		velit esse molestie consequat, vel 
		illum dolore eu feugiat nulla facilisis 
		at vero eros et accumsan et iusto odio 
		dignissim qui blandit praesent luptatum 
		zzril delenit augue duis dolore te 
		feugait nulla facilisi.
	</div>
</body>
</html>

Принцип работы скрипта состоит в следующем: после загрузки документа (строка 8) и при нажатии на ссылку с классом btn-slide (строка 9), панель с id=panel выдвигается и показывает свое содержимое (строка 10), при этом класс ссылки меняется на active (строка 11).

Вот собственно и все. Можно посмотреть демо.

Самый интересный, во всех смыслах, доклад Вадима Макеева о том, как уместить сайт на мобильных платформах.

Слайды с доклада.

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

Костя настрочил заметку быстрее меня, там все правда, можете смело почитать :-)

Авторизуйтесь на сайте, смотрите, что вы делали месяц или год назад. Следите, чем занимаются ваши друзья, знакомые, незнакомые или целые компании. Участвуйте в тематических фото сетах наравне с другими пользователями. Ищите новые сюжеты и делитесь с окружающими своими творениями!

Ставьте сердечки ВКонтакте и рассказывайте друзьям. 365dayz.ru — фото твоего дня!

Подписывайтесь на официальные страницы проекта во ВКонтактике и Твитерике.

Желание попробовать сделать расширение для Гугл Хрома появилось у меня уже давно, но руки никак не доходили сесть и изучить, что да как. Вчера высвободил время и посвятил весь день изучению этого вопроса. Как ни странно, в рунете достаточно мало описано про создание таких вещей, обычно попадаются сборники, типа «25 лучших расширений и приложений». Дальше третьей страницы в поиске не листал. Но тем не менее, было и что почитать. Особо отмечу этот блог, который дал мне базовое представление о разработке; дальше пришлось изучать только документацию на английском языке.

Решил начать с самого простого и достаточно необходимого мне в работе инструмента — генератора пароля. На самом деле таких генераторов в интернет-магазине Хрома много, но мне они не нравятся. Я люблю, когда всё выглядит красиво и просто; люблю, когда каждый элемент стоит на своём месте; люблю, когда всё удобно и понятно. Поэтому решил сделать самый приятный в использовании генератор пароля.

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

Как видите бывают всякие: и сложные, и непонятные, и кривые, с кучей настроек и полей. Но зачем всё это? Если человеку нужен пароль, то нужно просто дать ему его. Не нужны никакие настройки, просто сгенерировал — скопировал — вставил. Всё!

После некоторого изучения, дум и перделок я сделал самый удобный, на мой взгляд, генератор пароля:

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

P. S. Так как это был мой первый опыт разработки подобных расширений, приходилось постоянно обновлять архив приложения. В итоге версия доросла до 1.1.2.

Прокатился недавно на общественном транспорте в Челябинске. Узнал, что, оказывается, теперь вместо обычных привычных билетов кондукторы выдают чеки, ну, типа, как в магазине.

С одной стороны, конечно, круто. На таком «билеточеке» пишется вся необходимая информация, вплоть до телефона обслуживающей организации маршрута. А вот с другой — теперь не будет счастливых билетов :-)

Узнал то недавно, а вот билет только сегодня сумел сохранить:

Такие изменения только Челябинск, похоже, коснулись. Как там другие города поживают?