Haga que WordPress WYSIWYG no elimine los iframe

16

Tengo un blog que a menudo necesito insertar iframes en publicaciones por varias razones (¡no pregunte por qué solo confía en mí!)

Cuando uso la vista "visual" para editar mis publicaciones, WYSIWYG elimina constantemente mis iframes ...

Sé que puedo mantener los marcos flotantes en el post si uso la vista "html" y sólo ver / guardar desde el "html" vista ... sin embargo me gustaría realmente como para ser capaz de utilizar el WYSIWYG normal a editar mi post sin tener que recurrir a la vista "html".

¿Hay algo que pueda hacer para deshabilitar este comportamiento? He visto esta publicación , que sugiere la edición wp-includes/js/tinymce/tiny_mce_config.php, ¡pero realmente prefiero evitar hacer algo como eso que probablemente interrumpiría una actualización!

Justin Jenkins
fuente
La publicación a la que se vinculó también tiene una solución de filtro sin edición de Otto. ¿Lo habías intentado?
Rarst
Para aclarar un poco más, prefiero no tener que hackear algunos PHP para hacerlo (probablemente me olvide, actualizar y romper cosas) ... si es una cuestión de configuración (incluso si eso es en PHP) o algo que puedo hacer diciendo, envolviendo un poco de código alrededor de mi iframe que también funcionaría. En este punto, es probable que solo use JavaScript para hacerlo, pero eso parece desordenado.
Justin Jenkins
1
No hay una opción de configuración para esto, y no hay forma de codificarlo en el editor (sería un agujero de seguridad si existiera una solución). Poner el código mencionado en un complemento es la mejor manera de hacerlo, y también sobrevivirá a las actualizaciones (los complementos no se eliminan cuando se actualiza).
Jan Fabry
@ Jan, esperando que haya alguien que sepa algo que nosotros no sabemos ... Si no, gracias. Parece extraño que sea un segundo agujero solo en la parte visual, no en el HTML. Entiendo que es más fácil deslizar las cosas bajo la nariz de las personas en modo visual ... Pero aún así.
Justin Jenkins
iframesson útiles para incrustar videos. El <object>método se basa en flash, mientras que el <iframe>método, que la mayoría de los sitios para compartir videos admite en estos días, permite el video HTML5.
TRiG

Respuestas:

9

Si no desea escribir su propio código, hay un complemento para permitir la incrustación de <iframe>:

Luego solo usa el shortcode como este:

[iframe http://example.com 400 500]
Ethan Seifert
fuente
@ Ethan Seifert - ¡Buena respuesta!
MikeSchinkel
Esto realmente se aplica a mi pregunta, no se requiere "pirateo". Mientras todavía necesito usar la vista HTML ... Gracias.
Justin Jenkins
El complemento en esta respuesta ya no está actualizado, pero este se ve bien en su lugar: wordpress.org/plugins/iframe
Tim Malone
23

Puede personalizar el filtro de TinyMCE; consulte el siguiente ejemplo para obtener <iframe>otras etiquetas y usar Google Maps dentro de TinyMCE.

function fb_change_mce_options( $initArray ) {

    // Comma separated string od extendes tags.
    // Command separated string of extended elements.
    $ext = 'pre[id|name|class|style],iframe[align|longdesc|name|width|height|frameborder|scrolling|marginheight|marginwidth|src]';

    if ( isset( $initArray['extended_valid_elements'] ) ) {
        $ext = ',' . $ext;
    }
    $initArray['extended_valid_elements'] = $ext;

    // Maybe, set tiny parameter verify_html
    //$initArray['verify_html'] = false;

    return $initArray;
}
add_filter( 'tiny_mce_before_init', 'fb_change_mce_options' );

Agregue esto a un complemento personalizado o functions.php del tema. También puede leer más información en mi publicación: http://wpengineer.com/1963/customize-wordpress-wysiwyg-editor/

bueltge
fuente
@bueltge - Buena respuesta. Estaba en su sitio leyendo esa misma publicación el día de hoy. Ya sabes, la mayoría de los ejemplos en la web de TinyMCE no están en el contexto de WordPress y cuando en el contexto de WordPress es significativamente más complicado. Claramente lo entiendes bien. Hay mucho más que podrías cubrir sobre TinyMCE; ¿Has considerado hacer una serie de publicaciones en el blog?
MikeSchinkel
mi mayor problema es el tiempo; pero tengo otra publicación sobre este tema en mis borradores y tal vez publique esto en las próximas semanas. Gracias por tu homenaje.
bueltge
1

Tuve que actualizar a wordpress 3.2.1 y luego instalé Embed Iframe y funcionó muy bien.

Los marcos de iframe ya no se eliminaron al cambiar de html a Visual en wordpress.

WordpressDude
fuente
1

En un entorno multisitio, todos los usuarios que no sean superadmin obtienen el filtro html (debido a posibles vulnerabilidades de seguridad ). En base a esto , puede agregar Agregar capacidad unfiltered_html a los editores.

/**
 * Enable unfiltered_html capability for Editors.
 *
 * @param  array  $caps    The user's capabilities.
 * @param  string $cap     Capability name.
 * @param  int    $user_id The user ID.
 * @return array  $caps    The user's capabilities, with 'unfiltered_html' potentially added.
 */
function km_add_unfiltered_html_capability_to_editors( $caps, $cap, $user_id ) {
    if ( 'unfiltered_html' === $cap && user_can( $user_id, 'editor' ) ) {
        $caps = array( 'unfiltered_html' );
    }
    return $caps;
}
add_filter( 'map_meta_cap', 'km_add_unfiltered_html_capability_to_editors', 1, 3 );
estibador
fuente
0

Si no desea utilizar un complemento adicional para la solución de código corto, puede agregar algo en este sentido a su tema, complemento o functions.php para agregarlo a mano. Si es necesario, es posible que deba agregar algunas claves más al conjunto de claves.

add_shortcode( 'iframe' , 'mycustom_shortcode_iframe' );
function mycustom_shortcode_iframe($args, $content) {
    $keys = array("src", "width", "height", "scrolling", "marginwidth", "marginheight", "frameborder");
    $arguments = mycustom_extract_shortcode_arguments($args, $keys);
    return '<iframe ' . $arguments . '></iframe>';
}

function mycustom_extract_shortcode_arguments($args, $keys) {
    $result = "";
    foreach ($keys as $key) {
        if (isset($args[$key])) {
            $result .= $key . '="' . $args[$key] . '" ';
        }
    }
    return $result;
}

Luego, en su página de publicación, el uso sería así:

[iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.de/maps?f=q&amp;source=s_q&amp;hl=de&amp;geocode=&amp;q=New+York+City,+New+York,+USA&amp;aq=0&amp;oq=new+york&amp;sll=51.238455,6.81435&amp;sspn=0.373151,1.056747&amp;ie=UTF8&amp;hq=&amp;hnear=New+York+City,+New+York,+Vereinigte+Staaten&amp;t=m&amp;z=11&amp;iwloc=A&amp;output=embed"]
SunnyRed
fuente
no funciona. es solo publicar el iframe como el mismo contenido
Ankit Agrawal
No sé qué quiere que haga el código, pero publicar el iframe en el contenido tal como lo ha escrito es lo que se supone que debe hacer el código. Entonces, si el iframe aparece en su vista frontend, todo funciona como se esperaba.
SunnyRed
0

Descubrí que usar el complemento Fusion Editor para construir mis páginas en Wordpress funciona bien.

Este video muestra cómo usar Fusion Builder (pase a las 4:15 para la parte sobre agregar contenedores, columnas, elementos y bloques de código): https://www.youtube.com/watch?v=UDyNsnB_COA

Hago clic para agregar un contenedor, luego hago clic en Agregar elemento, y luego agrego un bloque de código en lugar de un bloque de texto (el bloque de texto eliminará un iframe, pero un bloque de código no lo hará). En mi bloque de código pego mi código de iframe y publico. ¡Funciona muy bien y no tengo que modificar ningún archivo PHP!

Brandon Barney
fuente