zura-blog ipПривіт всім відвідувачам Zura — Blog, продовжую викладати матеріали які стосуються мови програмування рнр, сьогодні до вашої уваги скрипт який виводить ір-адресу відвідувача, і до самого скрипта ще один елемент, це картинка на якій буде відображатись ір-адреса, отож як зробити красиву сторінку, на якій би  відображались айпішка відвідувача в середині картинки, можна буде дізнатись в даній публікації.

Взагалі то  подібний текст “Дізнатись  ір ” або “Ваш ір ” можна побачити зараз на багатьох сайтах, на багатьох присутня  можливість, де при переході на ресурс відображаєтся ваша ір-адреса.

Зараз  коротко “Що таке ір-адреса”, адже можливо дех  то з відвідувачів, може і не знати що таке ір-адреса. Отже ір-адреса це індентифікатор, по якому визначають пристрої в мережі, точніше цей індентифікатор використовують для адресації компютерів, смартфонів, в общому любий пристрій який підключається до мережі, отримує ір-адресу.

Ір – адреси бувають статистичним (ті які надаються при підключені пристрою, і не можуть бути змінені), і динамічними, які застосовують в більшості випадків, використовуються протягом обмеженого проміжку часу, а точніше після наступного підключення динамічна ір-адреса змінюється. Також динамічні ір-адреси бувають віртуальними.

В общому ір – адреса зєднює ваш пристрій з провайдером, він вас індентифікує, і після чого надає доступ до мережі.  Власне на рахунок ір – адреси, її характеристику і т.п, я напишу пост найближчим часом, ну а далі мова піде про скрипт, і як зробити так щоб  ір – адреса відображалась на фоні картинок.

Для того щоб відобразити айпішку на фоні картинки, а точніше  фотографії, для прикладу (я взяв свій ноутбук), потрібно застосувати каскадні таблиці стилей CCS, а для обробки використовується скрипт. Оскільки на html – сторінці можна застосовувати крім мови гіпертекстової розмітки,  ці дві технолгії, мову програмування рнр для скриптів, і каскадні таблиці стилей.

Власне як підключаються каскадні таблиці стилей CCS, можна знайти на Zura — Blog в категроії Все про CCS, існує три способи підключення.

Кожен спосіб підключення CCS використовується для різних цілей, я вирішив розмісти правила CCS на одній сторінці, як і сам скрипт, хоча якщо є потреба, то звісно що можна створити окремі файли і підєднати їх до html – сторінки.

Ну що ж далі повністю код html – сторінки, який буле відображати скрипт, в середині картинки.

<html>
<head>
    <title>IP-адрес на Zura-Blog</title>
    <style>
        .blok {
            position: absolute; /* Позиціонування */
            width: 369px; /* Ширина блоку */
            height: 400px; /* Висота блоку */
            margin: auto; /* Відступ від блоку */
            top: 0; /* Положення блоку від верхнього края */
            bottom: 0; /* Положення блоку від нижнього края */
            left: 0; /* Положення блоку від лівого края */
            right: 0; /* Положення блоку від правого края */
            border: 0px solid #000; /* Рамка блоку */
            padding: 40px; /* Відступ всередині блоку */
            overflow: auto; /* Полоса прокрутки */
            background-image: url(../images/1.jpg); /*шлях до фото  фона*/
        }
        .text
        {
            width: 300px; /* Ширина блока */
            margin: 0 auto; /* Відступ від блока */
            margin-top:50px; /* Відступ від блока */
            font-size: 24px; /* розмір шрифта */
            color:#cc0000; /* колір шрифта */
        }
    </style>
<body>
<div class="blok">
    <form>
        <p class="text">Ваш ip адрес:<?php echo $_SERVER['REMOTE_ADDR'] ?>
            <?php
            if( isset($_SERVER['X_FORWARDER_FOR']) ) echo "Proxy's IP-address: ".$_SERVER['X_FORWARDER_FOR']."";
            ?></p>

    </form>
</div>
<?php
$date_today = date("d | m | Y"); // день місяць рік
$today = date("g:i:s");
echo("Ви зайшли на сайт: $date_today в : $today .");//Виводимо дату і годину:
?>
</body>
</html>

Пояснення, копіюєте код, відкриваєте веб або рнр редактор, вставляєте код, зберігаєте розширення обовязково рнр, і зберігаєте фото нижче “1.jpg”, в папці “images”. Далі щоб перевірки як працює скрипт, звісно що потрібен локальний сервер, якщо відсутній, тоді створюєте за допомогою пакету програм від Енделс або Денвер.

1

⇒  1.jpg

Спочатку розберемо каскадні таблиці стилей CCS, хоча в коментах все розписано, для чого потрібний кожен рядок, власне акцентую увагу на способі підключеня, підключається через теги <style></style>, всередені цих тегів прописані правила, яку позицію має зайняти картинка, або фотографія, і правила для тексту.

background-image: url(../images/1.jpg); /*шлях до фото фона*

цей рядок відповідає за підключення графічного файлу “1.jpg”, файл “ip.php” (файл в якому розміщений даний код) і папка “images”, в мене розміщені в головній папці тестового сайту, або як ще називають кореневій папці сайту, якщо ви створити окрему папку для файла, тоді вказуєте назву цієї папки, перед  “/images/”.

zura-blog ip1

В випадку якщо текст буде відображатись поза картинкою, не панікуйте, і не впадайте в відчай, а самі постарайтесь відрегулювати, вказавши  ширину і висоту блоку, сьомий і восьмий рядок, “width” і “height” і відступ в середині блоку “padding”. Просто вказуєте розміри і перезапускаєте сторінку, поки текст не розташується в потрібному місці.

Далі в самому кінці, останній рядок стилей CCS, в правилах для тексту вказуєте колір, яким буде відображатись текст.

width: 369px; /* Ширина блоку */

height: 400px; /* Висота блоку */

padding: 40px; /* Відступ всередині блоку */

color:#cc0000; /* колір шрифта */

Після тегу <body> йде блок “div”, в блоці “form” форма в якій знаходиться  текст “Ваш ip адрес:” текст ви можите поміняти, і скрипт який міняти не потрібно, а можна якщо потрібно витягнути з форми, і вставити в окреме місце на сторінці. Тоді на текст не будуть впливати правила CCS.

<div class=”blok-center”>
<form>
<p class=”text”>Ваша ip адреса:<?php echo $_SERVER[‘REMOTE_ADDR’] ?>
<?php
if( isset($_SERVER[‘X_FORWARDER_FOR’]) ) echo “Proxy’s IP-address: “.$_SERVER[‘X_FORWARDER_FOR’].””;
?></p>
</form>
</div>

⇓ витягнути частинку коду

<p class=”text”>Ваш ip адрес:<?php echo $_SERVER[‘REMOTE_ADDR’] ?>

<?php
if(isset($_SERVER[‘X_FORWARDER_FOR’]))echo”Proxy’sIP-address: “.$_SERVER[‘X_FORWARDER_FOR’].””;
?></p>

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

zura-blog ip2

ще один скрипт рнр

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

<?php
$date_today = date("d | m | Y"); // день місяць рік
$today = date("g:i:s");
echo("Ви зайшли на сайт: $date_today в : $today .");//Виводимо дату і годину:
?>

Якщо створюєте каскадні таблиці стилей CCS в окремому файлі, то звичайно що потрібно буде прописати лінк, щоб підєднати до сторінки

<link href=”css/style.css” rel=”stylesheet” type=”text/css” >

css — папка style.css — назва файлу, і якщо в когось з вас взагалі нічого не буде виходити із за ще недостатньої практики в веб дизайні, то просто пропишіть код скрипта який виводить  ір – адресу, без всяких там фонових картинок 

<?php
echo $_SERVER[‘REMOTE_ADDR’]
?>

Саме відобразяться тільки числа, зверху зліва, і обовязково зберегти файл з розширенням рнр, результат скрипта можна буде побачити в себе на компютері тільки за однієї умови, маючи в наявності локальний сервер і запустивши його.

Все, до зустрічі !


user_97

Публікації які стосуються скриптів інформерів, вони показують цікаву інформацію, приклад на Zura – Blog меню зліва.