Como oEmbed do campo personalizado, responsivo ao tamanho do contêiner e responsivo

Estou usando Magic Fields 2 para adicionar campos personalizados / meta checkboxs.

Um campo personalizado é para um URL de vídeo do Vimeo ou do YouTube ser exibido.

O seguinte código oEmbeds o URL do vídeo :

ID, 'video_url', TRUE))=='')) { echo wp_oembed_get( get_post_meta($post->ID, "video_url", true) ); }?> 

Para resize o vídeo, usei o código dentro de

e redimensionou-o usando CSS – .video iframe {width:500px;height:312px} .

O problema, este método não é responsivo.

Eu também tentei .video iframe {width:95%;height:95%} . Esta saídas parece –

insira a descrição da imagem aqui

O plugin Fluid Video Embeds parece fazer o trabalho para oEmbeds através do método normal do WordPress e através do shortcode, mas não com o uso de um campo personalizado.

Solutions Collecting From Web of "Como oEmbed do campo personalizado, responsivo ao tamanho do contêiner e responsivo"

Eu completei a tarefa com fitvids.js usando o plugin FitVids para WordPress .

Chris Coyier descreve a integração com o WordPress em seu screencast Integrando o FitVids.js no WordPress ( no YouTube ).

Meu nome de campo personalizado é video_url . Usei o seguinte código no meu modelo:

 < ?php if (!((get_post_meta($post->ID, 'video_url', TRUE))=='')) { echo wp_oembed_get( get_post_meta($post->ID, "video_url", true) ); }?> 

Nas configurações do FitVids para WordPress, basta inserir a class div divisória ou ID que representa a largura máxima do vídeo.

insira a descrição da imagem aqui

Para quem precisa, integrar o FitVids.js no screencast do WordPress mostra como verificar o tema do jQuery e do seletor CSS apropriado.