Анонси записів wordpress, тег more, створення анонсів, цитати

1. Головна сторінка WordPress (статична або анонси)
2. Тег more WordPress
3. Унікальний тег more в Вордпресс
5. Змінити зовнішній вигляд кнопки «читати далі» WordPress (тега more)
6. Стандартні анонси записів WordPress (самообрезающіеся)
7. Як прибрати стандартні анонси записів WordPress
8. Унікальні анонси - функція «Цитата WordPress»

Наша взаимовыгодная связь https://banwar.org/

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

Сьогодні ми навчимося створювати такі анонси і оформляти кнопку «читати далі». Найзручніше створювати анонси за допомогою тегаmore, але ми розглянемо так само й інші способи.

Зміст статті:

Головна сторінка WordPress (статична або анонси)

Для початку хочу зауважити, що зміст головної сторінки в WordPress можна налаштувати через адмінку. Можливі два варіанти головною:

• Останні записи
• Будь-яка, обрана вами сторінка

Налаштовується це в розділі «Параметри» -> «Читання»:

Тут же можна вказати максимальну кількість анонсів на головній сторінці: "На сторінках блогу відображати не більше".

Тег more WordPress

Для того, щоб створити анонс статті даними способом, потрібно натиснути кнопку «Вставити тег Далі» візуального редактора (якщо ви з ним ще не подружилися, читайте про те, як налаштувати і використовувати візуальний редактор в WordPress ):

Ця кнопка додасть в код статті тег <! - more ->. Весь текст, який знаходиться до цього тега стане анотацією. Перевіряйте, що все теги анотації закриті, інакше можуть з'явитися помилки при виведенні анонса в RSS стрічку.

Унікальний тег more в Вордпресс

Буде здорово прописувати унікальний тег more для кожного поста. Адже тоді після анонса буде відображатися посилання з потрібним вам анкором, наприклад, з прямим входженням ключового слова. А це корисно для просування.

Зробити це легко. Перейдіть в режим «Текст» і припишіть якусь фразу впритул до слова «more» в тезі: <! - moreЧітать про тегах more і не тільки ... -> (без пробілів!). Тепер замість стандартної посилання «читати далі», під вашим анонсом відобразиться цей тест.

Як прибрати посилання читати далі в wordpress або змінити її текст

Зараз ми знайдемо файл, який відповідає за виведення тега more (посилання «читати далі»). Якщо ви хочете відредагувати текст кнопки «read more» (прибрати висновок тексту «читати далі», замінивши його чимось своїм):

1. Відредагуйте по черзі файли теми index.php і archive.php. Якщо ви не вмієте редагувати файли шаблону WordPress, читайте статтю .
2. У цих файлах знайдіть код <? Php the_content ( 'Читати далі & raquo;'); ?>, Він може виглядати інакше, тому зручніше скористатися пошуком по ключу "the_content (".
3. Замініть текст «читати далі» на свій. Ви можете додати на заслання заголовок поста: <? Php the_content ( "Продовжити читання". The_title ( '', '', false)); ?>

   <? Php the_content ( "Продовжити читання". The_title ( '', '', false)); ?>

Залежно від встановленої теми, даний код може знаходитися і в інших файлах, тоді пошукайте його у всіх інших php-файлах теми.

Змінити зовнішній вигляд кнопки «читати далі» WordPress (тега more)

Якщо ви хочете оформити посилання «читати далі» у вигляді кнопки, необхідно відредагувати файл теми styles.css. Знайдіть в ньому клас «.more-link», якщо такого немає, то просто допишіть один з наведених кодів в кінці.

Як завжди приведу кілька прикладів з коментарями до коду

1. Кнопка як у мене

1 2 3 4 5 6 7 8 9 10 11 12 13 .more-link {background: none repeat scroll 0 0 # 00B37C; / * Колір фону * / border: 1px solid # 62901E; / * Товщина і колір меж * / border-radius: 5px; / * Закруглені краї * / color: #FFFFFF; / * Колір шрифту * / display: block; font-family: verdana; font-size: 12px; line-height: 12px; padding: 8px 14px; text-decoration: none; text-transform: uppercase; / * Текст в верхньому регістрі * /}

.more-link {background: none repeat scroll 0 0 # 00B37C; / * Колір фону * / border: 1px solid # 62901E; / * Товщина і колір меж * / border-radius: 5px; / * Закруглені краї * / color: #FFFFFF; / * Колір шрифту * / display: block; font-family: verdana; font-size: 12px; line-height: 12px; padding: 8px 14px; text-decoration: none; text-transform: uppercase; / * Текст в верхньому регістрі * /}

2. Плоска кнопка

1 2 3 4 5 6 7 8 9 10 11 .more-link {background: none repeat scroll 0 0 # E81D1D; color: #FFFFFF; display: block; font-family: verdana; font-size: 12px; / * Розмір шрифту * / font-weight: bold; / * Жирний шрифт * / line-height: 12px; padding: 8px 14px; / * Внутрішні відступи * / text-decoration: none; }

.more-link {background: none repeat scroll 0 0 # E81D1D; color: #FFFFFF; display: block; font-family: verdana; font-size: 12px; / * Розмір шрифту * / font-weight: bold; / * Жирний шрифт * / line-height: 12px; padding: 8px 14px; / * Внутрішні відступи * / text-decoration: none; }

3. Кнопка з тінню і градієнтом

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 .more-link {background: linear-gradient (# DD1D1D, # A61518) repeat scroll 0 0 rgba (0, 0, 0 , 0); / * Градієнт * / border-radius: 4px; box-shadow: 0 1px 2px 0 rgba (0, 0, 0, 0.7); / * Тінь * / color: #FFFFFF; font-size: 16px; font-weight: bold; height: 40px; line-height: 40px; text-align: center; / * Вирівнювання по центру * / width: 155px; / * Ширина кнопки * / / * кроссбраузерность: * / background: -ms-linear-gradient (# DD1D1D, # A61518); / * IE10 * / background: -webkit-gradient (linear, left top, left bottom, color-stop (0%, # DD1D1D), color-stop (100%, # A61518)); / * Safari 4+, Chrome 2+ * / background: -webkit-linear-gradient (# DD1D1D, # A61518); / * Safari 5.1+, Chrome 10+ * / background: -o-linear-gradient (# DD1D1D, # A61518); / * Opera 11.10 * / filter: progid: DXImageTransform .Microsoft .gradient (startColorstr = '# DD1D1D', endColorstr = '# A61518'); / * IE6 & IE7 * / -ms-filter: "progid: DXImageTransform.Microsoft.gradient (startColorstr = '# DD1D1D', endColorstr = '# A61518')"; / * IE8 + * / -moz-border-radius: 4px; / * Firefox * / -webkit-border-radius: 4px; / * Safari, Chrome * / -khtml-border-radius: 4px; / * KHTML * /}

.more-link {background: linear-gradient (# DD1D1D, # A61518) repeat scroll 0 0 rgba (0, 0, 0, 0); / * Градієнт * / border-radius: 4px; box-shadow: 0 1px 2px 0 rgba (0, 0, 0, 0.7); / * Тінь * / color: #FFFFFF; font-size: 16px; font-weight: bold; height: 40px; line-height: 40px; text-align: center; / * Вирівнювання по центру * / width: 155px; / * Ширина кнопки * / / * кроссбраузерность: * / background: -ms-linear-gradient (# DD1D1D, # A61518); / * IE10 * / background: -webkit-gradient (linear, left top, left bottom, color-stop (0%, # DD1D1D), color-stop (100%, # A61518)); / * Safari 4+, Chrome 2+ * / background: -webkit-linear-gradient (# DD1D1D, # A61518); / * Safari 5.1+, Chrome 10+ * / background: -o-linear-gradient (# DD1D1D, # A61518); / * Opera 11.10 * / filter: progid: DXImageTransform.Microsoft.gradient (startColorstr = '# DD1D1D', endColorstr = '# A61518'); / * IE6 & IE7 * / -ms-filter: "progid: DXImageTransform.Microsoft.gradient (startColorstr = '# DD1D1D', endColorstr = '# A61518')"; / * IE8 + * / -moz-border-radius: 4px; / * Firefox * / -webkit-border-radius: 4px; / * Safari, Chrome * / -khtml-border-radius: 4px; / * KHTML * /}

Стандартні анонси записів WordPress (самообрезающіеся)

WordPress може створювати анонси автоматично, без використання тега more. У цьому випадку стаття просто обрізається після певного числа слів (55 за замовчуванням). Такий варіант може здатися зручним тим, що все робиться автоматично і не потрібно задуматися про тезі more. Однак, такі анонси виглядають не красиво і я не раджу їх використовувати. Набагато зручніше самому вирішувати після якої фрази обрубувати анонс.

Відповідає за такі анонси рядок <? Php the_excerpt ()?> В коді.

Як прибрати стандартні анонси записів WordPress

Якщо ви встановили тему, в якій за замовчуванням використовуються стандартні анонси і хочете від них позбутися:

1. Відредагуйте по черзі файли теми index.php і archive.php. Якщо ви не вмієте редагувати файли, читайте статтю . Іноді цей код може знаходитися і в інших файлах теми, шукайте його.
2. Знайдіть в цих файлах код <? Php the_excerpt ()?> І видаліть його. Або замініть на <? Php the_content ( 'Читати далі & raquo;'); ?>, Щоб відразу додати висновок тега more.

Унікальні анонси - функція «Цитата WordPress»

Мова піде не про тих цитатах, які використовуються в тексті для цитування чужих думок - про це тут .

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

Якщо і ви так вважаєте і вам не лінь кожен раз писати унікальні анонси, читайте як це реалізувати.

1. Увімкніть функцію «Цитата». Для цього натисніть кнопку «налаштування екрану» в правому верхньому кутку і відзначте галочкою «Цитату».
   
2. Тепер під текстом статті з'явилося поле «Цитата», куди потрібно вводити унікальний текст анонса.
   
3. Щоб цита ти заробили, потрібно налаштувати в шаблоні стандартні анонси, тобто додати код <? php the_excerpt ()?> замість <? php the_content ( ''); ?>. Детальніше про стандартні анонсах читайте вище .

На мій погляд, стаття про анонси і посилання «читати далі» вийшла вичерпної. Ми розглянули всі можливі варіанти настройки анонсів і тег а more. Сподіваюся, це буде корисно!