Вторник, 12.12.2017, 14:56


Вниз Главная Регистрация RSS
Приветствую Вас, Гость


Радио ТРАНС
Игротека
Наш опрос
Оцените мой сайт
Всего ответов: 88
Статистика
Яндекс.Метрика Яндекс.Метрика

Онлайн всего: 1
Гостей: 1
Пользователей: 0
Друзья сайта
Главная » Статьи » Уроки по Укос

Как добавить текст в HTML Код сайта


Веб Мастеру [2]Ликбез [2]
Партнерки [2]Полезности [11]
Уроки по Укос [7]Фоны [1]
Windows [4]WordPress [1]
Мои статьи [3]3 [0]




Как добавить свой текст в дизайн сайта, что бы его было видно на любой странице сайта?

Небольшой урок начинающему ВебМастеру.

Чтобы нужный текст был виден везде и всем на вашем сайте, часто такой текст размещают в футере (подвале) сайта.
  • Например предупреждение о том что все права на информацию с вашего сайта, принадлежат вам и защищены законодательством. И что копирование разрешено только при соблюдении ваших условий. Или копирование вообще запрещено.
  • Так же внизу сайта можно разместить ваши информеры
  • Статистику или меню
  • Ссылку картинку - Вверх (в начало) страницы
  • Рекламный код
  • Таким же способом можно добавить - баннер, картинку, ссылку и т.д.
  • Ну и много разной другой полезной информации

Как разместить нужную информацию в коде сайта и не сломать код?

1. Сразу заходим в Панель Управления сайтом (далее ПУ)
ПУ - Дизайн - Управление дизайном - нижняя часть сайта -  вам откроется страница с HTML кодом нижней части вашего сайта.

На фото HTML код низ (футер) сайта
В каждой теме (дизайне) сайта Код HTML конечно разный, но суть одна.
Код выглядит примерно так же в каждой теме (дизайне) сайта.
Не стоит сразу пугаться кучи непонятных значков, но с ними нужно быть поаккуратнее, иначе у вас может что нибудь вообще исчезнуть, или сайт "поведет".

Поэтому перед тем как начать что либо редактировать или добавлять в любой код, рекомендуется сохранить оригинал HTML этой страницы в обычном блокноте.
Тогда если что то и пойдет не по плану, то всегда можно будет восстановить оригинал.

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

2. Что НЕЛЬЗЯ трогать в коде -
Во первых, нельзя разбивать-дробить код и вставлять лишнее внутрь этого кода.
Например  <td valign="top" style="padding:10px;"></td> 
Внутри такого кода <...можно изменять-добавлять значения стиля.../> и т.д., но вставлять в этот код, другой  HTML код категорически не стоит.
То, что находится в этих скобках <...kod, teg .../>  это уже тег, который работает и вставлять туда лишнее не надо.
Еще, если часто код очень длинный, и его хочется перенести на следующую строку, что бы лучше его видно было, то:
То, что находится в этих тегах <.../>  разрывать так же нужно аккуратно (а лучше их пока, не трогать, не разрывать), иначе сайт так же может "поломаться" или его "поведет"
Поэтому после каждого изменения, сохраняйтесь и проверяйте-обновляйте страницу сайта, что бы сразу заметить если что то "поломалось" и тогда можно будет просто отменить последние изменения

Для того что бы получить начальные знания по этим HTML тегам, рекомендую легкий и простой учебник по HTML для чайников скачать его можно здесь на сайте -

1. Мини-Учебник по HTML  


во вторых, даже случайно, не удалите вот этот тег - $POWERED_BY$, а то Укос сильно обидится и закроет ваш сайт навсегда.


3. Ну а теперь самое интересное, начинаем вставлять то, что нам хочется в низ сайта.

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

Совет:
Между "родным" кодом дизайна и вашим вставленным текстом (кодом), рекомендуется оставить несколько пустого места, что бы они для вас не сливались в одно общее целое.

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

Ниже расположен второй вариант - здесь текст уже отредактирован в редакторе т.к. мне захотелось.

Как сделать текст с ХТМЛ кодом, быстро и просто.


Вы думаете я хорошо знаю ХТМЛ коды и пишу их от руки? нет, я их вообще не знаю...
Это можно сделать проще:

На сайте выбираем функцию -
  • Добавить материал, в поле добавления материала пишем наш текст (ставим картинку, ссылку и т.д.) и
  • оформляем его так как нам нужно.
  • Затем открываем редактор исходного кода
  • Копируем получившийся готовый HTML код и вставляем его в HTML редактор низа сайта
на фото это хорошо видно.

Таким же способом можно поставить
  • любую картинку
  • сделать текст с активной ссылкой
  • Можно сделать таблицу с рамкой
  • изменить фон под вашим текстовым сообщением
  • и т.д. и т.п.

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

Картинка слилась с фоном сайта, но ее все таки видно ))




Для наглядности, посмотрим код низа сайта который стоит сейчас на сайте.



  Стрелка 1 - это код двух установленных информеров $MYINF_3$ и $MYINF_4$
  • Информер $MYINF_3$ "Самое популярное" это информер каталога файлов, сортировка установлена по популярности 1 колонка.
  •  Информер $MYINF_4$ "Новое на сайте" - так же информер каталога файлов, сортировка по дате добавления материалов - 1 колонка.
  • Можно создавать и другие информеры для каталога статей, блога и т.д.

Почему код для этих двух информеров такой длинный?

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

Оформление конечно может быть абсолютно разным, на ваш вкус и желание. Здесь просто пример.

Если информеры создать в 2-3 колонки, то можно будет их просто расположить рядом и не использовать таблицу.

Тогда можно использовать сразу несколько разных информеров

$MYINF_1$

$MYINF_2$

$MYINF_10$.....

они сами расположатся в 2-3 колонки.

Стрелка 2 - Это код текста, который находится внизу нашего сайта.

Так же добавлен и отредактирован через форму добавления материалов на сайте.

Стрелка 3 -  Это "родной" основной код низа сайта, который стоит по умолчанию.

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

Хотя иногда и можно и нужно, например внизу для экономии места можно разместить все меню сайта.

Еще два кода установленных внизу сайта

Плюс в дизайне сайта в самом низу стоит маленький баннер, на сайт где можно сделать иконку для своего сайта и стрелка "Вверх"

И в этом случае я не стала лезть в основной код футера.

Так же интером опустилась на несколько строк ниже основного кода сайта и просто вставила код баннера и код картинки вверх.

Код ссылки - картинки вверх

[ <a href="#">
 <img src="http://img-fotki.yandex.ru/get/26/50730026.8b/0_128187_1d2bae0d_XS.jpg"
 alt="Вверх" height="64" width="64"></a> ]


knopka_vverkh 0.png foot 1.pngfoot.png

  • Что бы установить другую картинку нужно изменить в коде - Адрес картинки, остальной код работает на любом сайте. 
  • Также нужно будет изменить в коде на размеры реальной картинки, здесь картинка 64 на 64 - height="64" width="64"
  • Код Вниз, с другой картинкой, ее размеры 32 на 64 - height="32" width="64"

Есть также и код картинки "Вниз", но он работает не на всех сайтах Укоса, видимо это зависит от выбранного дизайна сайта.

На этом сайте, код "Вниз" не работает.

[ <a href="#footer">
    <img src="http://img-fotki.yandex.ru/get/4424/50730026.81/0_12297b_7c679b90_XS"
    alt="Вниз" align="left" height="32" width="64"></a> ]

При копировании и добавлении кода к себе на сайт, скобки [.....]  нужно удалить.

Еще ниже стоит код Баннера

Код баннера на сайт с иконками закрыт тегами - <noindex>....</noindex> это для оптимизации сайта, что бы не было лишних исходящих ссылок с вашего ресурса.

Здесь на сайте эти два кода расположены в одну строку, что бы они были не рядом, а друг над другом, нужно между ними поставить тег <br> это перенос на другую строку.

такой тег ставится часто между кодами и любой информацией.

если редактировать код стразу в - добавлении материалов, то этот и другие нужные теги выставятся сами.


Здесь рассмотрены самые простые и доступные варианты размещения дополнительных кодов в HTML коде сайта.




Категория: Уроки по Укос | Добавил: Fantom (18.02.2012)
Просмотров: 13875 | Комментарии: 1 | Рейтинг: 5.0/ 2
Всего комментариев: 1
1  
СПАСИБО!!!
Очень полезная инфа!
Это то что я давно ищу!!!!

Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]

 

Новое на сайте

 

Самое популярное

 

 Коды скрипты

Случайная статья

  • Cities XL Platinum 2013 73
  • Чудо ферма \ Virtual farm 87
  • Именем короля 3. Коллекционное издание 89
  • Браузер Maxthon 189
  • Download Master 5.12.1.1283 178
  • Articles – лучшая Wikipedia в кармане 173
  • Улесье. Коллекционное издание 148
  • RIFT – многопользовательская онлайн игра 203
  • Будущее настоящего прошлого_скачать 336
  • Darck Orbit – браузерная игра 194
  • iSendSMS - для отправки SMS и MMS 228
  • Lunascape 6.2 Универсальный браузер 184
  • XnView Full-один из лучших просмотрщиков -конверторов графических файлов 214
  • Графический редактор PhotoFiltre 222
  • FileZilla — лучший бесплатный FTP-менеджер 195

  • Govorilka 3.1 Rus Говорун_Скачать бесплатно 29887
  • FrontPage 2003 Русская версия 11650
  • Игра "Фараон и Клеопатра" скачать бесплатно 6895
  • Mozilla Firefox 8.0.1 - русская версия скачать 4211
  • Новый Супер Марио 4128
  • Игра в Длинные нарды 4053
  • Медитация для привлечения Любви 3761
  • Сборник_Программа настроев Г.Н.Сытина скачать 2906
  • FFrontPage 2007 Русская версия 2831
  • Авто выключение компьютера_WinMend Auto Shutdown 2662
  • Астрон Дизайн - 3D моделирование Вашего дома 2114
  • Спец эффекты с ВебКамерой 2094
  • Штука - игра в карты 1788
  • Если хочешь быть счастливым - Литвак Михаил 1532
  • Программа для быстрого создания Flash-анимации 1522

  • Как сделать топ пользователей,по количеству файлов,и постов 274
  • Еще один вид опросов 278
  • Отображаем информацию ваш браузер на uCoz 367
  • Оригинальный вид опроса ucoz 311
  • Красивый блок радио для ucoz 282
  • Красивая статистика для uCoz 352
  • Переводчик для сайта (PROMT) 300
  • Аудиоплеер с плейлистом для mp3 музыки 374
  • Новая форма опроса для ucoz 412
  • Красивый информер Лучших пользователей 330
  • Топ пользователей для ucoz 388
  • Блок нужные программы 269
  • Скрипт войти на сайт в углу странички 286
  • Белый плеер с плейлистом 424
  • Steel Battalion Heavy Armor Новая жизнь Kinect 620

  • Кнопка "Вверх" для сайта, блога или форума 267
  • Коте для вашего сайта 267
  • Cоц. закладки для сайта 267
  • Пожертвование на развитие сайта. 267
  • Перевод на другие языки для uCoz 267
  • Топ пользователей для сайта ucoz 268
  • Перевод сайта на 7 языков 268
  • Скрипт статистика сайта для uCuz 268

  • LinguaLeo – учим английские слова в дороге 385
  • Artweave - бесплатный графический редактор 289
  • Астрон Дизайн - 3D моделирование Вашего дома 2114
  • Формула богатства-Рене Эгли 477
  • Браузерная онлайн игра MyLands 180
  • RIFT – многопользовательская онлайн игра 203
  • Именем короля 3. Коллекционное издание 89


  • Внимание!

    ВСЕ скачанные файлы с интернета, (и с нашего сайта, так же) перед запуском на своем компьютере рекомендуется ОБЯЗАТЕЛЬНО проверить Вашей антивирусной программой!
    Все файлы и программы взяты с интернет пространства.
    Администрация сайта не несет никакой ответственности за использование и последствия данных программ и файлов

    Вверх Главная Регистрация RSS
    Приветствую Вас, Гость