Первое, что я хочу сказать это то, что HTML не является языком программирования. HTML предназначен для создания и разметки всевозможных документов, в том числе и интернет-станиц. Вся разметка документа осуществляется с помощью тегов. ТЭГ-это угловые скобки с размещенными в нутрии буквами <html>. Тэги бывают открывающими <html> и закрывающими </html>, для переноса текста на другую строку <br>, для разметки цвета страниц и текста ну и так далее. Сейчас вам нужно усвоить малюсенький пример без которого ну ни как нельзя обойтись.
1. <html> и </html> это начало и конец документа.
2. <head> и </head> является головой документа.
3. <body> и </body> является телом документа – то есть текст, который вы напишите между этими тэгами.
4. <br> тэг переноса строки.
Надеюсь в принципе все понятно? Поехали дальше.
Откройте блокнот и скопируйте ниже приведенный пример:
<html>
<head>
<title>Разметка</title>
</head>
<body>
Этот пост не предназначен для обучения HTML. Здесь рассматривается конкретный момент разметки страниц в блоге. Первое, что я хочу сказать это то, что HTML не является языком программирования. HTML предназначен для создания и разметки всевозможных документов, в том числе и интернет-станиц.
</body>
</html>
Сохраните его под именем – Разметка.html в разделе: Файл-сохранить как.
Блокнот с текстом закрывать не надо.
Теперь откройте этот документ в Internet Explorer и вы увидите только сплошной текст и ни каких тэгов. Теперь в тексте поставите тэг <br> - это перенос на другую строчку, и сохраните текст: Файл-сохранить.
Обновите страницу в браузере. Теперь вы видите, что часть текста перешло на новую строчку.
Принцип разметки понятен. Теперь перейдем собственно, к разметке страницы в БЛОГЕ. После создания блога переходим в раздел Макет-изменить HTML и ставим галочку-расширить шаблоны виджета.
Скопируйте себе текст шаблона в блокнот и сохраните его. Если что то не получится, чтобы было из чего восстановить. Далее нажмите Ctrl+F, выскочет вот такое окошко «Поиск»
Введите в нем тэг </head> жмите «Найти далее» и он вам найдет в шаблоне этот тэг – это примерно одна треть шаблона. Перед этим тэгом вставите вот этот код:
<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>
Далее точно также находим в шаблоне строчку <data:post.body/>
Это примерно середина шаблона.
И после нее добавляем следующий код:
<b:if cond='data:blog.pageType != "item"'><br />
<a expr:href='data:post.url'>Читать далее</a>
</b:if>
Теперь на главной странице под «головой» текста будет отображаться ссылка, «Читать далее» которая будет открывать другую страницу со всем текстом.
Нажимаем кнопку «Сохранить шаблон» и переходим в пункт «Настройки» - «Форматирование».
В самом низу страницы, в окошке вносим вот этот код:
<span class="fullpost"></span>
И жмем «Сохранить настройки»
ТЕПЕРЬ ВНИМАТЕЛЬНО – как обращаться с этим кодом.
Голова <span class="fullpost"> Текст </span>
Там где написано «Голова» находится начальная часть текста с заголовком.
Там где написано «Текст» находится остальной текст. По какому принципу вы разделите текст вам решать. Хоть пополам :)
Теперь посмотрим, что получилось. Переходим к написанию поста, но прежде переходим в пункт «Изменить Html». Пишем новый пост и вставляем в него наш код как на изображении. И еще , если надо чтобы текст начинался с новой строки – вставляйте тэг <br>.
Вот что получилось.
Если нажать «Читать далее», то произойдет переход на другую страницу с полным постом.
PS. Кому нужны более полные знания по языку HTML, то в интернете - полно учебной литературы.
Комментариев нет:
Отправить комментарий