Szerzők aláírásának megjelenítése WordPress blogban

A WordPress lehetővé teszi, hogy egy blogba több felhasználó is írjon cikkeket. Az ilyen oldalaknál érdemes lehet minden bejegyzés végén egy fényképes aláírást elhelyezni, így egyedibbé, személyesebbé tehetjük weboldalunkat. Ebben a tutorialban egy teljesen automatizált megoldást mutatunk be, amihez nem lesz szükségünk egy bővítményre sem, csak a WordPress sablonunkat kell módosítani.

Szerző nevének és aláírásának megjelenítése

Nagyon egyszerű dolgunk van, csak az alábbi kódot kell beillesztenünk a single.php fájlba:

[php]<div id=”author-bio”>
<h4><?php the_author_posts_link(); ?></h4>
<?php the_author_description(); ?>
</div>[/php]

Ez a kód a szerző nevét és az adatlapon megadott életrajzi információt jeleníti meg.

Fénykép beillesztése az aláírásba a WordPress Blogban.

1. lépés

Hozzunk létre egy authors mappát sablonunk images mappáján belül:

wp-content/themes/sablonodneve/images/authors

2. lépés

A szerzők képeit úgy mentsük el, hogy a fájlnév megegyezzen a felhasználó ID-jével.

Honnan tudod meg a felhasználók ID-jét?

Vidd a Felhasználók oldalon a bejegyzések száma fölé az egeret és az URL végén megjelenik az adott szerző ID-je. Jelen esetben ez a szám a 2, tehát 2.jpg-nek nevezzük el a képet.

3. lépés

Illeszd be ezt a kódot a WordPress sablon single.php-jébe:

[php]<img src=”<?php bloginfo(‘template_directory’) ?>/images/authors/<?php the_author_ID()?>.jpg” alt=”<?php the_author(); ?>” title=”<?php the_author(); ?>” />[/php]

A végeredménynek valahogy így kell kinéznie:

[php]<div id=”author-bio”>
<img src=”<?php bloginfo(‘template_directory’) ?>/images/authors/<?php the_author_ID()?>.jpg” alt=”<?php the_author(); ?>” title=”<?php the_author(); ?>” />
<h4><?php the_author_posts_link(); ?></h4>
<?php the_author_description(); ?>
</div>[/php]

Persze a CSS-t se felejtsük el:

[css]#author-bio {
border: 1px solid #D6D6D6;
padding: 10px;
margin-top: 20px;
}
#author-bio h4 {
}
#author-bio img {
float: left;
width: 100px;
margin: 5px 15px 0 0;
}[/css]

További érdekes írásunk WordPress Wamp server telepítéséről.

Kategorizálva: WordPress tutorial

A cikket írta:stilldesign