I need to create a block to show the most recent publish in 2 columns.
The publish are loading because it ought to however i need to use “props.attributes.columnSize” and go that as a category contained in the php perform. This props.attributes.columnSize will output “col-6” as a category.
I can straight put the category within the html in php however I need to give the consumer the power to pick the category from InspectorControls
Block.js code as beneath
registerBlockType("boot/latest-post", {
// Block title. Block names should be string that accommodates a namespace prefix. Instance: my-plugin/my-custom-block.
title: __("latestPost"), // Block title.
description: __("Card Block", "buik/block-cta"),
icon: "align-center", // Block icon from Dashicons → https://developer.wordpress.org/useful resource/dashicons/.
class: "textual content", // Block class — Group blocks collectively primarily based on frequent traits E.g. frequent, formatting, structure widgets, embed.
key phrases: [__("card 2 "), __("bootstrap card"), __("")],
attributes: {
columnSize: {
sort: "string",
default: "xyz",
},
},
php code that renders the output in frontend
add_action('plugins_loaded', 'register_latest_post');
perform register_latest_post() {
register_block_type('boot/latest-post', [ 'render_callback' => 'render_latest_post'
]);
}
perform render_latest_post() {
$latest_posts = wp_get_recent_posts( [
'numberposts' => 3,
'post_status' => 'publish'
] );
if(empty($latest_posts)){
return '<p>No posts</p>';
}
$posts_output="<div class="latest-postss">";
foreach($latest_posts as $publish ) {
$post_id = $publish['ID'];
$post_thumbnail = get_the_post_thumbnail_url( $post_id, 'full' );
$posts_output .= '<div class="post-title">
<h2>
<a href="'.get_permalink($post_id). '">
'.get_the_title( $post_id ).'
</a>
</h2>
</div>';
}
$posts_output .= '</div>';
return $posts_output;
}