[Resolved] Display categories post below featured image

[Alfonso]

Hi there,

I need to display the categories link below featured image.

This cat links are displayingn after main content by default, but i need to move below featured image, is it possible?

You can check at this:

https://www.delahuertacasa.com/entrevista-lidia-ma-diaz/

So, i have a custom field (subtitulo) and is only displaying in single post page, but is not displayin on archive post page, why is the reason??

[Elvin]

Hi,

As for the cat links:

Try this PHP snippet to move it below the featured image.

add_filter( 'generate_footer_entry_meta_items', function( $items ) {
    return array_diff( $items, array( 'categories' ) );
} );

add_action( 'generate_after_entry_header', function() {
    if ( is_single() ) {
        generate_do_post_meta_item( 'categories' );
    }
}, 20);

As for the custom field not displaying in archive pages:

You have to hook this particular field on the post loop if you want it to display. Else, the post loop will display its default or anything included/excluded from the Customizer.

[Alfonso]

Thanks Elvin,,

The PHP Snippet is working perfect.

So i need more help to get custom field on Archive page. I’ve not found in the Customizer to display custom fields options

[David]

Hi there,

how are you adding the Custom Field to the single post ?

[Alfonso]

Hi there,

Is a default option from wordpress:

https://snipboard.io/okq430.jpg

And is displaying perfect on single post by default:

https://snipboard.io/ejKM6y.jpg

[Elvin]

Hi,

You can try this solution:

I’ve created a shortcode that displays custom field.

Here’s the PHP snippet:

function custom_field_display_func( $atts ) {
	ob_start();
    $atts = shortcode_atts(
        array(
            'key' => '',
			'class' => '',
			'html' => '',
        ), $atts, 'custom_field_display' );

    $key = $atts['key'];
	$class = $atts['class'];
	$html = $atts['html'];
    $output = '';
    if(!empty($key)){
		if(!empty($html)){
			$output = sprintf( '<%1$s class="%3$s"> %2$s </%1$s>',
				$html,
				get_post_meta(get_the_ID(), $key, true),
				$class
			);
		} else {
			$output = sprintf( '<h4 class="%2$s"> %1$s </h4>',
				get_post_meta(get_the_ID(), $key, true),
				$class
			);
		}
    } else {
        $ouput = '<p> Please include a key attribute to the shortcode. </p> ';
    }

    echo $output;
	return ob_get_clean();
}
add_shortcode( 'custom_field_display', 'custom_field_display_func' );

With this, you can use the shortcode [custom_field_display key="your_key_here" html="h1" class="yourcustomclass"].

Where key="" is the slug/name of your custom field, html="" is your preferred markup which can be h1, h2, h3, p, etc. class="" is optional, but i’ve added it anyway incase you’d like to add custom classes to it for CSS styling.

An example usage would be:

[custom_field_display key="subtitulo" html="h3" class="subtitle"]

Where subtitulo is the name of the custom field you want to display, h3 so it uses <h3></h3> tag and subtitle for class="subtitle" attribute which allows you to style this using the CSS selector .subtitle{ ... }.

Now you can add this shortcode to a Hook Element.
https://docs.generatepress.com/article/hooks-element-overview/

You then make sure the Hook element is hooked to generate_after_entry_title and Execute Shortcodes is checked so the shortcode runs and displays after the post title. Make sure the display location rule is set to “Blog” and “Archive” so it only runs on the said pages. 🙂

[Alfonso]

Thank you very much Elvin, I have followed your steps but it does not work

[Alfonso]

Hi again,

I’ve gotten it to display on the archive blog using this php snippet, but this way, it appears doubly to me in the single post:

add_action( ‘wp_print_footer_scripts’, function () {

$subtitulo = get_post_meta(get_the_ID(), ‘Subtitulo’, true);
if ( $subtitulo ):
?>
<script>
(function( $ ) {
let str = ‘<span class=”subtitulo-blog”>’;
str += ‘<?= $subtitulo ?>’;
str += ‘</span>’;
$(str).insertAfter(‘.entry-title’);
})( jQuery );
</script>
<?php
endif;

} );

[Elvin]

I’ve gotten it to display on the archive blog using this php snippet, but this way, it appears doubly to me in the single post:

You can uncheck “Display post categories” under Appearance > Customize > Layout > Blog on Single tab so the only thing that displays is the one your snippet outputs. 🙂
https://share.getcloudapp.com/RBu9RJ8g

[Alfonso]

Hi Elvin, is not a problem from categories, is a probblem with custom field “subtitulo”, is displaying 2 times in single post page with my snippet.

[Alfonso]

This is blog archive:

https://snipboard.io/Injhcl.jpg

https://www.delahuertacasa.com/blog/

And this is single post:

https://snipboard.io/aWmw0D.jpg

Subtitulo display duplicated.

Your function is not working and i’ve found that snippet:

add_action( ‘wp_print_footer_scripts’, function () {

$subtitulo = get_post_meta(get_the_ID(), ‘Subtitulo’, true);
if ( $subtitulo ):
?>
<script>
(function( $ ) {
let str = ‘<span class=”subtitulo-blog”>’;
str += ‘<?= $subtitulo ?>’;
str += ‘</span>’;
$(str).insertAfter(‘.entry-title’);
})( jQuery );
</script>
<?php
endif;

} );

[Elvin]

Oh my bad. I think I’m missing some details.

I’ve went to lengths to setup a demo to test your code and it doesn’t duplicate on my sandbox site found here: Demo Page

That said, let’s test a few things:

If you temporarily remove the script you’ve written, what happens?

Also, how are you adding the snippet? Let us know.

[Alfonso]

Hi Elvin,

I’ve been solven, i have duplicated my php snippet, sorry!

So, i’ve added to a shortcode to display RRSS social buttons with a hook:generate_after_entry_title

But twitter icon is not displaying in blog archive page, in single post is displaying fine, how i can fix it?

[Elvin]

But twitter icon is not displaying in blog archive page, in single post is displaying fine, how i can fix it?

Can you check the Hook Element you’ve placed the RRSS social buttons in if “Post – All posts” is included on its Display Rule location?

Perhaps the display rule location is only set to Archive pages so it only displays there.

[Alfonso]

The display rule is on “blog”

The question is that, the other icons are displaying on both pages:

Single post:

https://snipboard.io/1a8Vsd.jpg

Archive blog page:

https://snipboard.io/Oi91UW.jpg

Twitter icon is missing on Archive blog page because CSS ::before element is missing, i don’t understand the reason!

[Author]

Posts