Редактирование первой страницы сайта по набору рефералов

(Продолжение. Предыдущий материал см. здесь.)

Постановка задачи

Сейчас переделаем наш знакомый сайт www.referonix.16mb.com. Если Вы еще не скачали себе файлы этого сайта, то скачивайте их здесь. Скаченный архив распаковываем в какую-нибудь папку у себя на компьютере. В архиве находятся четыре файла: index.html, partner.html, useful.html и news.html (и еще два графических файла с портретом Пушкина и с графическим знаком рубля). Это и есть четыре веб-страницы этого сайта (и картинки к ним).

Ваша задача состоит в том, чтобы сначала переделать эти страницы для себя и потом закинуть их в Интернет на хостинг hostinger.ru в тот аккаунт, который Вы уже зарегистрировали для Ваших сайтов. Как организовать свой аккаунт на hostinger.ru и закинуть туда файлы своего сайта, Вы уже знаете. Всё это делается точно также, как описано здесь. Поэтому сейчас не буду повторять, как сайт заселяется на hostinger.ru. Главное для нас, посмотреть, что нужно исправить в файлах веб-страниц.

Если Вы не знаете язык HTML, которым делают разметку содержимого вэб-страниц, то следующий материал в этом письме для Вас будет очень важным. Я очень подробно расскажу и научу, как это делается на примере этого простого учебного сайта с очень примитивным дизайном. А потом Вы получите от меня файлы четырех очень профессиональных настоящих шаблонов сайтов по набору рефералов, которые создали настоящие профессионалы.

Вот эти четыре профессиональных сайта Вы и будете использовать в своей работе. Но обучение мы подробно проведем на файлах простого учебного сайта.

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

Что означает переделать файлы "под себя"? Это значит, что в этих файлах надо заменить ВСЕ чужие реферальные ссылки на свои реферальные ссылки и добавить свои подробные описания сайтов заработка. А также переделать все чужие рекламные блоки на свои (или просто почистить сайт от чужих рекламных блоков).

Методы решения

Вы можете делать правку этого файла двумя способами:

• Через визуальный редактор. Этот способ подойдет тем, кто, вообще, не разбирается в HTML-кодах и пока не желает разбираться в них.
• Через редактор кодов. Этот способ подойдет тем, кто хоть немного понимает HTML-коды.

В первом случае Вам надо:

1. скопировать из файла вэб-страницы часть нужного кода
2. вставить эту часть кода в визуальный редактор в режиме редактирования кодов
3. перейти с режима редактирования кодов на режим визуального редактирования
4. сделать нужные исправления
5. перейти снова в режим редактирования кодов
6. скопировать сгенерированный код
7. вставить этот код в точно то же самое место в файле вэб-страницы, откуда первоначально копировали старый код
8. сохранить на диске компьютера измененный файл веб-страницы

Во втором случае Вам надо:

1. загрузить весь файл вэб-страницы в какой-нибудь редактор HTML-кодов
2. найти в кодах нужные места, которые надо исправить
3. сделать нужные исправления
4. сохранить получившийся файл вэб-страницы

Как видите, вторым способом всё делается быстрее и проще. Поэтому лучше всё-таки хоть немного разбираться в HTML.

Если Вы выбираете визуальный способ, то рекомендуется пользоваться или очень мощным онлайновым конвертором вэб-страниц в HTML-коды (его описание см. здесь) или установить на свой компьютер бесплатный визуальный редактор NVU.

А если Вы выбираете редактирование напрямую в кодах HTML, то можете использовать обычный Блокнот (NotePad) из операционной системы Windows, или установить на свой компьютер более мощные бесплатные редакторы HTML-кодов, такие, как Редактор HTMLReader или Редактор NotePad++. (Их бесплатно скачиваем там же, где и редактор NVU, см. ссылку выше.)

Везде далее Вам будут показаны оба варианта того, куда надо будет внести изменения.

Редактирование финстрипа

Начнем с файла главной страницы сайта - index.html. Сначала изменим финстрип.

Находим в файле index.html следующий блок html-кодов с финстрипом.

Здесь синим цветом выделены чужие партнерские ссылки, которые Вы должны заменить на свои. А красным цветом выделены тексты, которые Вам тоже надо заменить на свои. Обратите внимание, что одни партнерки выплачивают заработок в долларах, а другие в рублях. Знак доллара ставится обычным текстом на клавиатуре (см. на клавише "4"), а знак рубля невозможно ввести с клавиатуры и поэтому он ставится в виде картинки. Коды этих картинок знака рубля помечены зелёным цветом. Вы должны хорошо знать, какие Ваши сайты заработка в чем выплачивают деньги и правильно расставить все знаки рубля и доллара. Вот так это всё делается напрямую в кодах HTML.

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

На битые картинки знака рубля пока не обращаем внимание. Для изменения ссылки выделяем какую-нибудь ссылку и нажимаем на кнопку "Добавить/Изменить ссылку". В открывшемся окне нужно изменить только Адрес на Вашу реферальную ссылку.

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

Итак, меняем все чужие реферальные ссылки на свои, меняем (если нужно) названия сайтов заработка на свои, меняем даты, суммы выплат и (если нужно) переставляем картинки знака рубля. Путь до картинки рубля оставляем относительным, то есть, указываем только имя файла ruble.png.

Для вставки картинки в данном визуальном редакторе используется кнопка "Добавить/Изменить изображение". А если эта картинка уже есть на вэб-странице (а на этой странице уже есть несколько картинок файла ruble.png), то в визуальном редакторе картинки вставляются и переставляются очень легко. Надо выделить картинку, нажать на Ctrl+X, если надо переставить картинку. Или нажать Ctrl+C, если надо копировать картинку. Затем поставить курсор в нужное место и нажать Ctrl+V. Картинка вставится в нужное место.

После того, как изображение блока выплат будет готово, снова нажимаем на кнопку "HTML", копируем весь полученный код из окошечка HTML и вставляем его вместо первоначального куска кода в файле index.html. И сохраняем этот файл на диске Вашего компьютера. Как видите, ничего сложного!

Редактирование контактов

Теперь точно также находим в файле index.html кусок кода с контактными данными. Вот он.

------------------------------------------------------

<p align="left"><i>Контакты:</i></p>
<table>
  <tr>
    <td><img src="photo.jpg"></td>
      <!--Далее следуют ваши контакты, замените их на свои реальные данные.
Такие изменения должны быть
        произведены на каждой странице сайта.
      Для замены вашей фотографии достаточно - заменить файл photo.jpg,
на ваше фото размером
        100px*130px-->
    <td><font size="-1">Александр Сергеевич Пушкин<br>
      Тел.: 8(913)000-00-00<br />
      e-mail: <a href="mailto:mail@mail.ru">mail@mail.ru</a><br />
      ICQ: 555-555-555<br />
      WMID: 111111111111</font>
    </td>
  </tr>
</table>

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

А если Вы работаете в визуальном редакторе, то копируйте этот кусок кода в редактор. Получаем следующее.

Картинку не трогаем, а всё остальное меняем так, как Вам нужно. Адрес электронной почты меняется точно также, как до этого в финстрипе меняли ссылки. То есть надо поменять и адрес и его вид на экране. Для изменения адреса ставим курсор на ссылку на электронную почту и нажимаем на кнопку "Добавить/Изменить ссылку". В открывшемся окне нужно изменить только Адрес на Вашу электронную почту.

Слово mailto: ни в коем случае не меняйте и не удаляйте. Изображение на экране электронного адреса тоже надо поменять. Кстати, совсем не обязательно, чтобы вид на экране совпадал с написанием электронного адреса. Там, например, можно написать фразу типа "Пишите мне!" или что-нибудь подобное.

И, как обычно, копируем полученный кусок кода вместо старого кода в файле index.html и снова сохраняем этот файл у себя в компьютере.

Редактирование рекламного блока

Теперь отредактируем рекламный блок. Для этого находим в файле index.html следующий код.

------------------------------------------------------

<!-- Место под рекламу, Ваш рекламный код.-->
<p align="left"><font size="-1">(Разместите вместо этого текста - код,
полученный от рекламного брокера.
    Рекомендуется к использованию
<a href="http://king.nanoquant.ru/simple.html" target="_blank">TAK</a> либо
    <a href="http://king.nanoquant.ru/simple1.html" target="_blank">
WMLINK</a>.)</p>
<p align="left"><font size="-1"><script language="JavaScript"
src="http://r1.wmlink.ru/?id=322203"></script></p>
<!--Конец места под рекламу-->

Итак, у Вас два варианта. Или полностью удалить весь этот блок или вставить туда Ваш рекламный блок.

Если Вы решили вставить туда свой рекламный блок, тогда нужно удалить, всё, что выделено синим цветом. Это поясняющий материал. А заменить нужно то, что выделено красным цветом, на тот код, который Вы получите в своем аккаунте в рекламной бирже.

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

Редактирование центральной части

в файле index.html остается переделать еще центральную часть. Это таблица в средней колонке. Вот html-код таблицы в центральной части.

Синим цветом выделены чужие реферальные ссылки, которые Вы должны заменить на свои. Красным цветом выделены тексты, которые Вы меняете на свои или оставляете, как есть, если Ваша реферальная ссылка относится к тому же самому сайту заработка. Колонку комментариев надо обязательно дополнить еще несколькими своими предложениями с описанием сайтов заработка. Здесь в шаблоне всё написано по миниму только для примера.

Если Вы работаете с визуальным редактором, то делаете всё точно также, как и в случае редактирования таблицы финстрипа. Ничего принципиально нового здесь нет. Также копируете HTML-код на странице по предыдущей ссылке, загоняете его в визуальный редактор в режиме редактирования HTML, переключаетесь на визуальный режим, делаете необходимые изменения в визуальном режиме, переключаетесь в HTML-режим, чтобы скопировать сгенерированный код и вставляете этот код в файл index.html в то место, где находился старый код.

После всех сделанных изменений сохраняете окончательный вариант файла index.html и копируете его на хостинг. Не забудьте скопировать на хостинг также и фотографию "контактного лица" photo.jpg и графический знак рубля ruble.png.

Зайдите на свой сайт через браузер и наслаждайтесь результатом!

P.S. Спасибо, что дочитали до конца! Если Вы впервые сталкиваетесь с такими вещами, то материал этого урока и следующего может показаться трудным. Если Вы хотите более успешно справляться с трудным материалом для усвоения (любым, не только этим), то, возможно, Вам стоит почитать книгу "Подборка статей на тему личной продуктивности". Бесплатно скачать эту книгу можно ЗДЕСЬ. Надеюсь, это поможет.

(Продолжение см. здесь.)

------------------

Автор статьи: Евгений Миронов.

[0] Технология набора рефералов в Интернете
[1] Классификация способов привлечения рефералов
[2] Ответы на частые вопросы подписчиков учебного курса
[3] Где и как найти реферальные программы
[4] Преимущества и недостатки заработка на рефералах
[5] Реферальная империя
[6] Покупка и продажа рефералов
[7] Суть реферальной схемы заработка
[8] Кто такие рефералы и зачем они нужны
[9] Спам - путь, ведущий в тупик!
[10] Сердце технологии - сайт для набора рефералов
[11] Готовый учебный сайт для набора рефералов
[12] Редактирование первой страницы сайта по набору рефералов
[13] Редактирование других страниц сайта по набору рефералов
[14] Шаблоны профессиональных сайтов для набора рефералов