Archived topic
Category settings
9 replies · Started by Roger on August 3, 2022
Hi!
I used this code to move the categories above the post title. But I need to resolve two things:
1. How to add space between categories
2. How to keep the categories in line on the smartphone?
Thanks!
add_filter( 'generate_category_list_output','lh_remove_categories' );
function lh_remove_categories( $categories ) {
if ( is_single() ) {
return '';
}
return $categories;
}
add_action( 'generate_before_entry_title','lh_single_cats_above_title' );
function lh_single_cats_above_title() {
if ( is_single() ) {
$categories_list = get_the_category_list( _x( ', ', 'Used between list items, there is a space after the comma.', 'generatepress' ) );
if ( $categories_list ) {
printf( '<span class="entry-meta cat-links"><span class="screen-reader-text">%1$s </span>%2$s</span>',
_x( 'Categories', 'Used before category names.', 'generatepress' ),
$categories_list
);
}
}
}Hi Roger,
Let’s tackle the issues one at a time starting with #1.
Replace this:
add_action( 'generate_before_entry_title','lh_single_cats_above_title' );
function lh_single_cats_above_title() {
if ( is_single() ) {
$categories_list = get_the_category_list( _x( ', ', 'Used between list items, there is a space after the comma.', 'generatepress' ) );
if ( $categories_list ) {
printf( '<span class="entry-meta cat-links"><span class="screen-reader-text">%1$s </span>%2$s</span>',
_x( 'Categories', 'Used before category names.', 'generatepress' ),
$categories_list
);
}
}
}With this:
add_action( 'generate_before_entry_title','lh_single_cats_above_title' );
function lh_single_cats_above_title() {
if ( is_single() ) {
$categories_list = get_the_category_list( _x( ' ', 'Space between list items', 'generatepress' ) );
if ( $categories_list ) {
printf( '<span class="entry-meta cat-links"><span class="screen-reader-text">%1$s </span>%2$s</span>',
_x( 'Categories', 'Used before category names.', 'generatepress' ),
$categories_list
);
}
}
}Let us know how it goes.
Hello Fernando,
I pasted the code below. But he just removed the commas.
add_action( 'generate_before_entry_title','lh_single_cats_above_title' );
function lh_single_cats_above_title() {
if ( is_single() ) {
$categories_list = get_the_category_list( _x( ' ', 'Space between list items', 'generatepress' ) );
if ( $categories_list ) {
printf( '<span class="entry-meta cat-links"><span class="screen-reader-text">%1$s </span>%2$s</span>',
_x( 'Categories', 'Used before category names.', 'generatepress' ),
$categories_list
);
}
}
}To clarify, do you want just a space or a comma with a space?
Category name + comma + space (just like on the archive page of posts)
I see. Can you try this?:
add_action( 'generate_before_entry_title','lh_single_cats_above_title' );
function lh_single_cats_above_title() {
if ( is_single() ) {
$categories_list = get_the_category_list( ', ' );
if ( $categories_list ) {
printf( '<span class="entry-meta cat-links"><span class="screen-reader-text">%1$s </span>%2$s</span>',
_x( 'Categories', 'Used before category names.', 'generatepress' ),
$categories_list
);
}
}
}There remains no space between the categories.
I'm using the css below to customize the category.
.post .cat-links a {
font-family: 'Muli', sans-serif;
font-weight: 600;
text-transform: uppercase;
}Revert it back to this:
add_action( 'generate_before_entry_title','lh_single_cats_above_title' );
function lh_single_cats_above_title() {
if ( is_single() ) {
$categories_list = get_the_category_list( _x( ', ', 'Used between list items, there is a space after the comma.', 'generatepress' ) );
if ( $categories_list ) {
printf( '<span class="entry-meta cat-links"><span class="screen-reader-text">%1$s </span>%2$s</span>',
_x( 'Categories', 'Used before category names.', 'generatepress' ),
$categories_list
);
}
}
}Then try this CSS:
.single-post span.entry-meta.cat-links a:not(:first-of-type) {
padding-left: 5px;
}It works on the desktop. But on mobile the categories are not in line.
1. How to add space between categories (resolved)
2. How to keep the categories in line on the smartphone? (view image)
Hi Roger,
Can you link us to a post where we can see multiple categories?
