Or, embed this snippet using GenerateWP WordPress Plugin.

Download

Clone

iFrame Widget

class iframe_widget extends WP_Widget {

	public function __construct() {

		parent::__construct(
			'iframe_widget',
			__( 'iFrame Widget', 'text_domain' ),
			array(
				'description' => __( 'Widget to embed provided url into an iFrame', 'text_domain' ),
				'classname'   => 'iframe',
			)
		);

	}

	public function widget( $args, $instance ) {

		$url = apply_filters( 'widget_title', $instance['iframe_page_url'] );
		$ratio = apply_filters( 'widget_title', $instance['iframe_ratio'] );
		echo '<div class="widget_iframe_wrapper '.$ratio.'">';
			echo '<iframe frameborder="0" width="100%" height="100%" src="'.$url.'"></iframe>';
		echo '</div>';

	}

	public function form( $instance ) {

		// Set default values
		$instance = wp_parse_args( (array) $instance, array( 
			'iframe_page_url' => '',
			'iframe_ratio' => '',
		) );

		// Retrieve an existing value from the database
		$iframe_page_url = !empty( $instance['iframe_page_url'] ) ? $instance['iframe_page_url'] : '';
		$iframe_ratio = !empty( $instance['iframe_ratio'] ) ? $instance['iframe_ratio'] : '';

		// Form fields
		echo '<p>';
		echo '	<label for="' . $this->get_field_id( 'iframe_page_url' ) . '" class="iframe_page_url_label">' . __( 'Page URL', 'text_domain' ) . '</label>';
		echo '	<input type="url" id="' . $this->get_field_id( 'iframe_page_url' ) . '" name="' . $this->get_field_name( 'iframe_page_url' ) . '" class="widefat" placeholder="' . esc_attr__( '', 'text_domain' ) . '" value="' . esc_attr( $iframe_page_url ) . '">';
		echo '	<span class="description">' . __( 'Url of the page to frame.', 'text_domain' ) . '</span>';
		echo '</p>';

		echo '<p>';
		echo '	<label for="' . $this->get_field_id( 'iframe_ratio' ) . '" class="iframe_ratio_label">' . __( 'Ratio', 'text_domain' ) . '</label>';
		echo '	<select id="' . $this->get_field_id( 'iframe_ratio' ) . '" name="' . $this->get_field_name( 'iframe_ratio' ) . '" class="widefat">';
		echo '		<option value="sixteenXnine" ' . selected( $iframe_ratio, 'sixteenXnine', false ) . '> ' . __( '16x9', 'text_domain' ) . '</option>';
		echo '		<option value="fourXthree" ' . selected( $iframe_ratio, 'fourXthree', false ) . '> ' . __( '4x3', 'text_domain' ) . '</option>';
		echo '		<option value="oneXone" ' . selected( $iframe_ratio, 'oneXone', false ) . '> ' . __( '1x1', 'text_domain' ) . '</option>';
		echo '		<option value="threeXfour" ' . selected( $iframe_ratio, 'threeXfour', false ) . '> ' . __( '3x4', 'text_domain' ) . '</option>';
		echo '		<option value="nineXsixteen" ' . selected( $iframe_ratio, 'nineXsixteen', false ) . '> ' . __( '9x16', 'text_domain' ) . '</option>';
		echo '	</select>';
		echo '	<span class="description">' . __( 'Ratio of the bounding box.', 'text_domain' ) . '</span>';
		echo '</p>';

	}

	public function update( $new_instance, $old_instance ) {

		$instance = $old_instance;

		$instance['iframe_page_url'] = !empty( $new_instance['iframe_page_url'] ) ? strip_tags( $new_instance['iframe_page_url'] ) : '';
		$instance['iframe_ratio'] = !empty( $new_instance['iframe_ratio'] ) ? strip_tags( $new_instance['iframe_ratio'] ) : '';

		return $instance;

	}

}

function iframe_register_widgets() {
	register_widget( 'iframe_widget' );
}
add_action( 'widgets_init', 'iframe_register_widgets' );