Display Category title on posts

i guess i m not able to add the category on the style sheet..i wouldn’t know where and what exactly put there.

what do you want to link to where?

for example, to link the category title to the category archive:

<?php
foreach( get_the_category() as $category ) {
    $category_name = $category->cat_name;
}
echo ' <a href="' . get_category_link( $category->term_id ) . '">' . $category_name . '</a> ' . $post->title;
?>

https://codex.www.ads-software.com/Function_Reference/get_category_link

alchymyth, just, thank you. you solved my problem. ??

i only have one more question about it; once i put this category link on the post, i would like to stylize it a little bit (change font, and first of all, center the text, padding, margin), how can i add it in the style.css ?

i guess i ve to put something like .entry-header.xxxxx (where xxxx is something about an entry category) and then customize the string as i made for titles, comments etc etc…what i ve to put exactly? and what if i would like to change the category text with an icon?

thank you again.

i m obsvering that it’s a little more complicated than simply add something to style.css

guess i ve to create a class in the content.php and then call that class in the style.css but i m not pretty sure on how to make this in a correct way..

your posted code section is a bit too isolated to comment on how to style the category link and post title;

generally, you could add a css class to the link;
example:

<?php
foreach( get_the_category() as $category ) {
    $category_name = $category->cat_name;
}
echo ' <a class="category-link" href="' . get_category_link( $category->term_id ) . '">' . $category_name . '</a> ' . $post->title;
?>

or add a span with a css class around the code;
example:

<span class="category-title">
<?php
foreach( get_the_category() as $category ) {
    $category_name = $category->cat_name;
}
echo ' <a href="' . get_category_link( $category->term_id ) . '">' . $category_name . '</a> ' . $post->title;
?>
</span>

thank you again for your patience,

i tried to paste your code but nothing happens. I replaced what i did before with your code, than i went to style.css and tried to add the class to be able to customize it. I tried to make that:

.entry-header .category-title a {
	text-decoration: none;
	padding-left: 0px;
	left: 0px;
	font-size: 34px;
	font-family: Anton;
}

but it hasn’t worked.

what i would like to achieve is a sort of

.entry-header .entry-title a {
	text-decoration: none;
	padding-left: 0px;
	left: 0px;
	font-size: 34px;
	font-family: Anton;

but for the category strip.

until now i was able thank to your advice to put the linkable category name on the top of the post but i need to change the font and the alignement. If i inspect with chrome the category name, i always get the <a> generical proprieties which affect the whole content:

a {
outline: none;
color: #333333;
font-family: "PT Sans Caption Web Regular";
font-size: 15px;
text-align: center;
text-decoration: none;
margin-left: 0px;
}

i would like a isolated class to customize.

if i wasn’t able to explain this clearly, what i want to achieve is the category style on the top of the post title in this website:
https://www.garancedore.fr/

hope i m not too complicated, thank you again.

this is a piece of my child content.php with your span code inserted.

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
		<?php if ( is_sticky() && is_home() && ! is_paged() ) : ?>
		<div class="featured-post">
			<?php _e( 'Featured post', 'twentytwelve' ); ?>
		</div>
		<?php endif; ?>

		<span class="category-title">
		<?php foreach( get_the_category() as $category ) {
		$category_name = $category->cat_name;
		}
		echo ' <a href="' . get_category_link( $category->term_id ) . '">' . $category_name . '</a> ' . $post->title;
			?>
		</span>

		<header class="entry-header">
		 	<?php the_post_thumbnail(); ?>
			<?php if ( is_single() ) : ?>
			<h1 class="entry-title"><?php the_title(); ?></h1>
			<?php else : ?>
			<h1 class="entry-title">
				<a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( sprintf( __( 'Permalink to %s', 'twentytwelve' ), the_title_attribute( 'echo=0' ) ) ); ?>" rel="bookmark"><?php the_title(); ?></a>
			</h1>
			<?php endif; // is_single() ?>

		</header><!-- .entry-header -->

your code is before the header with the css class .entry-header so this won’t work:

.entry-header .category-title a {
}

your example site has this output:

<header>
            <div class="the-category cat-lifestyle">Lifestyle</div>            <h2 class="title"><a href="https://www.garancedore.fr/2013/04/12/at-free-people-2/">At Free People</a></h2>
    </header>

to achieve something similar, your code would need to look like:

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
		<?php if ( is_sticky() && is_home() && ! is_paged() ) : ?>
		<div class="featured-post">
			<?php _e( 'Featured post', 'twentytwelve' ); ?>
		</div>
		<?php endif; ?>

		<header class="entry-header">

		<span class="category-title">
		<?php foreach( get_the_category() as $category ) {
		$category_name = $category->cat_name;
		}
		echo ' <a href="' . get_category_link( $category->term_id ) . '">' . $category_name . '</a> ';
			?>
		</span>

		 	<?php the_post_thumbnail(); ?>
			<?php if ( is_single() ) : ?>
			<h1 class="entry-title"><?php the_title(); ?></h1>
			<?php else : ?>
			<h1 class="entry-title">
				<a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( sprintf( __( 'Permalink to %s', 'twentytwelve' ), the_title_attribute( 'echo=0' ) ) ); ?>" rel="bookmark"><?php the_title(); ?></a>
			</h1>
			<?php endif; // is_single() ?>

		</header><!-- .entry-header -->

the formatting will be a different problem …

thank you, really thank you. it’s great because thanks to your advices i’m improving my little CSS knowledge.

now i m able to do nearly what i wanted to. I can’t understand why the text align is different from the others options. Now i can change nearly everything of the style, except the text allignement.

but i’t ok, thank you mister! ??

oh, well……

i made an experiment, i displayed the style as a block et voilà…the text got aligned exactly in the center.

cool ?? i hope i didn’t destroyed something else btw. ??