Code widget mạng xã hội

Code widget mạng xã hội tương thích với tất cả các loại giao diện. Đây là code dùng trong widget , Bạn dùng để hiện nó ở sidebar. Chép nó vào file function.php của bạn là được nhé!

Bạn nhớ cài thêm

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha512-SfTiTlX6kk+qitfevl/7LibUOeJWlt9rbyDn92a1DqWOw9vWG2MFoays0sgObmWazO5BQPiFucnnEAjpAB+/Sw==" crossorigin="anonymous" referrerpolicy="no-referrer" />

để hiện icon nhé + css ở dưới:

#block-khoitheodoi { padding-right: 5px; margin-bottom: 30px } .follow_block h5 { margin: 20px 0 15px; text-align: center } #block-khoitheodoi .block_content { display: flex; justify-content: center } #block-khoitheodoi .block_content>a { height: 45px; width: 45px; border-radius: 50%; overflow: hidden; border: 1px solid #e4e4e4; display: flex; align-items: center; justify-content: center; color: #707070; font-size: 20px } #block-khoitheodoi .block_content>a.yt { margin: 0 20px }

class Widget_MangXaHoi extends WP_Widget {

function __construct() {
parent::__construct(
'widget_mangxahoi',
esc_html__( 'Widget Xã Hội', 'text_domain' ),
array( 'description' => esc_html__( 'Hiển thị liên kết đến các trang mạng xã hội.', 'text_domain' ) )
);
}

public function widget( $args, $instance ) {
echo $args['before_widget'];
echo '<div id="block-khoitheodoi" class="social-widget">';
echo '<div class="block_content">';
echo '<a href="' . esc_url( $instance['facebook_url'] ) . '" target="_blank" class="fb"><i class="fa fa-facebook" aria-hidden="true"></i></a>';
echo '<a href="' . esc_url( $instance['youtube_url'] ) . '" target="_blank" class="yt"><i class="fa fa-youtube-play" aria-hidden="true"></i></a>';
echo '<a href="' . esc_url( $instance['instagram_url'] ) . '" target="_blank" class="insta"><i class="fa fa-instagram" aria-hidden="true"></i></a>';
echo '</div></div>';
echo $args['after_widget'];
}

public function form( $instance ) {
$facebook_url = isset( $instance['facebook_url'] ) ? esc_url( $instance['facebook_url'] ) : '';
$youtube_url = isset( $instance['youtube_url'] ) ? esc_url( $instance['youtube_url'] ) : '';
$instagram_url = isset( $instance['instagram_url'] ) ? esc_url( $instance['instagram_url'] ) : '';
?>
<p>
<label for="<?php echo $this->get_field_id( 'facebook_url' ); ?>"><?php esc_html_e( 'URL Facebook:', 'text_domain' ); ?></label>
<input class="widefat" id="<?php echo $this->get_field_id( 'facebook_url' ); ?>" name="<?php echo $this->get_field_name( 'facebook_url' ); ?>" type="text" value="<?php echo esc_attr( $facebook_url ); ?>">
</p>
<p>
<label for="<?php echo $this->get_field_id( 'youtube_url' ); ?>"><?php esc_html_e( 'URL YouTube:', 'text_domain' ); ?></label>
<input class="widefat" id="<?php echo $this->get_field_id( 'youtube_url' ); ?>" name="<?php echo $this->get_field_name( 'youtube_url' ); ?>" type="text" value="<?php echo esc_attr( $youtube_url ); ?>">
</p>
<p>
<label for="<?php echo $this->get_field_id( 'instagram_url' ); ?>"><?php esc_html_e( 'URL Instagram:', 'text_domain' ); ?></label>
<input class="widefat" id="<?php echo $this->get_field_id( 'instagram_url' ); ?>" name="<?php echo $this->get_field_name( 'instagram_url' ); ?>" type="text" value="<?php echo esc_attr( $instagram_url ); ?>">
</p>
<?php
}

public function update( $new_instance, $old_instance ) {
$instance = array();
$instance['facebook_url'] = esc_url( $new_instance['facebook_url'] );
$instance['youtube_url'] = esc_url( $new_instance['youtube_url'] );
$instance['instagram_url'] = esc_url( $new_instance['instagram_url'] );
return $instance;
}
}

function dang_ky_widget_mangxahoi() {
register_widget( 'Widget_MangXaHoi' );
}

add_action( 'widgets_init', 'dang_ky_widget_mangxahoi' );