1. Начало
  2. WordPress
  3. Как да добавите информация за автора в WordPress публикации?

Как да добавите информация за автора в WordPress публикации?

Информация за автора е малка секция или блок, разположен обикновено след основното съдържание на публикацията. В този блок се показва информация за автора на статията – името, снимка, кратко описание и връзки към акаунти в социални мрежи.

Някои теми показват блока на автора, като използват вградената функционалност на WordPress. Други теми не добавят автоматично информация за автора към публикацията. В някои случаи може да желаете да промените начина, по който се визуализира секцията с информацията.

Защо информацията за автора е полезна?

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

За WordPress сайт с един автор на съдържание е по-удачно да се добави профилна страница About us, но за WordPress сайтове с много автори трябва да добавите информационно поле за автор под всяка публикация.

Публикуването на информация за авторите, особено с възможност за добавяне на линк към техните сайтове и социални акаунти, е сериозен стимул за много автори, които търсят експозиция и нова аудитория, да желаят да публикуват свои уникални статии във Вашия сайт.

А това е полезно и за двете страни – сайтът се превръща в авторитет в дадена област и съдържанието получава по-висок рейтинг от търсещите машини, а авторите увеличават своята популярност.

Освен всички други ползи, публикуването на информация за автора ще доведе трафик към Вашия сайт от читателите, които харесват и следват този автор.

В статията ще разгледаме различни начини за добавяне на информация за автор в WordPress с помощта на:

  • WordPress тема;
  • плъгин;
  • widget в страничната лента;
  • допълнителен код.

Добавяне на информация за автора в WordPress тема

Както споменахме в началото, някои WordPress теми автоматично добавят секция с информация за автора след съдържанието. Като пример може да посочим темата по подразбиране Twenty Twenty-One:

Секция с информация за автора в темата Twenty Twenty-One.
Секция с информация за автора в темата Twenty Twenty-One.

За да въведете информация за главния администратор на сайта, отворете Users » Profile от главното меню:

Въвеждане на профилна информация за администратор
Въвеждане на профилна информация за администратор.

Профилът на всеки допълнително създаден потребител може да отворите през Users » Username » Edit:

Линк към профилната страница на потребител
Линк към профилната страница на потребител.

Скролирайте докато достигнете секция About Yourself. В полето Biographical Info въведете кратка информация за автора. По желание може да въведете като HTML код връзка към сайта на автора или връзки към негови/нейни акаунти в социални мрежи.

Ако контактният имейл на потребителя е асоцииран с акаунт в Gravatar, WordPress автоматично ще зареди съответното изображение. В противен случай ще се зареди изображението по подразбиране, което се настройва в секция Default Avatar на панела Discussion Settings (Settings » Discussion):

Панел Default Avatar за настройване на аватари в WordPress
Панел Default Avatar за настройване на аватари в WordPress.

Ако Вашата WordPress тема не добавя информацията за автора към публикациите, може да използвате един от следващите методи за добавяне на информационно поле на автора.

Добавяне на информация за автора чрез плъгина Simple Author Box

Simple Author Box добавя адаптивна секция с информация за автора в края на Вашите публикации, с името на автора, gravatar изображение/икона на автора и кратка информация за автора.

Плъгинът също така може да добави над 30 полета за социални профили в настройките на потребителския профил на WordPress, което позволява да се показват връзки към социалните акаунти на автора.

Инсталирайте Simple Author Box по добре познатия начин – отворете Plugins » Add New, въведете в полето за търсене ключовата дума author и инсталирайте/активирайте плъгина през бутона Install Now/Activate:

Инсталиране на Simple Author Box в WordPress
Инсталиране на Simple Author Box в WordPress.

До настройките на плъгина може да достигнете по два начина:

1. През линка Settings срещу името на плъгина в таблицата с инсталираните плъгини:

Линк Settings в таблицата с инсталираните плъгини
Линк Settings в таблицата с инсталираните плъгини.

2. Като изберете Simple Author » Simple Author от главното меню:

Достъп до Simple Author Box през главното меню
Достъп до Simple Author Box през главното меню.

Панелът с настройки Simple Author Box съдържа две основни секции.

Изглед на панел с настройки Simple Author Box
Изглед на панел с настройки Simple Author Box.

През линковете в първата секция имате достъп в нов прозорец на браузъра до:

  • профилната страница на логнатия потребител (през Edit Author Profile);
  • до секция Custom User Profile Image (през Change Author Avatar), където може да смените изображението/аватара на автора;
  • до секция Social Media Links (през Add/Edit Social Media Icons), където може да добавите/редактирате достъпа до социалните акаунти на автора.

При инсталиране на плъгина, към обикновеното текстово поле Biographical Info в секция About Yourself е добавен текстов редактор с минимални функции, достатъчни за форматиране на информацията за автора:

Изглед на полето Biographical Info с редактор
Изглед на полето Biographical Info с редактор.

Simple Author Box позволява зареждане на изображение от Media Library през бутона Upload Image:

Зареждане на изображение от Media Library
Зареждане на изображение от Media Library.

За да редактирате съществуващ акаунт към социална мрежа, трябва да кликнете в менюто с името на социалния сайт (например Twitter) и да изберете друга социална мрежа. След това трябва да редактирате адреса на новия акаунт и да запазите промените като натиснете бутона Update Profile:

Редактиране на акаунт към социална мрежа
Редактиране на акаунт към социална мрежа.

За да добавите връзка към акаунт в социална мрежа, натиснете бутона +Add new social platform, изберете социалната мрежа от менюто Add This, въведете адреса на акаунта в полето и натиснете бутона Update Profile:

Добавяне на връзка към акаунт в социална мрежа
Добавяне на връзка към акаунт в социална мрежа.

За да изтриете връзка към социална мрежа, натиснете иконата със символ кошче отдясно на съответното поле.

Настройки на Simple Author Box

Втората секция съдържа няколко раздела с настройки, които ще разгледаме:

Общ изглед на разделите с настройки
Общ изглед на разделите с настройки.

Настройки в раздел Settings

Manually insert the Simple Author Box (ръчно вмъкване на Simple Author Box) – ако включите бутона (On), трябва ръчно да добавите Simple Author Box към публикациите – като копирате кода от първото поле и го поставите в темплейт файла single.php или като поставите краткия код [simple-author-box] в края на съответната статия в редактора.

Настройки в раздел Settings
Настройки в раздел Settings.
  • Hide the author box if author description is empty – скрива секцията информация за автора ако полето за информация е празно.
  • Show author email – показва имейл адреса на автора (най-краткия път до спам базите данни, в никакъв случай не препоръчаме да се активира настройката).
  • Open social icon links in a new tab – добре е да се активира опцията, тъй като посетителите ще разгледат акаунта без да се затвори страницата от Вашия сайт.
  • Hide the social icons on author box – скриване на иконите към социалните мрежи;
  • Hide the author box on archives – скриване на информацията за автора в архивните страници (препоръчаме опцията да не се активира).

Настройки в раздел Appearance

Настройки в раздел Appearance
Настройки в раздел Appearance.

Настройки в първите две полета Top margin of author box и Bottom margin of author box определят разстоянието отгоре и отдолу до съседните външни елементи в дизайна на публикацията.

Следващите две настройки Padding top and bottom of author box и Padding left and right of author box дефинират разстоянията отгоре и отдолу, както и отляво и отдясно на вътрешните елементи до границата на информационната секция.

Border Width – определя ширината на границата.

Author avatar image style – от опциите в менюто може да изберете дали изображението да бъде квадратно или кръгло.

Show author website – това е цената на ‘безплатните‘ статии в интернет маркетинга – линк към сайта на автора.

Social icons type – от менюто може да променяте типа на социалните икони – в един цвят (Symbols) или цветни (Colored).

Настройки в раздел Colors

Настройки в раздел Colors
Настройки в раздел Colors.

В този раздел може да персонализирате цветовете на елементите в секция информация за автора.

  • Author name color – цвят на името на автора;
  • Border color – цвят на границата;
  • Background color of social icons bar – фонов цвят на лентата със социалните икони;
  • Background color of author box – фонов цвят на секцията с информацията за автора;
  • Color of author box paragraphs – цвят на текста в информацията за автора;
  • Color of author box links – цвят на линковете в информацията за автора;
  • Social icons color (for symbols only) – цвят на социалните икони ако е избран тип symbols.

Настройки в раздел Typography

Настройки в раздел Typography
Настройки в раздел Typography.

В раздела Typography може да дефинирате шрифтове и големина на текст за елементите на секция информация за автора. Ако не изберете шрифт или цвят от настройките на плъгина, WordPress ще ползва настройките на активната тема.

  • Google font characters subset – категория на шрифтове от Google (например – Cyrillic, кирилица);
  • Author name font family – шрифт на името на автора;
  • Author description font family – шрифт на информацията за автора;
  • Author name font size – големина на текста на името на автора;
  • Author description font size – големина на текста на описанието за автора;
  • Size of social icons – големина на социалните икони;
  • Author description font style – стил на текста на описанието за автора.

Настройки в раздел Misc

Настройки в раздел Misc
Настройки в раздел Misc.

Load generated inline style to footer – препоръчаме опцията да не се активира, тъй като footer-ът е различен елемент от структурата на сайта със свои собствени дизайн и предназначение, които са много различни от функциите на информацията за автора.

Ако WordPress темата показва информация за автора, но Вие желаете да ползвате по-големите възможности на плъгина Simple Author Box, трябва да изключите опцията от настройките на темата в WordPress Customize или да скриете полето с персонализиран CSS код (display:none).

Разработчиците на Simple Author Box доставят плъгина с прецизни адаптивни (responsive) настройки – при десктоп и таблет резолюции елементите са разположени отляво:

Изглед в резолюция десктоп
Изглед в резолюция десктоп.
Изглед в резолюция таблет
Изглед в резолюция таблет.

След преминаване на breakpoint за смартфон резолюция (обикновено под 600px ширина на екрана), елементите автоматично се подреждат в средата на екрана един под друг:

Изглед в резолюция смартфон
Изглед в резолюция смартфон.

Добавяне на информация за автора чрез widget в страничната лента

Интересна разновидност при създаване на секция с информацията за автора предоставят разработчиците на плъгина Meks Smart Author Widget.

Този плъгин позволява да показвате информация за автора (потребителя) чрез WordPress widget (джаджа). Полезна характеристика на този плъгин е автоматичното откриване на автор (потребител), така той може да показва автора на текущата публикация в шаблони за единични публикации или в архив на конкретен автор в блог с множество регистрирани автори.

Отворете Plugins » Add New, въведете в полето за търсене meks author и инсталирайте/активирайте плъгина през бутона Install Now/Activate.

Инсталиране на Meks Smart Author Widget в WordPress
Инсталиране на Meks Smart Author Widget в WordPress.

За да достъпите плъгина, отворете Appearance » Widgets:

Достъп до Meks Smart Author Widget през главното меню.
Достъп до Meks Smart Author Widget през главното меню.

Кликнете върху лентата Main Sidebar, за да видите наличните widget-и:

Изглед на лента Main Sidebar
Изглед на лента Main Sidebar.

В примера премахнахме ненужните джаджи през Options » Remove block и оставихме само поле за търсене и Latest posts:

Меню за премахване на ненужни widgets
Меню за премахване на ненужни widgets.

За да инсталирате Meks Smart Author, кликнете върху иконата със символ знак плюс след блока Latest posts, въведете в полето за търсене meks и кликнете линка Meks Smart Author:

Активиране на widget Meks Smart Author
Активиране на widget Meks Smart Author.

Панелът с настройки е изключително лесен за конфигуриране. В първата секция въведете име на секцията (Title), менюто Choose author/user съдържа списък с всички регистрирани автори/потребители. Важно е да маркирате опцията Automatically detect author, за да активирате автоматичното разпознаване на авторите:

Секция с настройки на Meks Smart Author
Секция с настройки на Meks Smart Author.

Настройки в секция Display Options

  • Display author avatar – показване на изображение/аватар;
  • Avatar size – размер на изображението;
  • Display author name – показване име на автора;
  • Display author description – показване информация за автора;
  • Limit description – през тази опция може да ограничите броя на символите в информацията за автора;
  • Link author name – при маркиране името на автора ще бъде линк към архив с неговите статии;
  • Display author „all posts“ archive link – показване на линк към всички статии на автора;
  • Link text – в полето може да промените името на линка View all posts;
Настройки в секция Display Options
Настройки в секция Display Options.

Запазете избраните настройки като натиснете бутона Update в горния десен ъгъл на екрана.

На следващото изображение виждате визуализиране на информацията за автора в страничната лента на WordPress публикация:

Изглед на информация за автора в страничната лента
Изглед на информация за автора в страничната лента.

Добавяне на информация за автора чрез допълнителен код

Този метод за добавяне на информация за автора не е препоръчителен и го споделяме само като възможност и насърчение към любителите на работа с PHP и CSS код.

Шаблонът в WordPress, който показва единичните публикации, се съдържа във файла single.php. За да добавите секция с информация за автора, трябва да отворите редактора на WordPress (Appearance » Theme Editor) и от менюто Theme Files в дясната лента да изберете single.php.

След това поставете Вашия код и запазете файла с бутона Update File. WordPress ще Ви отговори със съобщението: File edited successfully.

Ако желаете да добавите CSS код, с който да персонализирате изгледа на секцията, може да добавите през Appearance » Customize този код в панела Additional CSS.

В примера ще използваме шаблона от WordPress темата по подразбиране Twenty Twenty-One, който се намира във файла template-parts/post/author-bio.php.

Премахваме всички коментари, изтриваме slug името twentytwentyone от кода като запазваме кавичките, и получаваме следния изчистен код:

<?php if ( get_the_author_meta( 'description' ) && post_type_supports( get_post_type(), 'author' ) ) : ?>
<div class="author-bio <?php echo get_option( 'show_avatars' ) ? 'show-avatars' : ''; ?>">
   <?php echo get_avatar( get_the_author_meta( 'ID' ), '85' ); ?>
   <div class="author-bio-content">
   <h2 class="author-title"><?php printf( esc_html__( 'By %s', '' ), get_the_author() ); ?></h2>
   <p class="author-description"> <?php the_author_meta( 'description' ); ?></p>
     <?php
      printf(
      '<a class="author-link" href="%1$s" rel="author"-->' . esc_html__( 'View all of %2$s\'s posts.', '' ) . '',
      esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ),
      get_the_author()
          );
     ?>;
   </div>
</div>
<?php endif; ?>

Поставяме този код във файла single.php:

Добавяне на код в single.php през Theme Editor
Добавяне на код в single.php през Theme Editor.

преди функциите за зареждане на страничната лента (sidebar) и/или footer, в зависимост от структурата на темата:

get_sidebar();
get_footer();

Запазваме файла и добавяме следния код в Appearance » Customize » Additional CSS, за да направим малки корекции в изгледа на секцията:

.author-bio {
    margin: 30px 0;
    padding: 20px 50px;
    border: 1px solid #ccc;
}
.author-bio-content h2.author-title {
    margin: 12px 0;
}

Запазваме промените с натискане на бутона Publish в горния ляв ъгъл. Така изглежда секцията с информация за автора на десктоп резолюция:

Изглед на добавената секция с информация за автора
Изглед на добавената секция с информация за автора.

Ако решите да следвате този начин на добавяне на секция с информация за автора, не забравяйте да добавите CSS код поне за две стандартни резолюции (таблет и смартфон), за да бъде новата секция напълно адаптивна. Без допълнителен код секцията с информация за автора изглежда така на смартфон (430 пиксела ширина):

Изглед на секция с информация за автора в смартфон резолюция
Изглед на секция с информация за автора в смартфон резолюция.
Обновена: 02.07.2021

Беше ли Ви полезна тази статия?

Вижте още