Содержание
Сегодня статья о таком тэге, как тэг «More» или «Читать далее», «Читать полностью» — в разных темах он имеет разную русскую надпись.
Для чего этот тег?
Допустим, вы написали запись в одной из рубрик на своём сайте. Запись получилась большая и на главной странице она занимает очень много места, а нам хотелось, предположим, чтобы на главной было видно лишь некоторую часть от этой записи. Реализовать это как раз таки может наш тег «More».
Использовать его очень просто — при написании статьи, если вы писали её в визуальном редакторе (визуально), следует перейти в режим HTML и в нужное место вставить тег «more», который находится на верхней панели html-редактора.
Сохраняем запись, переходим на главную страницу сайта и любуемся компактностью и функциональностью главной страницы.
Не русифицированный шаблон?
Что делать, если тема сайта на вордпресс, которую вы используете, не русифицирована и тэг «more» так и выводиться, а нам хотелось бы, чтобы вместо этой надписи было что-то вроде «Читать далее», или «Читать полностью» или любой другой вариант?
Делать нужно вот что:
1) Зайти в консоль управления вашим сайтом;
2) Открыть редактор: «внешний вид» — «редактор»;
3) Найти справа файл index.php и щёлкнуть на него, тем самым открыв на редактирование код данного файла;
4) Найти коде файла следующие строки:
<div class="entry"> <?php the_content('More »'); ?> </div>
Тем самым мы нашли тэг «More»;
5) Теперь пишем вместо текста More свой. К примеру, «Читать далее». Должно получиться так:
<div class="entry"> <?php the_content('Читать далее »'); ?> </div>
Обновляем файл index.php (основной шаблон) нажатием кнопки «Обновить файл» и любуемся результатом.
Определяем класс надписи «Читать полностью»
Чтобы продолжить улучшать тэг «More» нам нужно узнать класс самой надписи. Для этого открываем наш сайт и смотрим на исходный код. В браузере Opera, исходный код можно посмотреть, нажав на страницу правой кнопкой мыши и выбрав «Исходный код». Открывать нужно главную страницу сайта, там где есть уже использованный тег «More».
Ищем в коде примерно следующее:
<p> <a href="http://gannforex.ru/o-teorii-ganna.html#more-21" class="more-link">Читать полностью »</a></p>
Видим, что используется класс «more-link». Отлично! Теперь осталось только его улучшить, задав нужный стиль этому классу.
Задаём стиль для «More»
Чтобы задать стиль для найденного класса, нам нужно опять зайти в редактор кода и открыть на редактирование файл «Таблица стилей». Открываем и прописываем в конец кода этого файла примерно следующее:
.more-link { float: right;/*показывать справа поста*/ border: 1px dotted #000000;/* толщина вид цвет границы*/ padding-top: 5px;/* отступ текста от границы сверху*/ padding-right: 10px; /* отступ справа*/ padding-bottom: 5px;/*отступ снизу*/ padding-left: 10px;/*отступ слева*/ background-color: #e2e2e2;/*цвет фона*/ }
Нажимаем обновить файл и любуемся улучшенной ссылкой «Читать далее»!
Вот спасибо вам- всё просто и понятно! Я стили немного другие прописал, а так - отличная, полезная информация! Спасибо!