Showcase Creator

<?php
/**
 * Registers a custom post type called website.
 */
function cpt_website_register() {
	$labels = array(
		'name' => 'Websites',
		'singular_name' => 'Website',
		'menu_name' => 'Websites',
		'all_items' => 'All websites',
		'add_new_item' => 'Add new Website',
		'edit_item' => 'Edit Website',
		'new_item' => 'New Website',
		'view_item' => 'View Website',
		'view_items' => 'View Websites',
	);
	$args = array(
		'public' => true,
		'labels' => $labels,
		'description' => 'For Websites Showcase.',
		'menu_position' => 26,
		'menu_icon' => 'dashicons-desktop',
		'supports' => array( 'title', 'excerpt', 'comments' ),
		'register_meta_box_cb' => 'cpt_website_add_metabox',
	);
	register_post_type( 'website', $args );
}
add_action( 'init', 'cpt_website_register' );

/**
 * Adds meta box to website post type.
 */
function cpt_website_add_metabox() {
  add_meta_box( 'cpt-website-metabox', 'Website Data', 'cpt_website_metabox', 'website', 'normal', 'high' );
}

/**
 * Processes gallery entries from meta data to custom field.
 * @for website post type.
 */
function cpt_website_get_gallery( $str ) {
    return implode(
        PHP_EOL,
        array_map(
            function($i) {
                return trim( $i, "' " );
            },
            explode( ',' , $str )
        )
    );
}

/**
 * Processes gallery entries from custom field to be saved to meta data.
 * @for website post type.
 */
function cpt_website_set_gallery( $str ) {
	$items = preg_split( '/,|\s+|\n+/', $str );
	$items = array_filter( $items, function( $i ) {
		return strlen( trim( $i ) ) > 1;
	} );
	$items = array_map(
		function( $i ) {
			$split = str_split( trim( $i ) );
			if ( $split[0] !== '\'' ) {
				$i = '\'' . $i;
			}
			if ( array_pop($split) !== '\'' ) {
				$i = $i . '\'';
			}
			return $i;
		},
		$items
	);
	$items = implode( ',', $items );
	return $items;
}

/**
 * Displays meta box with custom fields.
 * @for website post type.
 */
function cpt_website_metabox( $post ) {
	$url = get_post_meta( $post->ID, '_site_url', true );
	$desktop = get_post_meta( $post->ID, '_desktop', true );
	$desktop_gallery = get_post_meta( $post->ID, '_desktop-gallery', true ) ?: '';
	$desktop_gallery = cpt_website_get_gallery( $desktop_gallery );
	$tablet = get_post_meta( $post->ID, '_tablet', true );
	$tablet_gallery = get_post_meta( $post->ID, '_tablet-gallery', true ) ?: '';
	$tablet_gallery = cpt_website_get_gallery( $tablet_gallery );
	$mobile = get_post_meta( $post->ID, '_mobile', true );
	$mobile_gallery = get_post_meta( $post->ID, '_mobile-gallery', true ) ?: '';
	$mobile_gallery = cpt_website_get_gallery( $mobile_gallery );
	ob_start(); ?>
	<style>
		.sites-metabox {
			display: flex;
			flex-flow: column nowrap;
		}
		.sites-metabox textarea {
			min-height: 5em;
		}
	</style>
	<div class="sites-metabox" style="gap: 10px;">
		<div class="sites-metabox">
			<label for="site_url">URL:</label>
			<input type="text" name="site_url" id="site_url" value="<?php echo $url; ?>" placeholder="https://" />
		</div>
		<div class="sites-metabox">
			<label for="desktop">Desktop thumbnail:</label>
			<input type="text" name="desktop" id="desktop" value="<?php echo $desktop; ?>" placeholder="https://" />
		</div>
		<div class="sites-metabox">
			<label for="desktop-gallery">Desktop gallery*:</label>
			<textarea name="desktop-gallery" id="desktop-gallery" placeholder="space / new line separated URLs"><?php
				echo $desktop_gallery;
			?></textarea>
		</div>
		<div class="sites-metabox">
			<label for="tablet">Tablet thumbnail:</label>
			<input type="text" name="tablet" id="tablet" value="<?php echo $tablet; ?>" placeholder="https://" />
		</div>
		<div class="sites-metabox">
			<label for="tablet-gallery">Tablet gallery*:</label>
			<textarea name="tablet-gallery" id="tablet-gallery" placeholder="space / new line separated URLs"><?php
				echo $tablet_gallery;
			?></textarea>
		</div>
		<div class="sites-metabox">
			<label for="mobile">Mobile thumbnail:</label>
			<input type="text" name="mobile" id="mobile" value="<?php echo $mobile; ?>" placeholder="https://" />
		</div>
		<div class="sites-metabox">
			<label for="mobile-gallery">Mobile gallery*:</label>
			<textarea name="mobile-gallery" id="mobile-gallery" placeholder="space / new line separated URLs"><?php
				echo $mobile_gallery;
			?></textarea>
		</div>
		<span class="font-style: italic;">* URLs can be separated by a space or a new line.</span>
	</div><?php
	ob_end_flush();
}

/**
 * Saves the data from the custom fields.
 * @for website post type.
 */
function cpt_website_metabox_save( $post_id, $post ) {
	if ( $post->post_type === 'website' ) {
		$desktop_gallery = cpt_website_set_gallery( $_POST['desktop-gallery'] ?? '' );
		$tablet_gallery = cpt_website_set_gallery( $_POST['tablet-gallery'] ?? '' );
		$mobile_gallery = cpt_website_set_gallery( $_POST['mobile-gallery'] ?? '' );
		update_post_meta( $post_id, '_site_url', $_POST['site_url'] ?? '' );
		update_post_meta( $post_id, '_desktop', $_POST['desktop'] ?? '' );
		update_post_meta( $post_id, '_desktop-gallery', $desktop_gallery );
		update_post_meta( $post_id, '_tablet', $_POST['tablet'] ?? '' );
		update_post_meta( $post_id, '_tablet-gallery', $tablet_gallery );
		update_post_meta( $post_id, '_mobile', $_POST['mobile'] ?? '' );
		update_post_meta( $post_id, '_mobile-gallery', $mobile_gallery );
	}
}
add_action( 'save_post', 'cpt_website_metabox_save', 10, 3 );