Video 7 </div> </div> <div class="clearfix text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item"><p>Esta es la segunda parte del tutorial, empieza por ver el <a href="http://drupalmexico.com/usando-el-modulo-picture-drupal-7-primera-parte" target="_self">primer video</a> para aprender a usar este modulo que permite tener diferentes versiones de una imagen dependiendo el dispositivo en el que se vea el sitio web hecho en drupal. Una buena manera de resolver como funcionan las imágenes en un diseño responsivo. El modulo de picture se puede bajar en http://drupal.org/project/picture</p><p>También existe en un inglés un tutorial con imágenes http://webwash.net/tutorials/handle-responsive-images-using-picture-module-drupal-7</p></div> <div class="field field--name-taxonomy-vocabulary-2 field--type-entity-reference field--label-above"> <div class="field__label">Categorias</div> <div class='field__items'> <div class="field__item"><a href="/index.php/es/category/categorias/modulos" hreflang="es">Modulos</a></div> <div class="field__item"><a href="/index.php/es/category/categorias/tutoriales" hreflang="es">Tutoriales</a></div> </div> </div> <div class="field field--name-taxonomy-vocabulary-3 field--type-entity-reference field--label-above"> <div class="field__label">Versión</div> <div class='field__items'> <div class="field__item"><a href="/index.php/es/category/versi%C3%B3n/drupal-7" hreflang="es">Drupal 7</a></div> </div> </div> <div class="inline__links"><nav class="links inline nav links-inline"><span class="comment-add nav-link"><a href="/index.php/es/usando-el-modulo-picture-drupal-7-segunda-parte#comment-form" title="Comparte tus ideas y opiniones." hreflang="es">Añadir nuevo comentario</a></span></nav> </div> <section class="field field--name-comment-node-page field--type-comment field--label-hidden comment-wrapper"> <article role="article" data-comment-user-id="0" id="comment-1029" class="comment js-comment by-anonymous clearfix"> <div class="comment__meta col-sm-3"> <span class="hidden text-danger" data-comment-timestamp="1367943640"></span> <article class="profile"> </article> <small class="comment__author"><span>PakoLopezA (no verificado)</span></small> </div> <div class="comment__content col-sm-9 card"> <div class="card-body"> <h3 class="card-title"><a href="/index.php/es/comment/1029#comment-1029" class="permalink" rel="bookmark" hreflang="und">Bien...</a></h3> <div class="clearfix text-formatted field field--name-comment-body field--type-text-long field--label-hidden field__item"><p>Lo probé en una vista, y funcionó correctamente, la configuración es la misma.</p> </div> <nav> <div class="inline__links"><nav class="links inline nav links-inline"><span class="comment-reply nav-link"><a href="/index.php/es/comment/reply/node/1382/comment_node_page/1029">Respuesta</a></span></nav> </div> </nav> </div> <div class="card-body"> <span class="comment__time">Mar, 07/05/2013 - 16:20</span> <span class="comment__permalink"><a href="/index.php/es/comment/1029#comment-1029" hreflang="und">Enlace permanente</a></span> </div> </div> </article> <h2 class='title comment-form__title'>Añadir nuevo comentario</h2> <form class="comment-comment-node-page-form comment-form antibot" data-user-info-from-browser data-drupal-selector="comment-form" data-action="/index.php/es/comment/reply/node/1382/comment_node_page" action="/antibot" method="post" id="comment-form" accept-charset="UTF-8"> <noscript> <div class="antibot-no-js antibot-message antibot-message-warning">You must have JavaScript enabled to use this form.</div> </noscript> <div class="js-form-item js-form-type-textfield form-type-textfield js-form-item-name form-item-name mb-3"> <label for="edit-name" class="js-form-required form-required">Su nombre</label> <input data-drupal-default-value="Anónimo" data-drupal-selector="edit-name" type="text" id="edit-name" name="name" value="" size="30" maxlength="60" class="required form-control" required="required" aria-required="true" /> </div> <div class="js-form-item js-form-type-email form-type-email js-form-item-mail form-item-mail mb-3"> <label for="edit-mail" class="js-form-required form-required">Correo electrónico</label> <input data-drupal-selector="edit-mail" aria-describedby="edit-mail--description" type="email" id="edit-mail" name="mail" value="" size="30" maxlength="64" class="form-email required form-control" required="required" aria-required="true" /> <small id="edit-mail--description" class="description text-muted"> El contenido de este campo se mantiene privado y no se mostrará públicamente. </small> </div> <div class="js-form-item js-form-type-url form-type-url js-form-item-homepage form-item-homepage mb-3"> <label for="edit-homepage">Página principal</label> <input data-drupal-selector="edit-homepage" type="url" id="edit-homepage" name="homepage" value="" size="30" maxlength="255" class="form-url form-control" /> </div> <input data-drupal-selector="form-xy9ja1v2upvsittgjn26kfgejunfkt1w8lcjt15wov0" type="hidden" name="form_build_id" value="form-xY9Ja1V2UpvSItTgJN26kFGeJunfkt1W8lCJT15wOv0" class="form-control" /> <input data-drupal-selector="edit-comment-comment-node-page-form" type="hidden" name="form_id" value="comment_comment_node_page_form" class="form-control" /> <input data-drupal-selector="edit-antibot-key" type="hidden" name="antibot_key" value="" class="form-control" /> <div class="field--type-string field--name-subject field--widget-string-textfield js-form-wrapper form-wrapper mb-3" data-drupal-selector="edit-subject-wrapper" id="edit-subject-wrapper"> <div class="js-form-item js-form-type-textfield form-type-textfield js-form-item-subject-0-value form-item-subject-0-value mb-3"> <label for="edit-subject-0-value">Asunto</label> <input class="js-text-full text-full form-control" data-drupal-selector="edit-subject-0-value" type="text" id="edit-subject-0-value" name="subject[0][value]" value="" size="60" maxlength="64" placeholder="" /> </div> </div> <div class="field--type-text-long field--name-comment-body field--widget-text-textarea js-form-wrapper form-wrapper mb-3" data-drupal-selector="edit-comment-body-wrapper" id="edit-comment-body-wrapper"> <div class="js-text-format-wrapper text-format-wrapper js-form-item form-item"> <div class="js-form-item js-form-type-textarea form-type-textarea js-form-item-comment-body-0-value form-item-comment-body-0-value mb-3"> <label for="edit-comment-body-0-value" class="js-form-required form-required">Comentario</label> <div class="form-textarea-wrapper"> <textarea class="js-text-full text-full form-textarea required form-control resize-vertical" data-drupal-selector="edit-comment-body-0-value" id="edit-comment-body-0-value" name="comment_body[0][value]" rows="5" cols="60" placeholder="" required="required" aria-required="true"></textarea> </div> </div> <div class="js-filter-wrapper js-form-wrapper form-wrapper mb-3" data-drupal-selector="edit-comment-body-0-format" id="edit-comment-body-0-format"><div data-drupal-selector="edit-comment-body-0-format-help" id="edit-comment-body-0-format-help" class="js-form-wrapper form-wrapper mb-3"><a href="/index.php/es/filter/tips" target="_blank" data-drupal-selector="edit-comment-body-0-format-help-about" id="edit-comment-body-0-format-help-about">Acerca de formatos de texto</a></div> <div class="js-filter-guidelines js-form-wrapper form-wrapper mb-3" data-drupal-selector="edit-comment-body-0-format-guidelines" id="edit-comment-body-0-format-guidelines"><div data-drupal-format-id="restricted_html" class="filter-guidelines-item filter-guidelines-restricted_html"> <h4 class="label">HTML Restringido</h4> <ul class="tips"> <li>Etiquetas HTML permitidas: <a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <h2 id> <h3 id> <h4 id> <h5 id> <h6 id></li> <li>Saltos automáticos de líneas y de párrafos.</li> <li>Las direcciones de correos electrónicos y páginas web se convierten en enlaces automáticamente.</li> </ul> </div> </div> </div> </div> </div> <div data-drupal-selector="edit-actions" class="form-actions js-form-wrapper form-wrapper mb-3" id="edit-actions"><button data-drupal-selector="edit-submit" type="submit" id="edit-submit" name="op" value="Guardar" class="button button--primary js-form-submit form-submit btn btn-primary">Guardar</button> <button data-drupal-selector="edit-preview" type="submit" id="edit-preview" name="op" value="Vista previa" class="button js-form-submit form-submit btn btn-primary">Vista previa</button> </div> </form> </section> </div> </article> </div> </div> </section> </main> <div class="sidebar_second sidebar col-md-4 order-last" id="sidebar_second"> <aside class="section" role="complementary"> <div id="block-awesomedrupalista" class="block-content-basic block block-block-content block-block-content58aed745-bf34-4c87-a504-1d9df00efb55"> <h2>Gorro de pescador Ambitious drupalista</h2> <div class="content"> <div class="clearfix text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item"><p><a href="https://www.redbubble.com/es/i/gorro-de-pescador/Con-Drupal-soy-un-ambicioso-constructor-de-sitios-web-de-ivanmejia/151649718.51XZU?asc=u"><img data-entity-uuid="2fbc7a1e-0aea-4dfc-aaa2-e462188b3eb0" data-entity-type="file" src="/sites/default/files/inline-images/gorro.jpg" width="260" height="260" alt="gorro de pescador de drupalero" loading="lazy"></a></p></div> </div> </div> <div id="block-drupalmex-mastodon" class="block-content-basic block block-block-content block-block-content54cd708b-28db-4799-a12b-1621570927fb"> <h2>Mastodon</h2> <div class="content"> <div class="clearfix text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item"><p>Estamos en <a href="https://mstdn.mx/@drupalero@drupalmexico.com">mastodon/fediverso</a></p> </div> </div> </div> <div class="search-block-form block block-search block-search-form-block" data-drupal-selector="search-block-form" id="block-drupalmex-search" role="search"> <h2>Buscador</h2> <div class="content container-inline"> <div class="content container-inline"> <form action="/index.php/es/search/node" method="get" id="search-block-form" accept-charset="UTF-8" class="search-form search-block-form form-row"> <div class="js-form-item js-form-type-search form-type-search js-form-item-keys form-item-keys form-no-label mb-3"> <label for="edit-keys" class="visually-hidden">Buscar</label> <input title="Escriba lo que quiere buscar." data-drupal-selector="edit-keys" type="search" id="edit-keys" name="keys" value="" size="15" maxlength="128" class="form-search form-control" /> </div> <div data-drupal-selector="edit-actions" class="form-actions js-form-wrapper form-wrapper mb-3" id="edit-actions"><button data-drupal-selector="edit-submit" type="submit" id="edit-submit" value="Buscar" class="button js-form-submit form-submit btn btn-primary">Buscar</button> </div> </form> </div> </div> </div> <div id="block-cursobasicodedrupalgratuito" class="block-content-basic block block-block-content block-block-content5adfff79-2a58-4ffe-8aac-368ad0bceaac"> <div class="content"> <div class="clearfix text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item"><p><a href="https://www.udemy.com/course/curso-basico-de-drupal/"><img alt="curso basico de drupal 7" data-entity-type="file" data-entity-uuid="a1f732c0-a68c-41c0-8349-65908c89f783" src="/sites/default/files/inline-images/curosbasicodedrupal.jpg" width="450" height="125" loading="lazy"></a></p> </div> </div> </div> <div id="block-bajadrupal" class="block-content-basic block block-block-content block-block-content484210ec-68ea-4604-987c-339cd2dca129"> <div class="content"> <div class="clearfix text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item"><p><a href="https://www.drupal.org/download"><img alt="baja la version reciente de drupal" data-entity-type="file" data-entity-uuid="4178cd09-2b38-412d-97c5-a20c88cf3f74" src="/sites/default/files/inline-images/bajadrupal.jpg" width="450" height="125" loading="lazy"></a></p> </div> </div> </div> </aside> </div> </div> </div> </div> <!-- Contenido abajo --> <!-- Dos espacios portada --> <!-- Tres espacios --> <div class="featured-center"> <aside class="container clearfix" role="complementary"> <div class="row"> <div class="col-md-4"> <section class="row region region-featured-first"> <div class="views-element-container block block-views block-views-blocktemas-termino-destacado-block-1" id="block-views-block-temas-termino-destacado-block-1"> <h2>Temas y diseño</h2> <div class="content"> <div><div class="view view-temas-termino-destacado view-id-temas_termino_destacado view-display-id-block_1 js-view-dom-id-370922e43f8be2962eab2ac9ffac3fccac46bf737e4c7bd940a86db5bfeba49d"> <div class="view-content row"> <div class="views-row"> <div class="views-field views-field-title"><h3 class="field-content"><a href="/index.php/es/iniciativa-design-systems-drupal" hreflang="es">Iniciativa de Design Systems en Drupal</a></h3></div><div class="views-field views-field-body"><div class="field-content">Una de las cosas que parece avanzar muy lentamente es el desarrollo de los temas en Drupal.</div></div> </div> </div> </div> </div> </div> </div> <div class="views-element-container block block-views block-views-blocknoticias-termino-destacado-block-1" id="block-views-block-noticias-termino-destacado-block-1"> <h2>Noticias</h2> <div class="content"> <div><div class="view view-noticias-termino-destacado view-id-noticias_termino_destacado view-display-id-block_1 js-view-dom-id-85af816a46c2354d985cb844135635493e4fc245d753bf402c95173faa9a0f39"> <div class="view-content row"> <div class="views-row"> <div class="views-field views-field-title"><h3 class="field-content"><a href="/index.php/es/nuevas-actualizaciones-seguridad-noviembre" hreflang="es">Nuevas actualizaciones de seguridad en Noviembre</a></h3></div><div class="views-field views-field-body"><div class="field-content">Salieron varios reportes de seguridad para el core de Drupal y se tiene que actualizar a</div></div> </div> </div> </div> </div> </div> </div> </section> </div> <div class="col-md-4"> <section class="row region region-featured-second"> <div class="views-element-container block block-views block-views-blockevento-termino-destacado-block-1" id="block-views-block-evento-termino-destacado-block-1"> <h2>Eventos</h2> <div class="content"> <div><div class="view view-evento-termino-destacado view-id-evento_termino_destacado view-display-id-block_1 js-view-dom-id-2a8958257b8c65e8b60fa4d245b7226a23c3aca4b6cd5d36e1e70fb2078f87a6"> <div class="view-content row"> <div class="views-row"> <div class="views-field views-field-title"><h3 class="field-content"><a href="/index.php/es/taller-drupal-xalapa-30-octubre" hreflang="es">Taller de Drupal en Xalapa - 30 de Octubre</a></h3></div><div class="views-field views-field-body"><div class="field-content">Como parte del installfest en la Facultad de Informat</div></div> </div> </div> </div> </div> </div> </div> <div class="views-element-container block block-views block-views-blockprincipiantes-termino-destacado-block-1" id="block-views-block-principiantes-termino-destacado-block-1"> <h2>Principiantes</h2> <div class="content"> <div><div class="view view-principiantes-termino-destacado view-id-principiantes_termino_destacado view-display-id-block_1 js-view-dom-id-5a1ee4272a19dfe17a85d3439deaf32feb20c9b388e103b216c3c4ad85bdd70f"> <div class="view-content row"> <div class="views-row"> <div class="views-field views-field-title"><h3 class="field-content"><a href="/index.php/es/diez-maneras-mejorar-tus-habilidades-programaci%C3%B3n-drupal" hreflang="es">Diez maneras de mejorar tus habilidades de programación en Drupal</a></h3></div><div class="views-field views-field-body"><div class="field-content"> Sigue a los expertos en programación de Drupal y personas influyentes en las redes sociales y aprenda de sus experiencias e ideas. </div></div> </div> </div> </div> </div> </div> </div> </section> </div> <div class="col-md-4"> <section class="row region region-featured-third"> <div class="views-element-container block block-views block-views-blockopiniones-termino-destacado-block-1" id="block-views-block-opiniones-termino-destacado-block-1"> <h2>Opiniones</h2> <div class="content"> <div><div class="view view-opiniones-termino-destacado view-id-opiniones_termino_destacado view-display-id-block_1 js-view-dom-id-ffc20c52daa67a2c2cc103ebc05acb429329fc661d46faf5b822501c9aed6d94"> <div class="view-content row"> <div class="views-row"> <div class="views-field views-field-title"><h3 class="field-content"><a href="/index.php/es/cambiar-ajax-htmx-drupal" hreflang="es">Cambiar AJAX por HTMX en Drupal</a></h3></div><div class="views-field views-field-body"><div class="field-content">Desde el año pasado tienen esta propuesta de cambiar el viejo sistema de ajax qu</div></div> </div> </div> </div> </div> </div> </div> <div class="views-element-container block block-views block-views-blockseguridadtermino-destacado-block-1" id="block-views-block-seguridadtermino-destacado-block-1"> <h2>Seguridad</h2> <div class="content"> <div><div class="view view-seguridadtermino-destacado view-id-seguridadtermino_destacado view-display-id-block_1 js-view-dom-id-6f69591972a17c308dab72836212617c4ef7489016aa2a18f3bb8e74c0631ebc"> <div class="view-content row"> <div class="views-row"> <div class="views-field views-field-title"><h3 class="field-content"><a href="/index.php/es/nueva-fecha-para-terminar-con-drupal-7" hreflang="es">Nueva fecha para terminar con Drupal 7</a></h3></div><div class="views-field views-field-body"><div class="field-content">Acaba de sacar un nuevo comunicando donde informan que será el 5 de Enero de 2025 cuando por fi</div></div> </div> </div> </div> </div> </div> </div> </section> </div> </div> </aside> </div> <!-- Tres espacios más --> <footer class="site-footer"> <div class="container"> <div class="site-footer__bottom"> <section class="row region region-footer-fifth"> <nav role="navigation" aria-labelledby="block-drupalmex-footer-menu" id="block-drupalmex-footer" class="block block-menu navigation menu--footer"> <h2 class="visually-hidden" id="block-drupalmex-footer-menu">Menú del pie</h2> <ul class="clearfix nav navbar-nav"> <li class="nav-item"> <a href="/index.php/contacto" class="nav-link nav-link--indexphp-contacto">Contacto</a> </li> <li class="nav-item"> <a href="/index.php/es/glossary" class="nav-link nav-link--indexphp-es-glossary" data-drupal-link-system-path="glossary">Glosario</a> </li> <li class="nav-item"> <a href="/index.php/es/videos-drupal" title="Videos de drupal" class="nav-link nav-link--indexphp-es-videos-drupal" data-drupal-link-system-path="videos-drupal">Videos de drupal</a> </li> <li class="nav-item"> <a href="/index.php/es/rss.xml" title="enlace al rss del sitio web" class="nav-link nav-link--indexphp-es-rssxml" data-drupal-link-system-path="rss.xml">RSS</a> </li> <li class="nav-item"> <a href="https://drupalmexico.com/sitemap.xml" class="nav-link nav-link-https--drupalmexicocom-sitemapxml">XML</a> </li> </ul> </nav> <div id="block-drupalmex-powered" class="block block-system block-system-powered-by-block"> <div class="content"> <span>Funciona con <a href="https://www.drupal.org">Drupal</a></span> </div> </div> <nav role="navigation" aria-labelledby="block-drupalmex-account-menu-menu" id="block-drupalmex-account-menu" class="block block-menu navigation menu--account"> <h2 class="visually-hidden" id="block-drupalmex-account-menu-menu">Menú de cuenta de usuario</h2> <div class="clearfix nav"> <a href="/index.php/es/user/login" class="nav-link nav-link--indexphp-es-user-login" data-drupal-link-system-path="user/login">Iniciar sesión</a> </div> </nav> <div id="block-drupalmex-tradermark" class="block-content-basic block block-block-content block-block-contentd5351e75-a2b6-4a23-8d88-5ac924c1f4b4"> <div class="content"> <div class="clearfix text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item"><p><span>Drupal is a registered trademark of Dries Buytaert, who retains sole ownership and control of this policy and any trademark licensing.</span></p></div> </div> </div> </section> </div> </div> </footer> </div> </div> </div> <script type="application/json" data-drupal-selector="drupal-settings-json">{"path":{"baseUrl":"\/index.php\/","pathPrefix":"es\/","currentPath":"node\/1382","currentPathIsAdmin":false,"isFront":false,"currentLanguage":"es"},"pluralDelimiter":"\u0003","suppressDeprecationErrors":true,"google_analytics":{"account":"UA-98041-11","trackOutbound":true,"trackMailto":true,"trackTel":true,"trackDownload":true,"trackDownloadExtensions":"7z|aac|arc|arj|asf|asx|avi|bin|csv|doc(x|m)?|dot(x|m)?|exe|flv|gif|gz|gzip|hqx|jar|jpe?g|js|mp(2|3|4|e?g)|mov(ie)?|msi|msp|pdf|phps|png|ppt(x|m)?|pot(x|m)?|pps(x|m)?|ppam|sld(x|m)?|thmx|qtm?|ra(m|r)?|sea|sit|tar|tgz|torrent|txt|wav|wma|wmv|wpd|xls(x|m|b)?|xlt(x|m)|xlam|xml|z|zip"},"ajaxTrustedUrl":{"\/index.php\/es\/search\/node":true,"\/index.php\/es\/comment\/reply\/node\/1382\/comment_node_page":true},"antibot":{"forms":{"comment-form":{"id":"comment-form","key":"YBwTlcduv6pYrZD5ZF5VJLj4mWmpkQkRNzNMIA6hsGx"}}},"user":{"uid":0,"permissionsHash":"fed7a60cd5d69eb65dbd32744abaa7f9dd3bb7b81c09a814104f646f59b3c202"}}</script> <script src="/sites/default/files/js/js_eGqUA7hkuTuepdIP38z8RlnKKFXEYJb2Mml_WkF22qs.js?scope=footer&delta=0&language=es&theme=drupalmex&include=eJxdi1sKwzAMBC9k10cKsqMIgSwFWX349i1N2kK_lhlmyYwEF1CQGdxGoT-RVr_uIB0fhcQqSB4xhZVSs95RoxzB5cRcZ74x3tFTNYsRDvtSwZ2t_ERb9fV3_Jw3855Ag6tFOfeQG0ugf7s3PQF-eEc-"></script> <script src="//cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js"></script> <script src="/sites/default/files/js/js_NPGCJKbCNrI-m_cI2H5L5_J1tyb_hXEIJ_UYhgb0fA8.js?scope=footer&delta=2&language=es&theme=drupalmex&include=eJxdi1sKwzAMBC9k10cKsqMIgSwFWX349i1N2kK_lhlmyYwEF1CQGdxGoT-RVr_uIB0fhcQqSB4xhZVSs95RoxzB5cRcZ74x3tFTNYsRDvtSwZ2t_ERb9fV3_Jw3855Ag6tFOfeQG0ugf7s3PQF-eEc-"></script> </body> </html>
