星期三 , 22 1 月 2025

WP如何添加自媒体链接

首先我们要在后台用户面板添加自媒体链接的字段输入框,要用到的是 show_user_profile的钩子和edit_user_profile的钩子,

<?php /*-----------------------------------------------------------------------------------*/
# Add user's social accounts
/*-----------------------------------------------------------------------------------*/
add_action( 'show_user_profile', 'tie_show_extra_profile_fields' );
add_action( 'edit_user_profile', 'tie_show_extra_profile_fields' );
function tie_show_extra_profile_fields( $user ) {
	wp_enqueue_media();
?>
	<h3><?php _e( 'Cover Image', 'tie' ) ?></h3>
	<table class="form-table">
		<tr>
			<th><label for="author-cover-bg"><?php _e( 'Cover Image', 'tie' ) ?></label></th>
			<td>
				<?php $author_cover_bg = get_the_author_meta( 'author-cover-bg', $user->ID ) ; ?>
				<input id="author-cover-bg" class="img-path" type="text" size="56" style="direction:ltr; text-laign:left" name="author-cover-bg" value="<?php if( !empty( $author_cover_bg ) ) echo esc_attr( $author_cover_bg );  ?>" />
				<input id="upload_author-cover-bg_button" type="button" class="button" value="<?php _e( 'Upload', 'tie' ) ?>" />

				<div id="author-cover-bg-preview" class="img-preview" <?php if( empty( $author_cover_bg ) ) echo 'style="display:none;"' ?>>
					<img src="<?php if( !empty( $author_cover_bg ) ) echo $author_cover_bg ; else echo get_template_directory_uri().'/framework/admin/images/empty.png'; ?>" alt="" />
					<a class="del-img" title="Delete"></a>
				</div>

				<script type='text/javascript'>
					jQuery('#author-cover-bg').change(function(){
						jQuery('#author-cover-bg-preview').show();
						jQuery('#author-cover-bg-preview img').attr("src", jQuery(this).val());
					});
					tie_set_uploader( 'author-cover-bg' );
				</script>
			</td>
		</tr>
	</table>

	<h3><?php _e( 'Custom Author widget', 'tie' ) ?></h3>
	<table class="form-table">
		<tr>
			<th><label for="author_widget_content"><?php _e( 'Custom Author widget content', 'tie' ) ?></label></th>
			<td>
				<textarea name="author_widget_content" id="author_widget_content" rows="5" cols="30"><?php echo esc_attr( get_the_author_meta( 'author_widget_content', $user->ID ) ); ?></textarea>
				<br /><span class="description"><?php _e( 'Supports: Text, HTML and Shortcodes.', 'tie' ) ?></span>
			</td>
		</tr>
	</table>
	<h3><?php _e( 'Social Networking', 'tie' ) ?></h3>
	<table class="form-table">
		<tr>
			<th><label for="twitter"><?php _e( 'Twitter Username', 'tie' ) ?></label></th>
			<td>
				<input type="text" name="twitter" id="twitter" value="<?php echo esc_attr( get_the_author_meta( 'twitter', $user->ID ) ); ?>" class="regular-text" /><br />
			</td>
		</tr>
		<tr>
    		<th><label for="tiktok"><?php _e( 'TikTok URL', 'tie' ) ?></label></th>
    		<td>
        	<input type="text" name="tiktok" id="tiktok" value="<?php echo esc_url( get_the_author_meta( 'tiktok', $user->ID ) ); ?>" class="regular-text" /><br />
    		</td>
		</tr>
		<tr>
			<th><label for="facebook"><?php _e( 'Facebook URL', 'tie' ) ?></label></th>
			<td>
				<input type="text" name="facebook" id="facebook" value="<?php echo esc_url( get_the_author_meta( 'facebook', $user->ID ) ); ?>" class="regular-text" /><br />
			</td>
		</tr>
		<tr>
			<th><label for="linkedin"><?php _e( 'LinkedIn URL', 'tie' ) ?></label></th>
			<td>
				<input type="text" name="linkedin" id="linkedin" value="<?php echo esc_url( get_the_author_meta( 'linkedin', $user->ID ) ); ?>" class="regular-text" /><br />
			</td>
		</tr>
		<tr>
			<th><label for="flickr"><?php _e( 'Flickr URL', 'tie' ) ?></label></th>
			<td>
				<input type="text" name="flickr" id="flickr" value="<?php echo esc_url( get_the_author_meta( 'flickr', $user->ID ) ); ?>" class="regular-text" /><br />
			</td>
		</tr>
		<tr>
			<th><label for="youtube"><?php _e( 'YouTube URL', 'tie' ) ?></label></th>
			<td>
				<input type="text" name="youtube" id="youtube" value="<?php echo esc_url( get_the_author_meta( 'youtube', $user->ID ) ); ?>" class="regular-text" /><br />
			</td>
		</tr>
		<tr>
			<th><label for="pinterest"><?php _e( 'Pinterest URL', 'tie' ) ?></label></th>
			<td>
				<input type="text" name="pinterest" id="pinterest" value="<?php echo esc_url( get_the_author_meta( 'pinterest', $user->ID ) ); ?>" class="regular-text" /><br />
			</td>
		</tr>
		<tr>
			<th><label for="behance"><?php _e( 'Behance URL', 'tie' ) ?></label></th>
			<td>
				<input type="text" name="behance" id="behance" value="<?php echo esc_url( get_the_author_meta( 'behance', $user->ID ) ); ?>" class="regular-text" /><br />
			</td>
		</tr>
		<tr>
			<th><label for="instagram"><?php _e( 'Instagram URL', 'tie' ) ?></label></th>
			<td>
				<input type="text" name="instagram" id="instagram" value="<?php echo esc_url( get_the_author_meta( 'instagram', $user->ID ) ); ?>" class="regular-text" /><br />
			</td>
		</tr>

	</table>
<?php }

然后保存用户字段

## Save user's social accounts
## Save user's social accounts
add_action( 'personal_options_update', 'tie_save_extra_profile_fields' );
add_action( 'edit_user_profile_update', 'tie_save_extra_profile_fields' );
function tie_save_extra_profile_fields( $user_id ) {
    if ( !current_user_can( 'edit_user', $user_id ) ) return false;
    update_user_meta( $user_id, 'author_widget_content',   $_POST['author_widget_content'] );
    update_user_meta( $user_id, 'author-cover-bg',         $_POST['author-cover-bg'] );
    update_user_meta( $user_id, 'pinterest',               $_POST['pinterest'] );
    update_user_meta( $user_id, 'twitter',                 $_POST['twitter'] );
    update_user_meta( $user_id, 'facebook',                $_POST['facebook'] );
    update_user_meta( $user_id, 'linkedin',                $_POST['linkedin'] );
    update_user_meta( $user_id, 'flickr',                  $_POST['flickr'] );
    update_user_meta( $user_id, 'youtube',                 $_POST['youtube'] );
    update_user_meta( $user_id, 'instagram',               $_POST['instagram'] );
    update_user_meta( $user_id, 'behance',                 $_POST['behance'] );
    update_user_meta( $user_id, 'tiktok',                  $_POST['tiktok'] );  // Add this line
}

在前台用函数加载出来,注意更改里面的HTML

function display_social_media_links() {
    $user_id = get_option('page_for_posts'); // Get the ID of the user who owns the blog page
    $social_networks = array(
        'facebook'  => array('name' => 'Facebook', 'icon' => 'fab fa-facebook'),
        'twitter'   => array('name' => 'Twitter', 'icon' => 'fab fa-twitter'),
        'linkedin'  => array('name' => 'LinkedIn', 'icon' => 'fab fa-linkedin'),
        'instagram' => array('name' => 'Instagram', 'icon' => 'fab fa-instagram'),
        'youtube'   => array('name' => 'YouTube', 'icon' => 'fab fa-youtube'),
        'pinterest' => array('name' => 'Pinterest', 'icon' => 'fab fa-pinterest'),
        'behance'   => array('name' => 'Behance', 'icon' => 'fab fa-behance'),
        'flickr'    => array('name' => 'Flickr', 'icon' => 'fab fa-flickr'),
        'tiktok'    => array('name' => 'TikTok', 'icon' => 'fab fa-tiktok')
    );

    echo '<ul class="social-links">';
    foreach ($social_networks as $key => $network) {
        $url = get_the_author_meta($key, $user_id);
        if (!empty($url)) {
            echo '<li><a href="' . esc_url($url) . '" target="_blank" rel="noopener noreferrer"><i class="' . $network['icon'] . '"></i><span>' . $network['name'] . '</span></a></li>';
        }
    }
    echo '</ul>';
}

Check Also

Canva slider

https://www.can …

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注