<?xml version='1.0' encoding='UTF-8'?><?xml-stylesheet href="http://www.blogger.com/styles/atom.css" type="text/css"?><feed xmlns='http://www.w3.org/2005/Atom' xmlns:openSearch='http://a9.com/-/spec/opensearchrss/1.0/' xmlns:blogger='http://schemas.google.com/blogger/2008' xmlns:georss='http://www.georss.org/georss' xmlns:gd="http://schemas.google.com/g/2005" xmlns:thr='http://purl.org/syndication/thread/1.0'><id>tag:blogger.com,1999:blog-12602009</id><updated>2026-01-16T02:43:09.749-06:00</updated><category term="Consejos"/><category term="Asp.Net"/><category term="Open Source"/><category term="Software"/><category term="Microsoft"/><category term="WordPress 2.0"/><category term="Diseño"/><category term="Veracruz"/><category term="Tip"/><category term="Truco"/><category term="Enlace Veracruzano"/><category term="General"/><category term="Soluciones"/><category term="Browsers"/><category term="GoDaddy"/><category term="MySQL"/><category term="SQL"/><category term="Live"/><category term="Noticias"/><category term="Windows Live"/><category term="Internet de Mexico"/><category term="Java"/><category term="Mono"/><category term="OSCommerce"/><category term="PHP"/><category term="Triara"/><category term="eHealth"/><category term="AUTOCAD"/><category term="CRM"/><category term="Google"/><category term="MS CUI"/><category term="MVC"/><category term="Visual Studio"/><category term="encriptar"/><title type='text'>Blog de Llanura.com</title><subtitle type='html'>Blog de la empresa Llanura.com (http://www.llanura.com),   ubicada en Veracruz, Ver.&#xa;Empresa enfocada al desarrollo de aplicaciones web empresariales, usando herramientas de codigo fuente abierto.</subtitle><link rel='http://schemas.google.com/g/2005#feed' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/posts/default'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/'/><link rel='hub' href='http://pubsubhubbub.appspot.com/'/><link rel='next' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default?start-index=26&amp;max-results=25'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><generator version='7.00' uri='http://www.blogger.com'>Blogger</generator><openSearch:totalResults>168</openSearch:totalResults><openSearch:startIndex>1</openSearch:startIndex><openSearch:itemsPerPage>25</openSearch:itemsPerPage><entry><id>tag:blogger.com,1999:blog-12602009.post-3829629358524808004</id><published>2021-12-10T19:36:00.001-06:00</published><updated>2021-12-10T19:36:31.743-06:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="AUTOCAD"/><category scheme="http://www.blogger.com/atom/ns#" term="Consejos"/><category scheme="http://www.blogger.com/atom/ns#" term="Diseño"/><title type='text'></title><content type='html'>&lt;h1 style=&quot;text-align: left;&quot;&gt;&amp;nbsp;AUTOCAD Alineación horizontal o vertical.&lt;/h1&gt;&lt;div&gt;Esto es como siempre un recordatorio personal de cómo realizar algunas cosas en software, si alguien esta buscando la solución a una alineación horizontal en algún plano o dibujo de AUTOCAD, aquí como resolví.&lt;/div&gt;&lt;div&gt;Antes que nada recordar que AUTOCAD no es un programa de imágenes o de ilustración, y aunque estoy acostumbrado a tener un botón que realice la alineación en cualquier programa como:&lt;/div&gt;&lt;div&gt;&lt;br /&gt;&lt;/div&gt;&lt;div&gt;&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjb5qXbdnTbG4pVS3UAR5kLljykON5E2uWAEGEajVP1ShDXmERwjDMTBW6nesvGCiQcdoV3eYEH_x615ZK7xv9Qey6AOxqPVeehJ-Bpvp5eNtFL18yYX8gczqHASFQBVUjtBoAW/s512/align_top_icon_173453.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; data-original-height=&quot;512&quot; data-original-width=&quot;512&quot; height=&quot;196&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjb5qXbdnTbG4pVS3UAR5kLljykON5E2uWAEGEajVP1ShDXmERwjDMTBW6nesvGCiQcdoV3eYEH_x615ZK7xv9Qey6AOxqPVeehJ-Bpvp5eNtFL18yYX8gczqHASFQBVUjtBoAW/w196-h196/align_top_icon_173453.png&quot; width=&quot;196&quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;br /&gt;En AUTOCAD esto no existe, pero es mas fácil de lo que parece, aquí el problema:&lt;/div&gt;&lt;div&gt;&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0ExsgETFVrja6OtSIAZtpHqt-ixUc-XUNFwttwViq5UW40fbHNQE4nDdqCgLlLU7thL0LPwcuDCXjInvK4aXrG7f9uyHMjZMF_Us_cFFjReVf8DZ7D_C4_b9VW1mIeeIo4gN-/&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img alt=&quot;&quot; data-original-height=&quot;368&quot; data-original-width=&quot;1233&quot; height=&quot;192&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0ExsgETFVrja6OtSIAZtpHqt-ixUc-XUNFwttwViq5UW40fbHNQE4nDdqCgLlLU7thL0LPwcuDCXjInvK4aXrG7f9uyHMjZMF_Us_cFFjReVf8DZ7D_C4_b9VW1mIeeIo4gN-/w640-h192/desorden.jpg&quot; width=&quot;640&quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;br /&gt;Lo que quiero es alinear todos los objetos en la línea naranja, para esto revisamos cual es la POSICION Y de la línea naranja en la propiedades del la línea:&lt;/div&gt;&lt;div&gt;&lt;br /&gt;&lt;/div&gt;&lt;div&gt;&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisYsNFwEv0-vRVEaEbEi0R9MmC1gsWjN6XR5DAMou3_jQl6TriiJanM3SnKkwboRlzClxKnjV0wgf5lXoOuSAiM5qdqnENlYNFH8qGnterNhiy4VzoUAVwkdpaazigEtlFSqkO/&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img alt=&quot;&quot; data-original-height=&quot;529&quot; data-original-width=&quot;263&quot; height=&quot;695&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisYsNFwEv0-vRVEaEbEi0R9MmC1gsWjN6XR5DAMou3_jQl6TriiJanM3SnKkwboRlzClxKnjV0wgf5lXoOuSAiM5qdqnENlYNFH8qGnterNhiy4VzoUAVwkdpaazigEtlFSqkO/w344-h695/posicion.jpg&quot; width=&quot;344&quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;br /&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;&lt;/div&gt;&lt;div&gt;Copiamos la posición, en esta caso, la línea tiene un valor de 99.6380, a continuación seleccionamos todos los objetos&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWnWRVr_Htssko4KqNAv-uEmY3jR0yDotX0dQL2ca0UKL7HWPgKwSro0UuE2qH7xHk2nxLLN9T459fUd1UjzeO71ramme3B1q6N1IU5GEafA0upQv04CiEuEhWy3vpeahpho5W/&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img alt=&quot;&quot; data-original-height=&quot;544&quot; data-original-width=&quot;1288&quot; height=&quot;242&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWnWRVr_Htssko4KqNAv-uEmY3jR0yDotX0dQL2ca0UKL7HWPgKwSro0UuE2qH7xHk2nxLLN9T459fUd1UjzeO71ramme3B1q6N1IU5GEafA0upQv04CiEuEhWy3vpeahpho5W/w573-h242/seleccion.jpg&quot; width=&quot;573&quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: left;&quot;&gt;Regresamos a la caja de propiedades de los objetos:&lt;/div&gt;&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: left;&quot;&gt;&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWVRLbg56GYYLgONsgXW1iLT9GbM2dsbdiq2z7ehoHpq2WIQtHVqDDg4OcfcdcOtwRyNAv-v3Z6885T7LHKzN3wk8k6ogX-zqygsqgal98ZfJTsSwJw6rR5TnfOxwQtuNvQb5O/&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img alt=&quot;&quot; data-original-height=&quot;533&quot; data-original-width=&quot;261&quot; height=&quot;694&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWVRLbg56GYYLgONsgXW1iLT9GbM2dsbdiq2z7ehoHpq2WIQtHVqDDg4OcfcdcOtwRyNAv-v3Z6885T7LHKzN3wk8k6ogX-zqygsqgal98ZfJTsSwJw6rR5TnfOxwQtuNvQb5O/w341-h694/varios.jpg&quot; width=&quot;341&quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: left;&quot;&gt;&lt;br /&gt;&lt;/div&gt;Seleccionamos el valor de la posición Y, para pegar el numero 99.6380:&lt;/div&gt;&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: left;&quot;&gt;&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLKQPkCNJ-jgQ0BB4J-mTtYbReP9oNE0nh7Fh-5E6kNW1du9ZqWUS9PTRtw8BXsMGfvNJOXQJcPnvIpTderRnBOqtfSZlyRitgxmYq76Dx8cFRb6s3vOIP92pc6H8bqat4ns4e/&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img alt=&quot;&quot; data-original-height=&quot;537&quot; data-original-width=&quot;269&quot; height=&quot;600&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLKQPkCNJ-jgQ0BB4J-mTtYbReP9oNE0nh7Fh-5E6kNW1du9ZqWUS9PTRtw8BXsMGfvNJOXQJcPnvIpTderRnBOqtfSZlyRitgxmYq76Dx8cFRb6s3vOIP92pc6H8bqat4ns4e/w300-h600/99.jpg&quot; width=&quot;300&quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;br /&gt;&lt;/div&gt;Y listo! los objetos se alineara en la guía naranja:&lt;/div&gt;&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: left;&quot;&gt;&lt;br /&gt;&lt;/div&gt;&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: left;&quot;&gt;&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKbygAW0I3N-hlNFosA7zJJI_p8EkHOscItO8HP2eV3c10ahUjrUyZqnyhk8m8Glqqg0_TmaWJXPW2P4e1nIvfvy-RROGpa6ult-_DkBWGlbKxuZR1B9ec84JffzK7x0H2lu8w/&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img alt=&quot;&quot; data-original-height=&quot;319&quot; data-original-width=&quot;1296&quot; height=&quot;177&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKbygAW0I3N-hlNFosA7zJJI_p8EkHOscItO8HP2eV3c10ahUjrUyZqnyhk8m8Glqqg0_TmaWJXPW2P4e1nIvfvy-RROGpa6ult-_DkBWGlbKxuZR1B9ec84JffzK7x0H2lu8w/w717-h177/orden.jpg&quot; width=&quot;717&quot; /&gt;&lt;/a&gt;&lt;/div&gt;&lt;br /&gt;Lo mismo se puede hacer para la alineación vertical, y combinando las posiciones de X y Y podremos centrar en un mismo lugar varios objetos.&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;&lt;/div&gt;&lt;div&gt;&lt;br /&gt;&lt;/div&gt;&lt;div&gt;&lt;br /&gt;&lt;/div&gt;&lt;div&gt;&lt;br /&gt;&lt;/div&gt;&lt;div&gt;&lt;br /&gt;&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/3829629358524808004/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/3829629358524808004' title='1 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/3829629358524808004'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/3829629358524808004'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2021/12/alineacion-horizontal-o-vertical.html' title=''/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjb5qXbdnTbG4pVS3UAR5kLljykON5E2uWAEGEajVP1ShDXmERwjDMTBW6nesvGCiQcdoV3eYEH_x615ZK7xv9Qey6AOxqPVeehJ-Bpvp5eNtFL18yYX8gczqHASFQBVUjtBoAW/s72-w196-h196-c/align_top_icon_173453.png" height="72" width="72"/><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-3002985424024662720</id><published>2016-11-02T09:49:00.002-06:00</published><updated>2016-11-02T09:49:26.710-06:00</updated><title type='text'>Wordpress - snippet de un bootstrap navbar de subcategorias </title><content type='html'>El siguiente código genera un navbar para ser usado con isotope en un tema de wordpress. El codigo ha sido reemplazado por html sencillo, sin embargo lo estoy guardando en este post para futuro temas.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;     &lt;/span&gt;&amp;lt;div class=&quot;row&quot;&amp;gt;&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;      &lt;/span&gt;&amp;lt;div class=&quot;col-sm-8 col-md-6 col-sm-offset-2 col-md-offset-3 text-center&quot;&amp;gt;&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;       &lt;/span&gt;&amp;lt;div class=&quot;btn-group btn-group-sm&quot; role=&quot;group&quot; id=&quot;filters&quot;&amp;gt;&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;        &lt;/span&gt;&amp;lt;?php&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;         &lt;/span&gt;$slugPortafolios = &#39;portafolios&#39;;&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;         &lt;/span&gt;$objCategoryPortafolios = get_category_by_slug( $slugPortafolios );&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;         &lt;/span&gt;$idCategoryPortafolios = $objCategoryPortafolios-&amp;gt;term_id;&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;         &lt;/span&gt;$terms = get_terms(&#39;category&#39;, array(&#39;parent&#39; =&amp;gt; $idCategoryPortafolios)); // you can use any taxonomy, instead of just &#39;category&#39;&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;         &lt;/span&gt;$terms_ID_array = array();&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;         &lt;/span&gt;&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;         &lt;/span&gt;$count = count($terms); //How many are they?&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;         &lt;/span&gt;if ( $count &amp;gt; 0 ){ &amp;nbsp;//If there are more than 0 terms&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;          &lt;/span&gt;foreach ( $terms as $term ) { &amp;nbsp;//for each term:&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;           &lt;/span&gt;$terms_ID_array[] = $term-&amp;gt;term_id; // Add each term&#39;s ID to an array&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;           &lt;/span&gt;echo &quot;&amp;lt;a role=&#39;button&#39; class=&#39;btn btn-default&#39; &amp;nbsp;href=&#39;#&#39; data-filter=&#39;.&quot;.$term-&amp;gt;slug.&quot;&#39;&amp;gt;&quot; . $term-&amp;gt;name . &quot;&amp;lt;/a&amp;gt;\n&quot;;&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;           &lt;/span&gt;//create a list item with the current term slug for sorting, and name for label&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;          &lt;/span&gt;}&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;         &lt;/span&gt;}&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;        &lt;/span&gt;?&amp;gt;&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;       &lt;/span&gt;&amp;lt;/div&amp;gt;&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;      &lt;/span&gt;&amp;lt;/div&amp;gt;&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;     &lt;/span&gt;&amp;lt;/div&amp;gt;&lt;br /&gt;
&lt;span class=&quot;Apple-tab-span&quot; style=&quot;white-space: pre;&quot;&gt;        &lt;/span&gt;</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/3002985424024662720/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/3002985424024662720' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/3002985424024662720'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/3002985424024662720'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2016/11/wordpress-snippet-de-un-bootstrap.html' title='Wordpress - snippet de un bootstrap navbar de subcategorias '/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-4379764875815801722</id><published>2014-02-06T21:49:00.001-06:00</published><updated>2014-02-06T21:52:25.065-06:00</updated><title type='text'>Agregando Titulos (captions) a una galeria realizada con Foundation Clearing</title><content type='html'>Implemente en una plantilla de Wordpress, que usa el plugin &quot;legacy nextgen gallery&quot;, un álbum de galerías usando para el despliegue el componente de javascript que contiene Foundation de Zurb.&lt;br /&gt;
La idea era que el álbum de galerías se desplegara de forma horizontal, empezamos creando un lienzo:&lt;br /&gt;
&lt;pre class=&quot;csharpcode&quot;&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;row&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;
    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;large-4 columns&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;
    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;
    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;large-4 columns&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;
    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;
    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;large-4 columns&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;
    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;
&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;br /&gt;
Lo siguiente es colocar el código de nuestra galería en cada una de las zonas que acabamos de crear:&lt;br /&gt;
&lt;pre class=&quot;csharpcode&quot;&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;ul&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;clearing-thumbs clearing-feature&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-clearing&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;
  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;clearing-featured-img&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=1&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;img&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;src&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=1&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-caption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;My Caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;
  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=2&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;img&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;src&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=2&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-caption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;My Caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;
  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=3&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;img&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;src&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=3&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-caption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;My Caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;
&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;ul&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;br /&gt;
&lt;style type=&quot;text/css&quot;&gt;.csharpcode, .csharpcode pre&lt;br /&gt;{&lt;br /&gt;	font-size: small;&lt;br /&gt;	color: black;&lt;br /&gt;	font-family: consolas, &quot;Courier New&quot;, courier, monospace;&lt;br /&gt;	background-color: #ffffff;&lt;br /&gt;	/*white-space: pre;*/&lt;br /&gt;}&lt;br /&gt;.csharpcode pre { margin: 0em; }&lt;br /&gt;.csharpcode .rem { color: #008000; }&lt;br /&gt;.csharpcode .kwrd { color: #0000ff; }&lt;br /&gt;.csharpcode .str { color: #006080; }&lt;br /&gt;.csharpcode .op { color: #0000c0; }&lt;br /&gt;.csharpcode .preproc { color: #cc6633; }&lt;br /&gt;.csharpcode .asp { background-color: #ffff00; }&lt;br /&gt;.csharpcode .html { color: #800000; }&lt;br /&gt;.csharpcode .attr { color: #ff0000; }&lt;br /&gt;.csharpcode .alt &lt;br /&gt;{&lt;br /&gt;	background-color: #f4f4f4;&lt;br /&gt;	width: 100%;&lt;br /&gt;	margin: 0em;&lt;br /&gt;}&lt;br /&gt;.csharpcode .lnum { color: #606060; }&lt;br /&gt;&lt;/style&gt;&lt;br /&gt;
&lt;br /&gt;
El resultado lo podemos ver en Codepen: &lt;a href=&quot;http://cdpn.io/ykjBe&quot; title=&quot;http://cdpn.io/ykjBe&quot;&gt;http://cdpn.io/ykjBe&lt;/a&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;a href=&quot;http://lh6.ggpht.com/-8SVM9uIKpXk/UvRXqqgTrxI/AAAAAAAADMY/YffCC33L0ZY/s1600-h/clearing01%25255B5%25255D.jpg&quot;&gt;&lt;img alt=&quot;clearing01&quot; border=&quot;0&quot; src=&quot;http://lh3.ggpht.com/-5GKj-Un7aT4/UvRXrLgSrxI/AAAAAAAADMg/0lpMzEC0OYY/clearing01_thumb%25255B3%25255D.jpg?imgmax=800&quot; height=&quot;107&quot; style=&quot;background-image: none; border-bottom: 0px; border-left: 0px; border-right: 0px; border-top: 0px; display: inline; padding-left: 0px; padding-right: 0px; padding-top: 0px;&quot; title=&quot;clearing01&quot; width=&quot;572&quot; /&gt;&lt;/a&gt;&lt;br /&gt;
&lt;br /&gt;
De esta manera estamos creando un álbum, que cuenta con 3 galerías, que se desplegaran en el ancho y alto de la pantalla:&lt;br /&gt;
&lt;br /&gt;
&lt;a href=&quot;http://lh3.ggpht.com/-YwO6GgFh1Iw/UvRXrXnJtgI/AAAAAAAADMo/xfyZ0NYETvU/s1600-h/clearing02%25255B4%25255D.jpg&quot;&gt;&lt;img alt=&quot;clearing02&quot; border=&quot;0&quot; src=&quot;http://lh6.ggpht.com/-5fBz6zGx_sc/UvRXr6naY9I/AAAAAAAADMw/1IuH3kKJfas/clearing02_thumb%25255B2%25255D.jpg?imgmax=800&quot; height=&quot;285&quot; style=&quot;background-image: none; border-bottom: 0px; border-left: 0px; border-right: 0px; border-top: 0px; display: inline; padding-left: 0px; padding-right: 0px; padding-top: 0px;&quot; title=&quot;clearing02&quot; width=&quot;622&quot; /&gt;&lt;/a&gt;&lt;br /&gt;
&lt;br /&gt;
Lo siguiente sera colocar un titulo a cada una de las galerias, tenemos que cambiar el codigo para utilizar las etiquetas de html FIGURE y FIGCAPTION:&lt;br /&gt;
&lt;br /&gt;
&lt;div class=&quot;csharpcode&quot;&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;   1:  &lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;row&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;   2:  &lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;large-4 small-4 columns&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;   3:  &lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;ul&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;clearing-thumbs clearing-feature&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-clearing&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;   4:  &lt;/span&gt;  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;clearing-featured-img&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=1&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;   5:  &lt;/span&gt;    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;figure-caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;img&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;src&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=1&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-caption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;My Caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;Image 1&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;   6:  &lt;/span&gt;    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;   7:  &lt;/span&gt;  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=2&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;figure-caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;img&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;src&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=2&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-caption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;My Caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;Image 2&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;   8:  &lt;/span&gt;  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=3&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;figure-caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;img&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;src&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=3&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-caption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;My Caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;Image 3&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;   9:  &lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;ul&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  10:  &lt;/span&gt;  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  11:  &lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;large-4 small-4 columns&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  12:  &lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;ul&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;clearing-thumbs clearing-feature&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-clearing&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  13:  &lt;/span&gt;  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;clearing-featured-img&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=4&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  14:  &lt;/span&gt;    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;figure-caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;img&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;src&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=4&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-caption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;My Caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;Image 4&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  15:  &lt;/span&gt;    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  16:  &lt;/span&gt;  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=5&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;figure-caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;img&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;src&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=5&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-caption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;My Caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;Image 5&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  17:  &lt;/span&gt;  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=6&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;figure-caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;img&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;src&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=6&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-caption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;My Caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;Image 6&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  18:  &lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;ul&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  19:  &lt;/span&gt;  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  20:  &lt;/span&gt;  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;large-4 small-4 columns&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  21:  &lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;ul&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;clearing-thumbs clearing-feature&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-clearing&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  22:  &lt;/span&gt;  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;clearing-featured-img&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=7&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  23:  &lt;/span&gt;    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;figure-caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;img&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;src&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=7&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-caption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;My Caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;Image 7&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  24:  &lt;/span&gt;    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  25:  &lt;/span&gt;  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=8&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;figure-caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;img&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;src&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=8&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-caption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;My Caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;Image 8&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  26:  &lt;/span&gt;  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;href&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=9&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;class&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;figure-caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;img&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;src&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://placehold.it/750x350&amp;amp;text=9&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;data-caption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;My Caption&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;Image 9&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figcaption&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;figure&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;a&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;li&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  27:  &lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;ul&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  28:  &lt;/span&gt;  &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  29:  &lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;
&lt;/div&gt;
&lt;br /&gt;
&lt;style type=&quot;text/css&quot;&gt;.csharpcode, .csharpcode pre&lt;br /&gt;{&lt;br /&gt;	font-size: small;&lt;br /&gt;	color: black;&lt;br /&gt;	font-family: consolas, &quot;Courier New&quot;, courier, monospace;&lt;br /&gt;	background-color: #ffffff;&lt;br /&gt;	/*white-space: pre;*/&lt;br /&gt;}&lt;br /&gt;.csharpcode pre { margin: 0em; }&lt;br /&gt;.csharpcode .rem { color: #008000; }&lt;br /&gt;.csharpcode .kwrd { color: #0000ff; }&lt;br /&gt;.csharpcode .str { color: #006080; }&lt;br /&gt;.csharpcode .op { color: #0000c0; }&lt;br /&gt;.csharpcode .preproc { color: #cc6633; }&lt;br /&gt;.csharpcode .asp { background-color: #ffff00; }&lt;br /&gt;.csharpcode .html { color: #800000; }&lt;br /&gt;.csharpcode .attr { color: #ff0000; }&lt;br /&gt;.csharpcode .alt &lt;br /&gt;{&lt;br /&gt;	background-color: #f4f4f4;&lt;br /&gt;	width: 100%;&lt;br /&gt;	margin: 0em;&lt;br /&gt;}&lt;br /&gt;.csharpcode .lnum { color: #606060; }&lt;br /&gt;&lt;/style&gt;&lt;br /&gt;
&lt;br /&gt;
El resultado de lo anterior es lo siguiente:&lt;br /&gt;
&lt;br /&gt;
&lt;a href=&quot;http://lh6.ggpht.com/-dXDl7pcPf6w/UvRXsRqgHMI/AAAAAAAADM0/akry1kfJb9w/s1600-h/clearing03%25255B4%25255D.jpg&quot;&gt;&lt;img alt=&quot;clearing03&quot; border=&quot;0&quot; src=&quot;http://lh3.ggpht.com/-jMoYOCgY6Ug/UvRXs61z5SI/AAAAAAAADNA/NKk7xgkPYoU/clearing03_thumb%25255B2%25255D.jpg?imgmax=800&quot; height=&quot;136&quot; style=&quot;background-image: none; border-bottom: 0px; border-left: 0px; border-right: 0px; border-top: 0px; display: inline; padding-left: 0px; padding-right: 0px; padding-top: 0px;&quot; title=&quot;clearing03&quot; width=&quot;617&quot; /&gt;&lt;/a&gt;&lt;br /&gt;
&lt;br /&gt;
Cierto que no se ve muy agradable, aprovechando que ya utilizamos las etiquetas FIGURE y FIGCAPTION, agregamos un poco de estilo:&lt;br /&gt;
&lt;br /&gt;
&lt;div class=&quot;csharpcode&quot;&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;   1:  &lt;/span&gt;figure {&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;   2:  &lt;/span&gt;  display: block;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;   3:  &lt;/span&gt;  position: relative;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;   4:  &lt;/span&gt;  float: left;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;   5:  &lt;/span&gt;  overflow: hidden;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;   6:  &lt;/span&gt;  margin: 0 20px 20px 0;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;   7:  &lt;/span&gt;  width:100%;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;   8:  &lt;/span&gt;}&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;   9:  &lt;/span&gt;figcaption {&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  10:  &lt;/span&gt;  position: absolute;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  11:  &lt;/span&gt;  background: black;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  12:  &lt;/span&gt;  background: rgba(0,0,0,0.75);&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  13:  &lt;/span&gt;  color: white;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  14:  &lt;/span&gt;  padding: 10px 20px;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  15:  &lt;/span&gt;  margin:0px;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  16:  &lt;/span&gt;  opacity: 0;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  17:  &lt;/span&gt;  -webkit-transition: all 0.6s ease-out;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  18:  &lt;/span&gt;  -moz-transition:    all 0.6s ease-out;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  19:  &lt;/span&gt;  -o-transition:      all 0.6s ease-out;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  20:  &lt;/span&gt;  transition:      all 0.6s ease-out;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  21:  &lt;/span&gt;}&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  22:  &lt;/span&gt;figure:hover figcaption {&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  23:  &lt;/span&gt;  opacity: 1;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  24:  &lt;/span&gt;}&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  25:  &lt;/span&gt;.figure-caption:before { bottom: 10px; left: 10px; }&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  26:  &lt;/span&gt;.figure-caption figcaption { left: 0; bottom: -30%;}&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  27:  &lt;/span&gt;.figure-caption:hover figcaption { bottom: 0px; }&lt;/pre&gt;
&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;csharpcode&quot;&gt;
&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;csharpcode&quot;&gt;
&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;csharpcode&quot;&gt;
Tendremos el siguiente resultado de aplicar el estilo, con una pequeña transición en la FIGCAPTION:&lt;/div&gt;
&lt;br /&gt;
&lt;div class=&quot;csharpcode&quot;&gt;
&lt;/div&gt;
&lt;br /&gt;
&lt;style type=&quot;text/css&quot;&gt;.csharpcode, .csharpcode pre&lt;br /&gt;{&lt;br /&gt;	font-size: small;&lt;br /&gt;	color: black;&lt;br /&gt;	font-family: consolas, &quot;Courier New&quot;, courier, monospace;&lt;br /&gt;	background-color: #ffffff;&lt;br /&gt;	/*white-space: pre;*/&lt;br /&gt;}&lt;br /&gt;.csharpcode pre { margin: 0em; }&lt;br /&gt;.csharpcode .rem { color: #008000; }&lt;br /&gt;.csharpcode .kwrd { color: #0000ff; }&lt;br /&gt;.csharpcode .str { color: #006080; }&lt;br /&gt;.csharpcode .op { color: #0000c0; }&lt;br /&gt;.csharpcode .preproc { color: #cc6633; }&lt;br /&gt;.csharpcode .asp { background-color: #ffff00; }&lt;br /&gt;.csharpcode .html { color: #800000; }&lt;br /&gt;.csharpcode .attr { color: #ff0000; }&lt;br /&gt;.csharpcode .alt &lt;br /&gt;{&lt;br /&gt;	background-color: #f4f4f4;&lt;br /&gt;	width: 100%;&lt;br /&gt;	margin: 0em;&lt;br /&gt;}&lt;br /&gt;.csharpcode .lnum { color: #606060; }&lt;br /&gt;&lt;/style&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;a href=&quot;http://lh4.ggpht.com/-SkKTeFYtDD8/UvRXtIQXBVI/AAAAAAAADNI/d-hpD6yFy-4/s1600-h/clearing04%25255B4%25255D.jpg&quot;&gt;&lt;img alt=&quot;clearing04&quot; border=&quot;0&quot; src=&quot;http://lh4.ggpht.com/-sMcGP3w0x0M/UvRXtpfNJJI/AAAAAAAADNQ/OvTudZgFgJE/clearing04_thumb%25255B2%25255D.jpg?imgmax=800&quot; height=&quot;138&quot; style=&quot;background-image: none; border-bottom: 0px; border-left: 0px; border-right: 0px; border-top: 0px; display: inline; padding-left: 0px; padding-right: 0px; padding-top: 0px;&quot; title=&quot;clearing04&quot; width=&quot;637&quot; /&gt;&lt;/a&gt;&lt;br /&gt;
&lt;br /&gt;
Finalmente un arreglo para el navegador de Firefox e Internet Explorer:&lt;br /&gt;
&lt;pre class=&quot;csharpcode&quot;&gt;li{
  width:100%;
}&lt;/pre&gt;
&lt;br /&gt;
Codigo final en Codepen&amp;nbsp;&lt;a href=&quot;http://cdpn.io/CgJDq&quot;&gt;http://cdpn.io/CgJDq&lt;/a&gt;&lt;br /&gt;
&lt;br /&gt;
Listo!</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/4379764875815801722/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/4379764875815801722' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/4379764875815801722'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/4379764875815801722'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2014/02/agregando-titulos-captions-una-galeria_6.html' title='Agregando Titulos (captions) a una galeria realizada con Foundation Clearing'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="http://lh3.ggpht.com/-5GKj-Un7aT4/UvRXrLgSrxI/AAAAAAAADMg/0lpMzEC0OYY/s72-c/clearing01_thumb%25255B3%25255D.jpg?imgmax=800" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-7377106307463773207</id><published>2014-02-02T01:58:00.001-06:00</published><updated>2014-02-02T01:58:40.731-06:00</updated><title type='text'>Tendencias en diseño web 2014</title><content type='html'>&lt;br /&gt;
Hace unas semanas me aventuré a predecir las tendencias en el área de desarrollo web para este 2014, ahora toca el turno de la parte de diseño web.&lt;br /&gt;
&lt;br /&gt;
1. Area protagonista (hero area). En este año no dejaremos de ver el crecimiento de esta caracterisiticas en los diseños web, la tendencia comenzo un par de años y parece que a todo el mundo le gusta tener una area importante en la pagina de inicio en la que se pueda promocionar los productos mediante animaciones con javascript, especificiamente con &quot;sliders&quot;.&lt;br /&gt;
&lt;br /&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjm8D5Erj9awoPIyElP-BQwEDWZvtOL21Hgc0TofYTzhqo9hcSWOAT0KdP4jF79Ri0G4Xs69v3LNKHensaGoCZfEiUBNbnJp5Nd9c1ewtkehqabGXexyHlAI9qHoY1d6kRUFyQt/s1600/hero-area.gif&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjm8D5Erj9awoPIyElP-BQwEDWZvtOL21Hgc0TofYTzhqo9hcSWOAT0KdP4jF79Ri0G4Xs69v3LNKHensaGoCZfEiUBNbnJp5Nd9c1ewtkehqabGXexyHlAI9qHoY1d6kRUFyQt/s1600/hero-area.gif&quot; height=&quot;213&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
2. Responsive, responsive. Ya han madurado diversos frameworks para el desarrollo de sitios ajustables (responsive) al tamaño de la ventana de diferentes dispositivos, usando una misma hoja de estilos, logrado esto mediante los &quot;media queries&quot; de CSS.&lt;br /&gt;
&lt;br /&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJac7agflspZFLIlgbLmJ5eKcUpsiCZkQpJq6DT5WlqWH05M9WDrPL9eoMG0TI_sOIV2DokHqIIRQby5xCa_06L1w_NB2Rx0bqdqLqjIMXvRYXg6TZCu0UVkPpdOZkmHkHX4Hm/s1600/responsive_design_kinetic_knowledge.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJac7agflspZFLIlgbLmJ5eKcUpsiCZkQpJq6DT5WlqWH05M9WDrPL9eoMG0TI_sOIV2DokHqIIRQby5xCa_06L1w_NB2Rx0bqdqLqjIMXvRYXg6TZCu0UVkPpdOZkmHkHX4Hm/s1600/responsive_design_kinetic_knowledge.jpg&quot; height=&quot;192&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
3. Video en lugar de texto. ¿Alguna vez he comentado que todo el mundo prefiere ver y escuchar, en lugar de leer?, y gracias al incremento continuo en el ancho de banda, es mas fácil colocar videos de 2 minutos tipo comercial en el cual se explica los productos y servicios de una empresa. Habrá mas video en cualquier parte de los sitios web, dado que la producción de videos se hace cada vez mas sencilla y llega con mejor fuerza a las personas.&lt;br /&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxadSw9n7TCO_1JGWaesxKPzN-hTDkQ5hrPB2QOI_Hi0zhNVSeS-I6apYvLQAOrcQ5mq4PqStuc1MtPAnadtbHhzGWZqRD_rO_7u3cxycbpvY6rroiVR1_Q7J6X5ZFTdajUaRt/s1600/video.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxadSw9n7TCO_1JGWaesxKPzN-hTDkQ5hrPB2QOI_Hi0zhNVSeS-I6apYvLQAOrcQ5mq4PqStuc1MtPAnadtbHhzGWZqRD_rO_7u3cxycbpvY6rroiVR1_Q7J6X5ZFTdajUaRt/s1600/video.jpg&quot; height=&quot;210&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
4. Deslizamiento. El efecto de deslizar a una sección en particular dentro de una larga pagina, ha permitido que se generen paginas sencillas, que permite tener todo el contenido de una empresa. Esta versión de &quot;sitios web&quot; es muy útil sobretodo para las microempresas.&lt;br /&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAMjKYjzE0Wea0_Ds84GgJxu4QhYc2kTArPKPKGfXGiOj4LFKa8kxUDaqFLXX4cuFSu2cT2zd7AxyyvG1KukFiUANF4X27TzdqKh_mxcqHTJ7CJ83UB0gskFrdULETje73bJwm/s1600/scroll.jpeg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAMjKYjzE0Wea0_Ds84GgJxu4QhYc2kTArPKPKGfXGiOj4LFKa8kxUDaqFLXX4cuFSu2cT2zd7AxyyvG1KukFiUANF4X27TzdqKh_mxcqHTJ7CJ83UB0gskFrdULETje73bJwm/s1600/scroll.jpeg&quot; height=&quot;84&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
5. Texto corto y al grano. Basado en el hecho que mencione en el punto 3, el cual establece que a la gente pareciera no gustarle leer, se vuelve mas socorrido el tener textos lo mas cortos posibles y directos para que la gente reciba el mensaje sobre las características de los productos que se estan presentando en el sitio web. Eso si, no por corto el texto quiere decir que la tipografía sea igual, en este sentido la tipografía viene a cubrir el espacio que solemos usar para el texto, esto mediante fuentes de mayor tamaño y de un estilo que pueda transmitir el sentimiento del mensaje. Y con la ayuda de Google Web Fonts (en mi opinión el mejor recurso de fuentes tipográficas) esto resulta mas fácil de conseguirse.&lt;br /&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqMBFbuTk3gawkZKUyvlFabJWZhrNpQZ7D6ZvH2UPbEreYd_TXALwvYQeRw0wEfWTHclMPQKIKoD-xFODilE9YRJJGqoApolOW5HDsO3KXYrySmyjRyPNDxBPYkKjsrJqUHBy8/s1600/texto+corto.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqMBFbuTk3gawkZKUyvlFabJWZhrNpQZ7D6ZvH2UPbEreYd_TXALwvYQeRw0wEfWTHclMPQKIKoD-xFODilE9YRJJGqoApolOW5HDsO3KXYrySmyjRyPNDxBPYkKjsrJqUHBy8/s1600/texto+corto.jpg&quot; height=&quot;209&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
6. Grandes fondos. Si estamos dispuestos a tener un video en nuestra pagina de inicio que en ocasiones pesa mas de 5 mb por minuto de tiempo, colocar una imagen de fondo con un tamaño de medio mega resulta irrisorio no usarlo, en especial cuando contamos con imágenes que logren captar la atención inmediata de los visitantes al sitio web.&lt;br /&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiB2_oajHQA5h6pn0-4C98KUpnjt_r0iYhEozP1Lkj4epgk_74fcXXSlaqhQAXRCCIJQCfZz9K2WH-8SSg5WAmCVCAhtjw0Sxop69xitcZUSWRqmrcWemoMgFDNKbnQdgQ6M3fy/s1600/scroller-theme.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiB2_oajHQA5h6pn0-4C98KUpnjt_r0iYhEozP1Lkj4epgk_74fcXXSlaqhQAXRCCIJQCfZz9K2WH-8SSg5WAmCVCAhtjw0Sxop69xitcZUSWRqmrcWemoMgFDNKbnQdgQ6M3fy/s1600/scroller-theme.png&quot; height=&quot;200&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
7. Diseño plano. Esperemos que el &quot;Flat Design&quot; como se dice en inglés, haya llegado para quedarse, no hay mejor forma de usar botones, enlaces, componentes de interfaz, iconos, etc, que mediante este tipo de diseño. Es limpio, claro y directo. Fácil de leer, y ligero para los sitios. Preferible usar kbs en fotos o videos, que en un botón.&lt;br /&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIjj3fHeYEYBpapulVSxxylS7S5qLBi6j6XOxkrJEoTHL2Wken9ZZNycwHe_5Zkxmou2kJXDAGQ_16Aav_UdMKC_YCj6PsGY_jbImY17_Sh1bnlRmO7f27rUmVIaJQmr29p21y/s1600/Teamgeek.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIjj3fHeYEYBpapulVSxxylS7S5qLBi6j6XOxkrJEoTHL2Wken9ZZNycwHe_5Zkxmou2kJXDAGQ_16Aav_UdMKC_YCj6PsGY_jbImY17_Sh1bnlRmO7f27rUmVIaJQmr29p21y/s1600/Teamgeek.jpg&quot; height=&quot;179&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;br /&gt;
8. Wordpress. 46 millones de descargas en el 2013, usado en 18.9% del total de sitios en internet y muestra una curva de crecimiento que no parece ser afectada por sus competidores (joomla, drupal, etc), al contrario pareciera que las otras herramientas están en franco declive o en su caso en el mismo nivel. Es por esto, que pensar que el desarrollo y crecimiento de wordpress sera parado en el 2014, no parece viable. Veremos si puede tener un año tan fructífero como el anterior.&lt;br /&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLjav7w8z0xw1FiX45KhUq6IZgAQndq1B1cm5iTFdJjNs_XbsX40pi39CTou9Rfapxmz4PPTMGzaQDltCTCf4tTz2tNAzpu_ehBnvUZt15I0ehmY1EdSD_cAaZ2Ku9uca9EJia/s1600/wordpress-logo.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLjav7w8z0xw1FiX45KhUq6IZgAQndq1B1cm5iTFdJjNs_XbsX40pi39CTou9Rfapxmz4PPTMGzaQDltCTCf4tTz2tNAzpu_ehBnvUZt15I0ehmY1EdSD_cAaZ2Ku9uca9EJia/s1600/wordpress-logo.png&quot; height=&quot;188&quot; width=&quot;320&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
Listo!</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/7377106307463773207/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/7377106307463773207' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/7377106307463773207'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/7377106307463773207'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2014/02/tendencias-en-diseno-web-2014.html' title='Tendencias en diseño web 2014'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjm8D5Erj9awoPIyElP-BQwEDWZvtOL21Hgc0TofYTzhqo9hcSWOAT0KdP4jF79Ri0G4Xs69v3LNKHensaGoCZfEiUBNbnJp5Nd9c1ewtkehqabGXexyHlAI9qHoY1d6kRUFyQt/s72-c/hero-area.gif" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-1878500503674288854</id><published>2014-01-13T19:48:00.000-06:00</published><updated>2014-01-13T19:55:14.497-06:00</updated><title type='text'>¿Por qué usar un motor de envío de correos?</title><content type='html'>&lt;div dir=&quot;ltr&quot; style=&quot;line-height: 1.15; margin-bottom: 0pt; margin-top: 0pt;&quot;&gt;
&lt;span style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;&quot;&gt;Si se cuenta con un alojamiento web, seguro cuenta con el alojamiento de listas de correo electrónico. Ahora, se podría pensar que esta es una buena opción, pero para los negocios, lo que realmente se está buscando es una vía de sentido único donde usted puede enviar mensajes a un grupo de clientes, socios, medios de comunicación, etc. El software que su proveedor de alojamiento ofrece es bidireccional, lo que significa que cualquier persona que es miembro de la lista puede enviar mensajes a toda la lista. Esto probablemente no es ideal si usted está enviando un anuncio del producto, el boletín semanal o comunicado de prensa, pero es posible que le resulte útil en otros escenarios. Por otra parte ¿está seguro de que su anfitrión le permite enviar una gran cantidad de correos electrónicos al mismo tiempo? ¿Es su propio servidor o VPS o un servidor compartido? Un servidor compartido probablemente limite la salida de correo electrónico enviado, lo que significa que va a tomar horas o días enviar un solo mensaje a su lista entera.&lt;/span&gt;&lt;/div&gt;
&lt;b id=&quot;docs-internal-guid-1ed66f5e-8e6d-0371-4992-28daf92efc99&quot; style=&quot;font-weight: normal;&quot;&gt;&lt;br /&gt;&lt;span style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;&quot;&gt;&lt;/span&gt;&lt;/b&gt;
&lt;br /&gt;
&lt;div dir=&quot;ltr&quot; style=&quot;line-height: 1.15; margin-bottom: 0pt; margin-top: 0pt;&quot;&gt;
&lt;span style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;&quot;&gt;Las preguntas que usted debe pensar alrededor cuando usted está eligiendo una solución lista de correo son:&lt;/span&gt;&lt;/div&gt;
&lt;ul style=&quot;margin-bottom: 0pt; margin-top: 0pt;&quot;&gt;
&lt;li dir=&quot;ltr&quot; style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; list-style-type: disc; text-decoration: none; vertical-align: baseline;&quot;&gt;&lt;div dir=&quot;ltr&quot; style=&quot;line-height: 1.15; margin-bottom: 0pt; margin-top: 0pt;&quot;&gt;
&lt;span style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;&quot;&gt;¿Cuántos mensajes se me enviaba cada semana / mes?&lt;/span&gt;&lt;/div&gt;
&lt;/li&gt;
&lt;li dir=&quot;ltr&quot; style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; list-style-type: disc; text-decoration: none; vertical-align: baseline;&quot;&gt;&lt;div dir=&quot;ltr&quot; style=&quot;line-height: 1.15; margin-bottom: 0pt; margin-top: 0pt;&quot;&gt;
&lt;span style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;&quot;&gt;¿A cuántas personas voy a tener en mi lista?&lt;/span&gt;&lt;/div&gt;
&lt;/li&gt;
&lt;li dir=&quot;ltr&quot; style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; list-style-type: disc; text-decoration: none; vertical-align: baseline;&quot;&gt;&lt;div dir=&quot;ltr&quot; style=&quot;line-height: 1.15; margin-bottom: 0pt; margin-top: 0pt;&quot;&gt;
&lt;span style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;&quot;&gt;¿Quiero que la gente sea capaz de inscribirse a mis listas de correo en mi sitio web?&lt;/span&gt;&lt;/div&gt;
&lt;/li&gt;
&lt;li dir=&quot;ltr&quot; style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; list-style-type: disc; text-decoration: none; vertical-align: baseline;&quot;&gt;&lt;div dir=&quot;ltr&quot; style=&quot;line-height: 1.15; margin-bottom: 0pt; margin-top: 0pt;&quot;&gt;
&lt;span style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;&quot;&gt;¿Necesito saber cosas como la cantidad de gente abierta y leer mis mensajes y, ya sea que haga clic en los enlaces en los mensajes?&lt;/span&gt;&lt;/div&gt;
&lt;/li&gt;
&lt;li dir=&quot;ltr&quot; style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; list-style-type: disc; text-decoration: none; vertical-align: baseline;&quot;&gt;&lt;div dir=&quot;ltr&quot; style=&quot;line-height: 1.15; margin-bottom: 0pt; margin-top: 0pt;&quot;&gt;
&lt;span style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;&quot;&gt;¿Puedo pagar por un servicio de lista de correo, o tengo que encontrar una opción gratuita?&lt;/span&gt;&lt;/div&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;div&gt;
&lt;span style=&quot;font-family: Arial;&quot;&gt;&lt;span style=&quot;font-size: 15px; white-space: pre-wrap;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLFmp1jPX6a78Ce9_0y0Tk5P0_r_etXS3e7OVBi6etvq-UaQ088QpoRhMPmQvB2bmSQrLmnFsT-S6sP4IAqHj96HuFBY4GR0UId3dbX2cKgzyN-M-iMEDRr0v-3U4y_QPa2yt6/s1600/email-marketing2.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLFmp1jPX6a78Ce9_0y0Tk5P0_r_etXS3e7OVBi6etvq-UaQ088QpoRhMPmQvB2bmSQrLmnFsT-S6sP4IAqHj96HuFBY4GR0UId3dbX2cKgzyN-M-iMEDRr0v-3U4y_QPa2yt6/s1600/email-marketing2.jpg&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;a name=&#39;more&#39;&gt;&lt;/a&gt;&lt;div&gt;
&lt;span style=&quot;font-family: Arial;&quot;&gt;&lt;span style=&quot;font-size: 15px; white-space: pre-wrap;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;b style=&quot;font-weight: normal;&quot;&gt;&lt;br /&gt;&lt;span style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;&quot;&gt;&lt;/span&gt;&lt;/b&gt;
&lt;br /&gt;
&lt;div dir=&quot;ltr&quot; style=&quot;line-height: 1.15; margin-bottom: 0pt; margin-top: 0pt;&quot;&gt;
&lt;span style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;&quot;&gt;Una opción reciente es la externalización del envío de correos. MailChimp, Sendgrid, Fromdoppler, por mencionar algunos, &amp;nbsp;son realmente una solución muy completa para listas de correo. Ellos le ayudarán a diseñar su plantilla de correo electrónico HTML, proporcionando algunos temas básicos. Y lo más importante y tal vez subestimado es que van a hacer todo lo posible para que los envíos de correos electrónicos no sean marcados como correo no deseado (SPAM) &amp;nbsp;y tener su dirección de envío fuera de la lista negra en tiempo real (RBL o DNSBL). Hay unos 100 tales RBLs que son constantemente actualizados con las direcciones IP de los hosts de Internet que se utiliza para enviar spam. Todo lo que viene de esas direcciones IP se marcará como spam. Así que usted realmente no quiere terminar en una de esas listas. Hay cientos de RBLs públicos y se puede buscar la dirección IP de su servidor de correo en ellos si usted sospecha que usted está en una lista negra. Servicios como Google o Yahoo o Hotmail bloquean el correo de estos usuarios y servidores.&lt;/span&gt;&lt;/div&gt;
&lt;br /&gt;
&lt;span style=&quot;font-family: Arial; font-size: 15px; vertical-align: baseline; white-space: pre-wrap;&quot;&gt;&lt;/span&gt;

&lt;div dir=&quot;ltr&quot; style=&quot;line-height: 1.15; margin-bottom: 0pt; margin-top: 0pt;&quot;&gt;
&lt;span style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;&quot;&gt;Sin embargo es poco probable que los servidores de MailChimp, Sendgrid, Doppler, etc., alguna vez terminen en una RBL ya que luchan con fuerza para proteger su reputación. &lt;/span&gt;&lt;/div&gt;
&lt;div dir=&quot;ltr&quot; style=&quot;line-height: 1.15; margin-bottom: 0pt; margin-top: 0pt;&quot;&gt;
&lt;span style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div dir=&quot;ltr&quot; style=&quot;line-height: 1.15; margin-bottom: 0pt; margin-top: 0pt;&quot;&gt;
&lt;span style=&quot;background-color: transparent; color: black; font-family: Arial; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;&quot;&gt;Listo!&lt;/span&gt;&lt;/div&gt;
</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/1878500503674288854/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/1878500503674288854' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/1878500503674288854'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/1878500503674288854'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2014/01/por-que-usar-un-motor-de-envio-de.html' title='¿Por qué usar un motor de envío de correos?'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLFmp1jPX6a78Ce9_0y0Tk5P0_r_etXS3e7OVBi6etvq-UaQ088QpoRhMPmQvB2bmSQrLmnFsT-S6sP4IAqHj96HuFBY4GR0UId3dbX2cKgzyN-M-iMEDRr0v-3U4y_QPa2yt6/s72-c/email-marketing2.jpg" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-7948381371843995843</id><published>2014-01-09T20:02:00.000-06:00</published><updated>2014-02-02T01:59:54.855-06:00</updated><title type='text'>Tendencias 2014 en desarrollo web</title><content type='html'>El tiempo no se detiene y se dice que un año en Internet es como siete años en el mundo fuera del teclado. Así de rápido se mueve la tecnología, y lo que es nuevo el día de hoy, en unas cuantas semanas se queda en el olvido; es así que algunos nos atrevemos a decir que es lo que nos depara el destino. Para el caso de este blog, y tomando fuerza con el impulso de la nueva pagina de facebook (&lt;a href=&quot;http://www.facebook.com/llanuracom&quot;&gt;http://www.facebook.com/llanuracom&lt;/a&gt;), revisar las tendencias en desarrollo web es lo que nos ocupa.&lt;br /&gt;
&lt;br /&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8h5CMJJkTjb3QA7W4wUQSkrEbz_sJLFtsp8cE-5YM6PWbisCpmMZJIR74G7XylwCHPLltSPdSpPJr2wsZNvsRN8Rhct5m5SaqemO-dUlmhQM37SsV-S_UK2izKwUQ6oFwT4_A/s1600/tendencias+2014.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8h5CMJJkTjb3QA7W4wUQSkrEbz_sJLFtsp8cE-5YM6PWbisCpmMZJIR74G7XylwCHPLltSPdSpPJr2wsZNvsRN8Rhct5m5SaqemO-dUlmhQM37SsV-S_UK2izKwUQ6oFwT4_A/s1600/tendencias+2014.png&quot; height=&quot;344&quot; width=&quot;640&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
Vamos pues con la lista:&lt;br /&gt;
&lt;h3&gt;
1. Mobil multiplataformas.&lt;/h3&gt;
Esta claro que no es novedad, que todo el mundo se mueve hacia el desarrollo móvil, el crecimiento y éxito de las tiendas de IOS, Android, Windows Phone es una muestra de ello. Pero en Llanura.com lo que interesa es la facilidad del desarrollo, y el problema actual, es que una misma aplicación se debe realizar en diferentes lenguajes para las diferentes plataformas, y por supuesto entender las diferentes idiosincrasias de los sistemas operativos. En muchas ocasiones en el pasado se ha intentado que las aplicaciones web sean un común denominador para todos los sistemas operativos, pero con el crecimiento de HTML5, CSS3 (el nuevo CSS4) y las diversas librerías basadas en Javascript, pareciera que esto esta más próximo. Ejemplos de esto: emscript, node-webkit, phonegap, y algunos mas.&lt;br /&gt;
&lt;h3&gt;
2. Computo en la nube privado.&lt;/h3&gt;
Snowden, el famoso americano que ha divulgado documentos sobre la agencia de seguridad de EEUU, ha puesto a la luz, los problemas que enfrentan los servicios en la nube, por lo que la necesidad de crear nubes de computo privados para empresas de gran tamaño irá en aumento.&lt;br /&gt;
&lt;h3&gt;
3. Perifericos conectados.&lt;/h3&gt;
Los dispositivos de diverso tipo se están conectando a Internet, desde refrigeradores hasta impresoras en 3D. Los navegadores empiezan a incorporar la interacción con este tipo de periféricos.&lt;br /&gt;
&lt;h3&gt;
4. Herramientas de desarrollo en linea.&lt;/h3&gt;
Están apareciendo casi todas las semanas diferentes tipos de editores de programación en linea. Con esto el trabajo en equipo, se vuelve mas eficiente y cien porciento accesible en cualquier momento.&lt;br /&gt;
&lt;h3&gt;
5. M2M.&lt;/h3&gt;
Maquina a maquina. Los servicios web están evolucionando en las maquinas que nos rodean, carros que se pueden conectar a nuestros dispositivos y estos a su vez a servidores remotos que envían los problemas mecánicos o de accidentes automovilísticos. Serán la norma.&lt;br /&gt;
&lt;h3&gt;
6. Maquinas virtuales.&lt;/h3&gt;
Es imposible contar con una infinidad de equipo de computo destinado a las distintas plataformas que existen en el mercado. Es por eso que la virtualización de maquinas con diferentes sistemas operativos, y en el menor de los casos, con un perfil diferente, no solo la veremos en nuestra pc de escritorio.&lt;br /&gt;
Tenemos 12 meses para ver los resultados de estas tendencias. Tal vez veamos cómo algunas, resultan vencedoras y algunas otras terminan en el olvido, pero cierto es que la tecnología y el desarrollo web se mueve muy rápido.&lt;br /&gt;
&lt;br /&gt;
Listo!</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/7948381371843995843/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/7948381371843995843' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/7948381371843995843'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/7948381371843995843'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2014/01/tendencias-2014-en-desarrollo-web.html' title='Tendencias 2014 en desarrollo web'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8h5CMJJkTjb3QA7W4wUQSkrEbz_sJLFtsp8cE-5YM6PWbisCpmMZJIR74G7XylwCHPLltSPdSpPJr2wsZNvsRN8Rhct5m5SaqemO-dUlmhQM37SsV-S_UK2izKwUQ6oFwT4_A/s72-c/tendencias+2014.png" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-495814993270127928</id><published>2014-01-01T22:39:00.002-06:00</published><updated>2014-01-01T22:39:36.335-06:00</updated><title type='text'>Crear un sitio de una página con desplazamiento usando Foundation</title><content type='html'>&lt;h3&gt;
&lt;i&gt;Tutorial para crear un sitio web de una página (onepage website) con desplazamiento local (smooth scroll) usando el marco de trabajo Foundation de Zurb.&lt;/i&gt;&lt;/h3&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJHJEse5SlOeKyLUAFn8FdMHlWKqPT3Yh3vNjYZUlSAHcbQ9tcT5aVq8n5ivabYmb4oDvCfdf_hbR-T8CP2MuZ_aAHbgZ8gDjGPxAk0gTE4rC9QBYdpsKn3AqzqEJC4gbYF54Y/s1600/2.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;401&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJHJEse5SlOeKyLUAFn8FdMHlWKqPT3Yh3vNjYZUlSAHcbQ9tcT5aVq8n5ivabYmb4oDvCfdf_hbR-T8CP2MuZ_aAHbgZ8gDjGPxAk0gTE4rC9QBYdpsKn3AqzqEJC4gbYF54Y/s640/2.jpg&quot; width=&quot;640&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div&gt;
&lt;i&gt;&lt;br /&gt;&lt;/i&gt;&lt;/div&gt;
&lt;div&gt;
&lt;i&gt;&lt;br /&gt;&lt;/i&gt;&lt;/div&gt;
&lt;div&gt;
En ésta ocasión me voy a aventurar a crear un pequeño tutorial para crear un sitio web de una pagina, que ahora están muy de moda, usando como base Foundation.&amp;nbsp;&lt;/div&gt;
&lt;div&gt;
Foundation es un muy buen marco de trabajo (framework en inglés) para desarrollar sitios de forma rápida y sobretodo que sean ajustables a la pantalla (responsive en inglés).&lt;/div&gt;
&lt;div&gt;
Es así que empecemos con este tutorial; para comenzar necesitaremos descargar:&lt;/div&gt;
&lt;div&gt;
&lt;ol&gt;
&lt;li&gt;Foundation Zurb -&amp;nbsp;&lt;a href=&quot;http://foundation.zurb.com/&quot;&gt;http://foundation.zurb.com/&lt;/a&gt;&amp;nbsp;&amp;nbsp;&lt;/li&gt;
&lt;li&gt;Jquery Smooth Scroll Plugin -&amp;nbsp;&lt;a href=&quot;https://github.com/kswedberg/jquery-smooth-scroll&quot;&gt;https://github.com/kswedberg/jquery-smooth-scroll&lt;/a&gt;&lt;/li&gt;
&lt;/ol&gt;
&lt;h4&gt;
HTML&lt;/h4&gt;
&lt;div&gt;
Comenzaré por crear una página sencilla la cual estará formada por una galería de fotos y un mensaje que será la sección de bienvenida del sitio, para esto usaremos el componente javascript que incluye Foundation llamado Orbit. En la sección siguiente a la bienvenida, irá una barra de navegación que servirá para desplazarse y el resto de la pagina serán las secciones propias del sitio web; en términos generales debe quedar algo parecido a lo siguiente:&lt;br /&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGDTf1P8iliCkV_K7DH4DTQnBmPmw95cFa5cOumPHTj6WS20xvdskeWhuzAOu_LO18eE3bkGGo-WGGN1pkbdsN-u4_O_Uj2ibvQ7V3iNgZBVU-DnF2lVFelx9x_OreraQpa6f2/s1600/mockup.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;400&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGDTf1P8iliCkV_K7DH4DTQnBmPmw95cFa5cOumPHTj6WS20xvdskeWhuzAOu_LO18eE3bkGGo-WGGN1pkbdsN-u4_O_Uj2ibvQ7V3iNgZBVU-DnF2lVFelx9x_OreraQpa6f2/s400/mockup.jpg&quot; width=&quot;225&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;/div&gt;
&lt;script src=&quot;https://gist.github.com/vgarcias/8209777.js&quot;&gt;&lt;/script&gt;

&lt;br /&gt;
&lt;div&gt;
&lt;h4&gt;
CSS&lt;/h4&gt;
&lt;/div&gt;
&lt;div&gt;
Para el ejemplo se necesita que las secciones de página tengan una altura mínima y además un poco de espacio entre sección y sección, para esto se necesita agregar en la sección de &quot;head&quot; unas cuantas lineas de estilo que darán un poco de forma a la página web:&lt;/div&gt;
&lt;br /&gt;
&lt;pre&gt;&lt;code&gt; &amp;lt;style type=&quot;text/css&quot;&amp;gt;
 .page-section {padding-top:20px;min-height:650px;border-top:solid 2px gray}
 .page-section-first {padding-top:60px;}
 .page-divider {min-height:100px;}
        &amp;lt;/style&amp;gt;
&lt;/code&gt;&lt;/pre&gt;
&lt;div&gt;
&lt;br /&gt;
Ahora se debe aplicar la clase de estilo &quot;.page-section&quot; a las secciones en nuestro código de html:&lt;br /&gt;
&lt;br /&gt;&lt;/div&gt;
&lt;script src=&quot;https://gist.github.com/vgarcias/8211591.js&quot;&gt;&lt;/script&gt;

&lt;br /&gt;
&lt;h4&gt;
MAGELLAN&lt;/h4&gt;
Lo siguiente, es configurar el componente de javascript &quot;Magellan&quot; que viene incluido en Foundation. Este componente permite desplazar el contenido de la página y al mismo tiempo se vuelve una barra fija en la parte superior del navegador, es decir es un famoso menú pegajoso (sticky menu en Inglés):&lt;br /&gt;
&lt;br /&gt;
&lt;script src=&quot;https://gist.github.com/vgarcias/8212226.js&quot;&gt;&lt;/script&gt;

Se ha agregando una clase de estilo &quot;magellan-link&quot; a todos los enlaces de el menú de navegación, esta clase se usará con el javascript smooth scroll.&lt;br /&gt;
&lt;br /&gt;
Ya en este punto se deben crear los destinos de los enlaces de el menú de navegación usando de &quot;data-magellan-destination&quot; en los encabezados (en las etiquetas &amp;lt;h2&amp;gt;) de cada seccion:&lt;br /&gt;
&lt;br /&gt;
&lt;pre&gt;&lt;code&gt;&amp;lt;h2 id=&quot;section-1&quot; class=&quot;page-section-first&quot; data-magellan-destination=&quot;section-1&quot;&amp;gt;Empresa&amp;lt;/h2&amp;gt;
.
.
.
&amp;lt;h2 id=&quot;section-2&quot; data-magellan-destination=&quot;section-2&quot;&amp;gt;Servicios&amp;lt;/h2&amp;gt;
.
.
.
&amp;lt;h2 id=&quot;section-3&quot; data-magellan-destination=&quot;section-3&quot;&amp;gt;Productos&amp;lt;/h2&amp;gt;
.
.
.
&amp;lt;h2 id=&quot;section-4&quot; data-magellan-destination=&quot;section-4&quot;&amp;gt;Contacto&amp;lt;/h2&amp;gt;
&lt;/code&gt;&lt;/pre&gt;
&lt;br /&gt;
En el primer encabezado existe una clase extra, que lo único que hace es agregar un poco de margen superior a la primera sección.&lt;br /&gt;
&lt;h4&gt;
SMOOTH SCROLL&lt;/h4&gt;
El turno de usar el agregado de Jquery: smooth-scroll, el cual permitirá que el efecto de desplazamiento por la página tenga una mejor animación:&lt;br /&gt;
&lt;br /&gt;
&lt;pre&gt;&lt;code&gt;&amp;lt;script src=&quot;js/jquery.smooth-scroll.min.js&quot;&amp;gt;&amp;lt;/script&amp;gt;
&amp;lt;script&amp;gt;
$(&quot;a.magellan-link&quot;).smoothScroll({offset: -60, speed:1000});
&amp;lt;/script&amp;gt;
&lt;/code&gt;
&lt;/pre&gt;
El numero -60 para el valor offset esta basado en el alto de 65 pixeles que tiene la barra de&lt;br /&gt;
El código anterior debe ir al final, antes de cerrar la etiqueta de body. Con esto ultimo el sitio web de una pagina con desplazamiento quedará funcionando.&lt;br /&gt;
&lt;br /&gt;
&lt;b&gt;EXTRA&lt;/b&gt;&lt;br /&gt;
&lt;br /&gt;
En muchos sitios que usan esta forma de navegación se presenta un botón al inicio de la pagina, por lo cual en la sección de bienvenida se puede agregar un botón de la siguiente forma:&lt;br /&gt;
&lt;br /&gt;
&lt;pre&gt;&lt;code&gt;&amp;lt;div class=&quot;text-center&quot;&amp;gt;
 &amp;lt;ul class=&quot;button-group&quot;&amp;gt;
   &amp;lt;li data-magellan-arrival=&quot;section-1&quot;&amp;gt;&amp;lt;a class=&quot;magellan-link button&quot; href=&quot;#section-1&quot;&amp;gt;ir a sitio&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;
 &amp;lt;/ul&amp;gt;
&amp;lt;/div&amp;gt;
&lt;/code&gt;&lt;/pre&gt;
&lt;br /&gt;
Otra modificación es agregar un enlace al inicio de la página mediante el menú de navegación. Primero habrá que poner un ancla al inicio de la misma despues de la etiqueta body:&lt;br /&gt;
&lt;pre&gt;&lt;code&gt;
&amp;lt;a name=&quot;home&quot; id=&quot;home&quot; data-magellan-destination=&quot;home&quot;&amp;gt;&amp;lt;/a&amp;gt;

&lt;/code&gt;&lt;/pre&gt;
Y finalmente se modifica la barra de menu:&lt;br /&gt;
&lt;br /&gt;
&lt;pre&gt;&lt;code&gt;
&amp;lt;h1&amp;gt;&amp;lt;a data-magellan-arrival=&quot;home&quot; class=&quot;magellan-link&quot; href=&quot;#home&quot;&amp;gt;Mi Sitio&amp;lt;/a&amp;gt;&amp;lt;/h1&amp;gt;&lt;/code&gt;&lt;/pre&gt;
&lt;br /&gt;
Listo!&lt;br /&gt;
&lt;br /&gt;
El código fuente puede ser descargado en&amp;nbsp;&lt;a href=&quot;https://github.com/vgarcias/onepage-ss-foundation&quot;&gt;https://github.com/vgarcias/onepage-ss-foundation&lt;/a&gt;&lt;br /&gt;
Y un demo puede ser visualizado en&amp;nbsp;&lt;a href=&quot;http://vgarcias.github.io/onepage-ss-foundation/&quot;&gt;http://vgarcias.github.io/onepage-ss-foundation/&lt;/a&gt;&lt;br /&gt;
&lt;br /&gt;</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/495814993270127928/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/495814993270127928' title='2 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/495814993270127928'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/495814993270127928'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2014/01/crear-un-sitio-de-una-pagina-con.html' title='Crear un sitio de una página con desplazamiento usando Foundation'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJHJEse5SlOeKyLUAFn8FdMHlWKqPT3Yh3vNjYZUlSAHcbQ9tcT5aVq8n5ivabYmb4oDvCfdf_hbR-T8CP2MuZ_aAHbgZ8gDjGPxAk0gTE4rC9QBYdpsKn3AqzqEJC4gbYF54Y/s72-c/2.jpg" height="72" width="72"/><thr:total>2</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-4971407150244229467</id><published>2013-05-26T14:08:00.001-05:00</published><updated>2013-05-26T14:08:41.188-05:00</updated><title type='text'>Convertir la codificación del texto a utf-8 en Mac</title><content type='html'>A continuacion un apunte para cuando aterrizan algunos archivos de texto que traen caracteres de utf-8 (unicode) al mundo mac.&lt;br /&gt;
En esta ocasion eran unos subititulos de una serie de capitulos de una serie de televisión, los cuales tenian acentos y no se veian correctamente en una mac.&lt;br /&gt;
&lt;br /&gt;
1.- Antes que nada debemos detectar cual es el tipo de codificacion del archivo, esto mediante el comando file en&lt;span style=&quot;text-align: left;&quot;&gt;&amp;nbsp;una terminal de mac&lt;/span&gt;&lt;span style=&quot;text-align: left;&quot;&gt;&amp;nbsp;&lt;/span&gt;:&lt;br /&gt;
&lt;br /&gt;
&lt;span style=&quot;background-color: #eeeeee; font-family: Consolas, Menlo, Monaco, &#39;Lucida Console&#39;, &#39;Liberation Mono&#39;, &#39;DejaVu Sans Mono&#39;, &#39;Bitstream Vera Sans Mono&#39;, &#39;Courier New&#39;, monospace, serif; font-size: 14px; line-height: 18px; text-align: left;&quot;&gt;&amp;gt;file -I {filename}&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;background-color: #eeeeee; font-family: Consolas, Menlo, Monaco, &#39;Lucida Console&#39;, &#39;Liberation Mono&#39;, &#39;DejaVu Sans Mono&#39;, &#39;Bitstream Vera Sans Mono&#39;, &#39;Courier New&#39;, monospace, serif; font-size: 14px; line-height: 18px; text-align: left;&quot;&gt;&lt;br /&gt;&lt;/span&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
2.- le aplicamos el siguiente comando, para convertirlo:&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
&lt;span style=&quot;background-color: #eeeeee; font-family: Consolas, Menlo, Monaco, &#39;Lucida Console&#39;, &#39;Liberation Mono&#39;, &#39;DejaVu Sans Mono&#39;, &#39;Bitstream Vera Sans Mono&#39;, &#39;Courier New&#39;, monospace, serif; font-size: 14px; line-height: 18px;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
&lt;span style=&quot;background-color: #eeeeee;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;span style=&quot;background-color: #eeeeee; font-family: Consolas, Menlo, Monaco, &#39;Lucida Console&#39;, &#39;Liberation Mono&#39;, &#39;DejaVu Sans Mono&#39;, &#39;Bitstream Vera Sans Mono&#39;, &#39;Courier New&#39;, monospace, serif; font-size: 14px; line-height: 18px;&quot;&gt;iconv -f iso-8859-1 -t utf-8 &amp;lt; file &amp;gt; file.new&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
&lt;span style=&quot;background-color: #eeeeee; font-family: Consolas, Menlo, Monaco, &#39;Lucida Console&#39;, &#39;Liberation Mono&#39;, &#39;DejaVu Sans Mono&#39;, &#39;Bitstream Vera Sans Mono&#39;, &#39;Courier New&#39;, monospace, serif; font-size: 14px; line-height: 18px;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: left;&quot;&gt;
&lt;span style=&quot;background-color: #eeeeee; font-family: Consolas, Menlo, Monaco, &#39;Lucida Console&#39;, &#39;Liberation Mono&#39;, &#39;DejaVu Sans Mono&#39;, &#39;Bitstream Vera Sans Mono&#39;, &#39;Courier New&#39;, monospace, serif; font-size: 14px; line-height: 18px;&quot;&gt;Listo!&lt;/span&gt;&lt;/div&gt;
</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/4971407150244229467/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/4971407150244229467' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/4971407150244229467'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/4971407150244229467'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2013/05/convertir-la-codificacion-del-texto-utf.html' title='Convertir la codificación del texto a utf-8 en Mac'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-2179883418292331456</id><published>2013-04-07T11:51:00.001-05:00</published><updated>2013-04-07T11:51:53.050-05:00</updated><title type='text'>Laravel ejecutándose en Usbwebserver</title><content type='html'>&lt;p&gt;Estoy haciendo mis primeros intentos con el marco de desarrollo de Laravel y estas son algunas de mis anotaciones con la instalación: &lt;/p&gt; &lt;p&gt;1.- Como he mencionado en este blog en otras ocasiones, uso Usbwebserver (http://www.usbwebserver.net/) para ejecutar de forma sencilla algún sitio web en las maquinas de Windows, es el más práctico, completo y ligero que he encontrado. XAMPP es usado por muchos, pero creo trae mucho paquetes incluidos, por ejemplo Tomcat, Perl, que pocas veces uso. Y lo mejor de usbwebserver es que por sólo pesar aproximadamente &lt;b&gt;60MB descomprimidos&lt;/b&gt;, me doy el lujo de tener muchas carpetas con diferentes configuraciones y versiones del mismo. Y precisamente esto ultimo es importante, porque para Laravel necesitamos tener la versión 8.5 el cual trae php 5.3.9, en caso de contar con PHP 2.9 o menor, Laravel arrojara un mensaje de &lt;/p&gt;&lt;pre class=&quot;csharpcode&quot;&gt;laravel Notice: Use of undefined constant __DIR__ - assumed &lt;span class=&quot;str&quot;&gt;&#39;__DIR__&#39;&lt;/span&gt;&lt;/pre&gt;&lt;br /&gt;&lt;p&gt;&amp;nbsp;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;2.- Laravel trae un comando de linea llamado artisan, el cual permitira entre otras crear configuraciones. Pero la version de Usbwebserver 8.5 no cuenta con una libreria de PostgreSQL en la carpeta de php&lt;/p&gt;&lt;br /&gt;&lt;p&gt;&lt;a href=&quot;http://lh6.ggpht.com/-rYV7_4Tz9oA/UWGkJcgTreI/AAAAAAAADB0/Req9Dyye9Wk/s1600-h/usbwebserver85%25255B4%25255D.jpg&quot;&gt;&lt;img style=&quot;background-image: none; border-bottom: 0px; border-left: 0px; padding-left: 0px; padding-right: 0px; display: inline; border-top: 0px; border-right: 0px; padding-top: 0px&quot; title=&quot;usbwebserver85&quot; border=&quot;0&quot; alt=&quot;usbwebserver85&quot; src=&quot;http://lh3.ggpht.com/-GfPSZ9nAipw/UWGkJ0wqKbI/AAAAAAAADB8/7JpBO4XzUnk/usbwebserver85_thumb%25255B2%25255D.jpg?imgmax=800&quot; width=&quot;305&quot; height=&quot;411&quot;&gt;&lt;/a&gt;&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Afortunadamente revise la carpeta “php” de una versión 8 de usbwebserver, y copie el archivo&lt;strong&gt; &lt;/strong&gt;“&lt;strong&gt;libpq.dll&lt;/strong&gt;” a la carpeta “php” de la version 8.5&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Listo!&lt;/p&gt;  </content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/2179883418292331456/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/2179883418292331456' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/2179883418292331456'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/2179883418292331456'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2013/04/laravel-ejecutandose-en-usbwebserver_7.html' title='Laravel ejecutándose en Usbwebserver'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="http://lh3.ggpht.com/-GfPSZ9nAipw/UWGkJ0wqKbI/AAAAAAAADB8/7JpBO4XzUnk/s72-c/usbwebserver85_thumb%25255B2%25255D.jpg?imgmax=800" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-7356403032508684593</id><published>2013-02-01T23:03:00.001-06:00</published><updated>2013-02-01T23:03:51.758-06:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="PHP"/><category scheme="http://www.blogger.com/atom/ns#" term="Tip"/><category scheme="http://www.blogger.com/atom/ns#" term="WordPress 2.0"/><title type='text'>qTranslate en el Header y Footer de un Tema</title><content type='html'>&lt;p&gt;Estoy trabajando en un sitio web sobre wordpress que necesita estar en Ingles y Español, por lo que instale el qTranslate, generalmente lo he usado para el contenido y no tanto para los archivos del tema, en este caso de el pie de pagina (footer) y el encabezado (header). Busque un rato, y en el foro del plugin de qTranslate encontré la manera de hacer que funcione:&lt;/p&gt;&lt;pre class=&quot;csharpcode&quot;&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;?&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;php&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;_e&lt;/span&gt;(&lt;span class=&quot;kwrd&quot;&gt;&#39;[:en]The Lutheran World Federation&lt;br /&gt;[:de]Lutherischer Weltbund&lt;br /&gt;[:fr]Fédération luthérienne mondiale&lt;br /&gt;[:es]Federacíon luterana mundial&#39;&lt;/span&gt;); ?&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;br /&gt;&lt;style type=&quot;text/css&quot;&gt;.csharpcode, .csharpcode pre&lt;br /&gt;{&lt;br /&gt;	font-size: small;&lt;br /&gt;	color: black;&lt;br /&gt;	font-family: consolas, &quot;Courier New&quot;, courier, monospace;&lt;br /&gt;	background-color: #ffffff;&lt;br /&gt;	/*white-space: pre;*/&lt;br /&gt;}&lt;br /&gt;.csharpcode pre { margin: 0em; }&lt;br /&gt;.csharpcode .rem { color: #008000; }&lt;br /&gt;.csharpcode .kwrd { color: #0000ff; }&lt;br /&gt;.csharpcode .str { color: #006080; }&lt;br /&gt;.csharpcode .op { color: #0000c0; }&lt;br /&gt;.csharpcode .preproc { color: #cc6633; }&lt;br /&gt;.csharpcode .asp { background-color: #ffff00; }&lt;br /&gt;.csharpcode .html { color: #800000; }&lt;br /&gt;.csharpcode .attr { color: #ff0000; }&lt;br /&gt;.csharpcode .alt &lt;br /&gt;{&lt;br /&gt;	background-color: #f4f4f4;&lt;br /&gt;	width: 100%;&lt;br /&gt;	margin: 0em;&lt;br /&gt;}&lt;br /&gt;.csharpcode .lnum { color: #606060; }&lt;br /&gt;&lt;/style&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;Seguro lo tendré que usar en otra ocasión.&lt;br /&gt;&lt;p&gt;Listo!&lt;/p&gt;  </content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/7356403032508684593/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/7356403032508684593' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/7356403032508684593'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/7356403032508684593'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2013/02/qtranslate-en-el-header-y-footer-de-un_1.html' title='qTranslate en el Header y Footer de un Tema'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-2558664004386203317</id><published>2011-10-20T02:09:00.000-05:00</published><updated>2011-10-20T02:09:21.682-05:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="Asp.Net"/><category scheme="http://www.blogger.com/atom/ns#" term="Consejos"/><category scheme="http://www.blogger.com/atom/ns#" term="Microsoft"/><category scheme="http://www.blogger.com/atom/ns#" term="SQL"/><category scheme="http://www.blogger.com/atom/ns#" term="Tip"/><category scheme="http://www.blogger.com/atom/ns#" term="Truco"/><title type='text'>Procedimiento almacenado para realizar paginacion de una tabla en sql server</title><content type='html'>A continuacion el resultado de un par de horas de estar buscando como realizar paginacion para una tabla desde un procedimiento almacenado en SQL Server 2005, supongo que puede ser usado en la nueva version 2008.&lt;br /&gt;
Existen por ahi diversos ejemplos de como realizar esto, yo termine con esta sencilla version para mas adelante implementar un control ajax, que irá tomando los datos de 50 en 50 registros por vez.&lt;br /&gt;
&lt;div class=&quot;csharpcode&quot;&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;kwrd&quot;&gt;SET&lt;/span&gt; ANSI_NULLS &lt;span class=&quot;kwrd&quot;&gt;ON&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;kwrd&quot;&gt;GO&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;kwrd&quot;&gt;SET&lt;/span&gt; QUOTED_IDENTIFIER &lt;span class=&quot;kwrd&quot;&gt;ON&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;kwrd&quot;&gt;GO&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;rem&quot;&gt;-- =============================================&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;rem&quot;&gt;-- Author:        Victor Garcia&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;rem&quot;&gt;-- Create date: 2008/08/14&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;rem&quot;&gt;-- Description:    Procedimiento almacenado para paginacion de una tabla&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;rem&quot;&gt;-- Usage: usp_obtenpagina(0,20) &lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;rem&quot;&gt;-- Note: la primer pagina debe ser 0&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;rem&quot;&gt;-- =============================================&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;kwrd&quot;&gt;CREATE&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;PROCEDURE&lt;/span&gt; usp_obtenpagina&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;    &lt;span class=&quot;rem&quot;&gt;-- Add the parameters for the stored procedure here&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;    @Pagina  &lt;span class=&quot;kwrd&quot;&gt;int&lt;/span&gt; = 0, &lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;    @Registros  &lt;span class=&quot;kwrd&quot;&gt;int&lt;/span&gt; = 10&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;kwrd&quot;&gt;AS&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;kwrd&quot;&gt;BEGIN&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;    &lt;span class=&quot;rem&quot;&gt;-- SET NOCOUNT ON added to prevent extra result sets from&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;    &lt;span class=&quot;rem&quot;&gt;-- interfering with SELECT statements.&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;    &lt;span class=&quot;kwrd&quot;&gt;SET&lt;/span&gt; NOCOUNT &lt;span class=&quot;kwrd&quot;&gt;ON&lt;/span&gt;;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;    &lt;span class=&quot;kwrd&quot;&gt;DECLARE&lt;/span&gt; @Inicio &lt;span class=&quot;kwrd&quot;&gt;int&lt;/span&gt;;&lt;/pre&gt;
&lt;pre&gt;    &lt;span class=&quot;kwrd&quot;&gt;SET&lt;/span&gt; @Inicio=@Pagina*@Registros+1;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;    &lt;span class=&quot;kwrd&quot;&gt;SET&lt;/span&gt; @Registros = @Registros * (1+@Pagina);&lt;/pre&gt;
&lt;pre&gt;  &lt;span class=&quot;rem&quot;&gt;-- Insert statements for procedure here&lt;/span&gt;&lt;/pre&gt;
&lt;pre&gt;    &lt;span class=&quot;kwrd&quot;&gt;SELECT&lt;/span&gt; *&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;    &lt;span class=&quot;kwrd&quot;&gt;FROM&lt;/span&gt; (&lt;span class=&quot;kwrd&quot;&gt;SELECT&lt;/span&gt; ROW_NUMBER() &lt;span class=&quot;kwrd&quot;&gt;OVER&lt;/span&gt; (&lt;span class=&quot;kwrd&quot;&gt;ORDER&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;BY&lt;/span&gt; MiTabla.MiId)&lt;/pre&gt;
&lt;pre&gt;    &lt;span class=&quot;kwrd&quot;&gt;AS&lt;/span&gt; Fila, *&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;    &lt;span class=&quot;kwrd&quot;&gt;FROM&lt;/span&gt; MiTabla)&lt;/pre&gt;
&lt;pre&gt;    &lt;span class=&quot;kwrd&quot;&gt;AS&lt;/span&gt; Numeracion&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;    &lt;span class=&quot;kwrd&quot;&gt;WHERE&lt;/span&gt; Fila &lt;span class=&quot;kwrd&quot;&gt;between&lt;/span&gt; @Inicio &lt;span class=&quot;kwrd&quot;&gt;and&lt;/span&gt; @Registros&lt;/pre&gt;
&lt;pre&gt;&lt;span class=&quot;kwrd&quot;&gt;END&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;kwrd&quot;&gt;GO&lt;/span&gt;&lt;/pre&gt;
&lt;pre class=&quot;alt&quot;&gt;
&lt;style type=&quot;text/css&quot;&gt;
&lt;br /&gt;&lt;br /&gt;.csharpcode, .csharpcode pre&lt;br /&gt;{&lt;br /&gt; font-size: small;&lt;br /&gt; color: black;&lt;br /&gt; font-family: consolas, &quot;Courier New&quot;, courier, monospace;&lt;br /&gt; background-color: #ffffff;&lt;br /&gt; /*white-space: pre;*/&lt;br /&gt;}&lt;br /&gt;.csharpcode pre { margin: 0em; }&lt;br /&gt;.csharpcode .rem { color: #008000; }&lt;br /&gt;.csharpcode .kwrd { color: #0000ff; }&lt;br /&gt;.csharpcode .str { color: #006080; }&lt;br /&gt;.csharpcode .op { color: #0000c0; }&lt;br /&gt;.csharpcode .preproc { color: #cc6633; }&lt;br /&gt;.csharpcode .asp { background-color: #ffff00; }&lt;br /&gt;.csharpcode .html { color: #800000; }&lt;br /&gt;.csharpcode .attr { color: #ff0000; }&lt;br /&gt;.csharpcode .alt&lt;br /&gt;{&lt;br /&gt; background-color: #f4f4f4;&lt;br /&gt; width: 100%;&lt;br /&gt; margin: 0em;&lt;br /&gt;}&lt;br /&gt;.csharpcode .lnum { color: #606060; }
&lt;/style&gt;
&lt;/pre&gt;
&lt;/div&gt;
Listo!</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/2558664004386203317/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/2558664004386203317' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/2558664004386203317'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/2558664004386203317'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2008/08/procedimiento-almacenado-para-realizar.html' title='Procedimiento almacenado para realizar paginacion de una tabla en sql server'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-7828590134057045708</id><published>2011-10-20T02:08:00.002-05:00</published><updated>2011-10-20T02:08:34.705-05:00</updated><title type='text'>Instalar traducciones para modulos en OpenERP</title><content type='html'>Rapidamente para no olvidar como colocar las traducciones oficiales en los modulos extras de OpenERP:&lt;br /&gt;
&lt;br /&gt;
1.- Buscar en LaunchPad el archivo correspondiente al módulo (&lt;a href=&quot;http://bazaar.launchpad.net/~openerp-commiter/openobject-addons/extra-6.0/files&quot;&gt;http://bazaar.launchpad.net/~openerp-commiter/openobject-addons/extra-6.0/files&lt;/a&gt;), en mi caso estoy usando la&amp;nbsp;versión&amp;nbsp;6.0xx; buscar el nombre del modulo que se desea y descargar el archivo es.po correspondiente.&lt;br /&gt;
&lt;br /&gt;
2.- Colocar el archivo es.po anteriormente obtenido en la carpeta i18n del modulo que estamos tratando de traducir, por ejemplo &quot;Hotel Reservation&quot;.&lt;br /&gt;
&lt;br /&gt;
3.- Desde el cliente de ERP usando el usuario de admin, entramos a la&amp;nbsp;sección&amp;nbsp;de&amp;nbsp;Administración/Traducciones/Cargar una&amp;nbsp;traducción&amp;nbsp;oficial; seleccionamos el idioma Español y esperamos un momento (depende de los&amp;nbsp;módulos&amp;nbsp;que se&amp;nbsp;están&amp;nbsp;usando).&lt;br /&gt;
&lt;br /&gt;
4.- Para visualizar los cambios, detener-arrancar el servidor de ERP y&amp;nbsp;también&amp;nbsp;cerrar-abrir el cliente.&lt;br /&gt;
&lt;br /&gt;
Listo!</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/7828590134057045708/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/7828590134057045708' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/7828590134057045708'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/7828590134057045708'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2011/10/instalar-traducciones-para-modulos-en.html' title='Instalar traducciones para modulos en OpenERP'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-689222920186771867</id><published>2011-08-17T20:27:00.002-05:00</published><updated>2011-08-17T20:33:35.168-05:00</updated><title type='text'>Virtual Router Windows 7</title><content type='html'>Solución al problema de  &quot;virtual router could not be started&quot; de Virtual Router - Wifi Hot Spot for Windows 7 / 2008 R2.&lt;br /&gt;&lt;div&gt;&lt;br /&gt;&lt;/div&gt;&lt;div&gt;He intentado muchas formas de resolver este problema, y ninguno de ellos había funcionado. Hasta que encontré esta solución:&lt;br /&gt;&lt;br /&gt;Haga clic en Inicio, escriba &quot;cmd&quot;, presione las teclas &quot;Ctrl + Shift + Enter&quot;. Esto permite abrir DOS con permisos de administración.&lt;br /&gt;Copiar los dos siguientes comandos en cmd, uno por uno.&lt;br /&gt;&lt;br /&gt;netsh wlan set hostednetwork mode = allow ssid = mired password = miclave&lt;br /&gt;netsh wlan start hostednetwork&lt;br /&gt;&lt;/div&gt;&lt;div&gt;&lt;br /&gt;&lt;/div&gt;&lt;div&gt;La pantalla de Virtual Router Manager mostrará los datos que colocamos.&lt;/div&gt;&lt;div&gt;&lt;br /&gt;&lt;/div&gt;&lt;div&gt;Listo &lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/689222920186771867/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/689222920186771867' title='2 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/689222920186771867'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/689222920186771867'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2011/08/virtual-router-windows-7.html' title='Virtual Router Windows 7'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><thr:total>2</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-5184042206917057393</id><published>2011-05-19T17:58:00.003-05:00</published><updated>2011-05-19T18:14:14.323-05:00</updated><title type='text'>Concurrent RDP Patcher</title><content type='html'>Tiene un rato que intento conectarme de forma remota a mi PC desde un IPod Touch que tengo en especial porque muchas veces tengo puesto el Vuze abierto conectado y por supuesto bajando a lo que puede en este caso a 200 mas o menos, lo que me quita velocidad de navegación.&lt;br /&gt;&lt;br /&gt;Dado lo anterior encontré que mi versión de Windows Home Premium no tiene mas que asistencia remota pero no el escritorio remoto. Buscando en Internet me tope con un programa gratuito que parchea un dll de terminal services a una version RTM. Arriesgandome a que pueda existir algun conflicto por las versiones, instale esta aplicacion y afortunadamente el parche funciono de maravilla.&lt;br /&gt;&lt;br /&gt;&lt;a onblur=&quot;try {parent.deselectBloggerImageGracefully();} catch(e) {}&quot; href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglN6j9vfAlGAnvNIt3qBeu-bKCF0a0htztsBF1We_XWY3h5vdh1OW7FhLA0fphSxmqJxRvNqGKedjlNnIMbvhrGmM0cbC1r6gpFRiH6b5z_qXvrHw3g2AoUe1Y8QUTLcpkMIWx/s1600/Clipboard01.jpg&quot;&gt;&lt;img style=&quot;display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 302px; height: 247px;&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglN6j9vfAlGAnvNIt3qBeu-bKCF0a0htztsBF1We_XWY3h5vdh1OW7FhLA0fphSxmqJxRvNqGKedjlNnIMbvhrGmM0cbC1r6gpFRiH6b5z_qXvrHw3g2AoUe1Y8QUTLcpkMIWx/s320/Clipboard01.jpg&quot; border=&quot;0&quot; alt=&quot;&quot;id=&quot;BLOGGER_PHOTO_ID_5608568927391280482&quot; /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;Algo que me gusta de esta aplicacion es que cuenta con un &quot;Unpatch&quot;, que espero lo haga correctamente, si en algun momento entra en conflicto el Dll.&lt;br /&gt;&lt;br /&gt;Ahora lo unico que use para conectarme desde el ipod fue IRdesktop, tambien gratuito que se obtiene desde el App Store de Mac.&lt;br /&gt;&lt;br /&gt;Listo</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/5184042206917057393/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/5184042206917057393' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/5184042206917057393'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/5184042206917057393'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2011/05/concurrent-rdp-patcher.html' title='Concurrent RDP Patcher'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglN6j9vfAlGAnvNIt3qBeu-bKCF0a0htztsBF1We_XWY3h5vdh1OW7FhLA0fphSxmqJxRvNqGKedjlNnIMbvhrGmM0cbC1r6gpFRiH6b5z_qXvrHw3g2AoUe1Y8QUTLcpkMIWx/s72-c/Clipboard01.jpg" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-8443916178171412706</id><published>2010-10-31T15:34:00.004-06:00</published><updated>2010-12-07T00:23:54.318-06:00</updated><title type='text'>Apuntes de KnowledgeTree Community Edition en Ubuntu 10.4</title><content type='html'>A continuación algunos apuntes al momento de estar instalando KnowledgeTree-CE:&lt;div&gt;&lt;ol&gt;&lt;li&gt;Uno de los requisitos para la instalación es que mi Ubuntu no tenia el paquete de SWFTools. La mejor manera de instalarlos fue mediante Synaptic y no asi con el Centro de Software de Ubuntu.&lt;br /&gt;&lt;ul&gt;&lt;li&gt;deb http://cz.archive.ubuntu.com/ubuntu karmic main universe&lt;br /&gt;(agregar esta linea en  /etc/apt/sources.list)&lt;/li&gt;&lt;li&gt;apt-get update&lt;/li&gt;&lt;li&gt;apt-get install swftools&lt;br /&gt;&lt;/li&gt;&lt;/ul&gt;&lt;br /&gt;&lt;br /&gt;&lt;/li&gt;&lt;li&gt;Una vez que se instalo el paquete anterior, de igual manera mediante Synaptic se instala KnowledgeTree-CE, sin problema.&lt;/li&gt;&lt;li&gt;Algo recomendable en este momento es agregar también phpMyAdmin&lt;/li&gt;&lt;li&gt;Lo siguiente es ir al asistente de configuración mediante Firefox, para crear la base de datos. http://localhost/knowledgetree (con minusculas).&lt;/li&gt;&lt;li&gt;Simplemente llene los campos y en todo momento le di &quot;siguiente&quot; a todos los botones. &lt;/li&gt;&lt;li&gt;Al no haber apuntado el usuario admin y su contraseña, tuve que actualizar el registro en la base de datos de dms, mediante phpmyadmin, cambie el registro de &quot;admin&quot; en la tabla de &quot;users&quot;, actualizando la contraseña con MD5.&lt;/li&gt;&lt;li&gt;Finalmente regrese a la pantalla de  http://localhost/knowledgetre/login.php, para configurar usuarios, grupos y permisos.&lt;/li&gt;&lt;li&gt;Algo importante  en esta instalación de KT-ce en Ubuntu es que los documentos se guardan en /var/lib/knowledgetree/Documents.&lt;/li&gt;&lt;li&gt;En caso de querer cambiar el url de la aplicación digamos http://localhost/knowledgetree a digamos http://localhost/foobar. Lo primero es modificar el archivo conf dentro de Apache (/etc/apache2/sites-available/), modificando la linea:&lt;br /&gt;Alias /knowledgetree /usr/share/knowledgetree-ce&lt;br /&gt;modificando /knowledgetree por /foobar; a continuación tenemos que entrar al sitio kt como administrador y modificar la configuración general  (Administration  » System Configuration  » General Settings)&lt;br /&gt;&lt;img src=&quot;http://www.knowledgetree.org/images/c/c9/Root_URL_Setting.png&quot; alt=&quot;alt text&quot; /&gt;&lt;/li&gt;&lt;li&gt;Guardar la nueva configuración y reiniciar apache con gksudo /etc/init.d/apache2 restart&lt;/li&gt;&lt;/ol&gt;Listo!&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/8443916178171412706/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/8443916178171412706' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/8443916178171412706'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/8443916178171412706'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2010/10/apuntes-de-knowledgetree-community.html' title='Apuntes de KnowledgeTree Community Edition en Ubuntu 10.4'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-7680254730361878620</id><published>2010-10-06T23:30:00.002-05:00</published><updated>2010-10-06T23:33:14.760-05:00</updated><title type='text'>Cupón de Descuento Dell hasta el sábado 9 de Octubre 2010</title><content type='html'>Cupón de descuento Dell en computadoras participantes:&lt;br /&gt;MM3RSPBMGRD0VX&lt;br /&gt;Enlace:&lt;br /&gt;http://click.mexico.dell.com/r/LDYD6A/6VQSE/JZUXM/40RY97/WHMRM/FW/h&lt;br /&gt;El descuento estara activo hasta el 9 de Octubre solo se puede usar una vez.&lt;br /&gt;Suerte.</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/7680254730361878620/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/7680254730361878620' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/7680254730361878620'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/7680254730361878620'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2010/10/cupon-de-descuento-dell-hasta-el-sabado.html' title='Cupón de Descuento Dell hasta el sábado 9 de Octubre 2010'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-3818358199803954767</id><published>2010-03-22T11:29:00.003-06:00</published><updated>2010-03-22T11:39:19.297-06:00</updated><title type='text'>Cupon de descuento DELL hasta el 26 marzo 2010</title><content type='html'>Bueno pues, me ha llegado un cupon de descuento via correo electronico de Dell, claro despues de haber realizado una compra, y despues tambien de andar buscando un cupon que me funcionara para conseguir un equipo mas barato, hoy recibo esto. Total que alguien podra aprovecharlo. Es para usarse solo una vez, el que lo use solo aviseme por este medio para borrar el post.&lt;br /&gt;Aqui el codigo del cupon de descuento el cual vence el 26 de marzo de 2010:&lt;br /&gt; &lt;br /&gt;&lt;span style=&quot;font-weight:bold;&quot;&gt;XX$8VLFC$?GDTS&lt;/span&gt;</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/3818358199803954767/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/3818358199803954767' title='2 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/3818358199803954767'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/3818358199803954767'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2010/03/cupon-de-descuento-dell-hasta-el-26.html' title='Cupon de descuento DELL hasta el 26 marzo 2010'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><thr:total>2</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-9183740381316028725</id><published>2009-07-08T20:41:00.001-05:00</published><updated>2009-07-08T20:41:26.177-05:00</updated><title type='text'>Tip: Solución al Max(id) de MySQL en CakePhp</title><content type='html'>&lt;p&gt;En determinadas ocasiones se requiere el ultimo id que se tiene en una base de datos en MySQL. La forma más práctica de hacer esto es usar la instrucción:&lt;/p&gt;  &lt;div style=&quot;border-right: gray 1px solid; padding-right: 4px; border-top: gray 1px solid; padding-left: 4px; font-size: 8pt; padding-bottom: 4px; margin: 20px 0px 10px; overflow: auto; border-left: gray 1px solid; width: 97.5%; cursor: text; max-height: 200px; line-height: 12pt; padding-top: 4px; border-bottom: gray 1px solid; font-family: consolas, &amp;#39;Courier New&amp;#39;, courier, monospace; height: 52px; background-color: #f4f4f4&quot;&gt;   &lt;div style=&quot;padding-right: 0px; padding-left: 0px; font-size: 8pt; padding-bottom: 0px; overflow: visible; width: 100%; color: black; border-top-style: none; line-height: 12pt; padding-top: 0px; font-family: consolas, &amp;#39;Courier New&amp;#39;, courier, monospace; border-right-style: none; border-left-style: none; background-color: #f4f4f4; border-bottom-style: none&quot;&gt;     &lt;pre style=&quot;padding-right: 0px; padding-left: 0px; font-size: 8pt; padding-bottom: 0px; margin: 0em; overflow: visible; width: 100%; color: black; border-top-style: none; line-height: 12pt; padding-top: 0px; font-family: consolas, &amp;#39;Courier New&amp;#39;, courier, monospace; border-right-style: none; border-left-style: none; background-color: white; border-bottom-style: none&quot;&gt;&lt;span style=&quot;color: #606060&quot;&gt;   1:&lt;/span&gt; &lt;span style=&quot;color: #0000ff&quot;&gt;SELECT&lt;/span&gt; &lt;span style=&quot;color: #0000ff&quot;&gt;MAX&lt;/span&gt;(id) &lt;span style=&quot;color: #0000ff&quot;&gt;as&lt;/span&gt; MaxId &lt;span style=&quot;color: #0000ff&quot;&gt;FROM&lt;/span&gt; Table&lt;/pre&gt;&lt;br /&gt;  &lt;/div&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;Ahora bien lograr esta instrucción en cakephp tiene su truco, algo que podemos hacer es usar la propiedad “query” de objeto model, pero el resultado es un poco difícil de acceder pues arroja un arreglo de 3 dimensiones. Lo mas sencillo, es usar las prestaciones de Cakephp y el modelo de acceso a la base de datos que maneja, de esta manera existe la propiedad find (‘first’) que permitirá arrojar un solo resultado, con la combinación de unos parámetros para el orden de los datos lograremos encontrar el ultimo id:&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;div id=&quot;codeSnippetWrapper&quot; style=&quot;border-right: silver 1px solid; padding-right: 4px; border-top: silver 1px solid; padding-left: 4px; font-size: 8pt; padding-bottom: 4px; margin: 20px 0px 10px; overflow: auto; border-left: silver 1px solid; width: 97.5%; cursor: text; direction: ltr; max-height: 200px; line-height: 12pt; padding-top: 4px; border-bottom: silver 1px solid; font-family: &amp;#39;Courier New&amp;#39;, courier, monospace; height: 98px; background-color: #f4f4f4; text-align: left&quot;&gt;&lt;br /&gt;  &lt;div id=&quot;codeSnippet&quot; style=&quot;padding-right: 0px; padding-left: 0px; font-size: 8pt; padding-bottom: 0px; overflow: visible; width: 100%; color: black; direction: ltr; border-top-style: none; line-height: 12pt; padding-top: 0px; font-family: &amp;#39;Courier New&amp;#39;, courier, monospace; border-right-style: none; border-left-style: none; background-color: #f4f4f4; text-align: left; border-bottom-style: none&quot;&gt;&lt;br /&gt;    &lt;pre style=&quot;padding-right: 0px; padding-left: 0px; font-size: 8pt; padding-bottom: 0px; margin: 0em; overflow: visible; width: 100%; color: black; direction: ltr; border-top-style: none; line-height: 12pt; padding-top: 0px; font-family: &amp;#39;Courier New&amp;#39;, courier, monospace; border-right-style: none; border-left-style: none; background-color: white; text-align: left; border-bottom-style: none&quot;&gt;&lt;span id=&quot;lnum1&quot; style=&quot;color: #606060&quot;&gt;   1:&lt;/span&gt; $MaxId = $this-&amp;gt;Model-&amp;gt;find(&lt;span style=&quot;color: #006080&quot;&gt;&#39;first&#39;&lt;/span&gt;, &lt;span style=&quot;color: #0000ff&quot;&gt;array&lt;/span&gt;(&lt;span style=&quot;color: #006080&quot;&gt;&#39;order&#39;&lt;/span&gt;=&amp;gt;&lt;span style=&quot;color: #006080&quot;&gt;&#39;Model.id DESC&#39;&lt;/span&gt;));&lt;/pre&gt;&lt;br /&gt;&lt;!--CRLF--&gt;&lt;br /&gt;&lt;br /&gt;    &lt;pre style=&quot;padding-right: 0px; padding-left: 0px; font-size: 8pt; padding-bottom: 0px; margin: 0em; overflow: visible; width: 100%; color: black; direction: ltr; border-top-style: none; line-height: 12pt; padding-top: 0px; font-family: &amp;#39;Courier New&amp;#39;, courier, monospace; border-right-style: none; border-left-style: none; background-color: #f4f4f4; text-align: left; border-bottom-style: none&quot;&gt;&lt;span id=&quot;lnum2&quot; style=&quot;color: #606060&quot;&gt;   2:&lt;/span&gt; $this-&amp;gt;set(&lt;span style=&quot;color: #006080&quot;&gt;&#39;maxid&#39;&lt;/span&gt;, $MaxId[&lt;span style=&quot;color: #006080&quot;&gt;&#39;Model&#39;&lt;/span&gt;][&lt;span style=&quot;color: #006080&quot;&gt;&#39;id&#39;&lt;/span&gt;]);&lt;/pre&gt;&lt;br /&gt;&lt;!--CRLF--&gt;&lt;/div&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;Lo anterior lo coloque dentro de un controlador.&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;Listo!&lt;/p&gt;  </content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/9183740381316028725/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/9183740381316028725' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/9183740381316028725'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/9183740381316028725'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2009/07/tip-solucion-al-maxid-de-mysql-en.html' title='Tip: Solución al Max(id) de MySQL en CakePhp'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-3495986796964396436</id><published>2009-06-24T16:14:00.002-05:00</published><updated>2009-06-24T16:20:29.452-05:00</updated><title type='text'>Manejando palabras acentuadas en PHP y Javascript</title><content type='html'>&lt;p&gt;Antes de comenzar con el aspecto de la programación, una regla sobre gramática: las mayúsculas siempre, siempre, siempre se acentúan.&lt;/p&gt;&lt;p&gt;Dicho lo anterior, me tope con el caso en php que tenia una lista de opciones basadas en un select que no me mostraba los acentos correctamente. MySQL y php por omisión usan utf-8, por lo que es buena practica poner nuestro html en utf-8:&lt;/p&gt;&lt;div style=&quot;BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 4px; PADDING-BOTTOM: 4px; MARGIN: 20px 0px 10px; OVERFLOW: auto; BORDER-LEFT: gray 1px solid; WIDTH: 97.5%; CURSOR: text; MAX-HEIGHT: 200px; LINE-HEIGHT: 12pt; PADDING-TOP: 4px; BORDER-BOTTOM: gray 1px solidfont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;div style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;   1:&lt;/span&gt; &amp;lt;meta http-equiv=&lt;span style=&quot;color:#006080;&quot;&gt;&quot;Content-Type&quot;&lt;/span&gt; content=&lt;span style=&quot;color:#006080;&quot;&gt;&quot;text/html; charset=utf-8&quot;&lt;/span&gt;&amp;gt;&lt;/pre&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;Ahora bien, Javascript no utiliza por omisión utf-8, asi que cuando coloque un texto mediante document.write, la pantalla desplego el texto acentuado como un carácter especial de html (html entity):&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;div style=&quot;BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 4px; PADDING-BOTTOM: 4px; MARGIN: 20px 0px 10px; OVERFLOW: auto; BORDER-LEFT: gray 1px solid; WIDTH: 97.5%; CURSOR: text; MAX-HEIGHT: 200px; LINE-HEIGHT: 12pt; PADDING-TOP: 4px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 234pxfont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;br /&gt;&lt;div style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;   1:&lt;/span&gt; &lt;span style=&quot;color:#0000ff;&quot;&gt;function&lt;/span&gt; changecities( formObj )&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;   2:&lt;/span&gt;  {&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;   3:&lt;/span&gt;    statesObj = eval( &lt;span style=&quot;color:#006080;&quot;&gt;&quot;formObj.states&quot;&lt;/span&gt; );&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;   4:&lt;/span&gt;  &lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;   5:&lt;/span&gt;    state = statesObj[statesObj.selectedIndex].value;&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;   6:&lt;/span&gt;    citiesObj = eval( &lt;span style=&quot;color:#006080;&quot;&gt;&quot;formObj.elements[&#39;cities&#39;]&quot;&lt;/span&gt; );&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;   7:&lt;/span&gt;  &lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;   8:&lt;/span&gt;    &lt;span style=&quot;color:#008000;&quot;&gt;// remove all entries&lt;/span&gt;&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;   9:&lt;/span&gt;    citiesNum = citiesObj.length;&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  10:&lt;/span&gt;    &lt;span style=&quot;color:#0000ff;&quot;&gt;for&lt;/span&gt; (i=(citiesNum-1); i &amp;gt;= 0; i--)&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  11:&lt;/span&gt;    {&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  12:&lt;/span&gt;      citiesObj.options[i] = &lt;span style=&quot;color:#0000ff;&quot;&gt;null&lt;/span&gt;;&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  13:&lt;/span&gt;    }&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  14:&lt;/span&gt;    &lt;span style=&quot;color:#008000;&quot;&gt;// add entries based on area selected&lt;/span&gt;&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  15:&lt;/span&gt;    &lt;span style=&quot;color:#0000ff;&quot;&gt;switch&lt;/span&gt; (state){&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  16:&lt;/span&gt; &lt;span style=&quot;color:#0000ff;&quot;&gt;case&lt;/span&gt; &lt;span style=&quot;color:#006080;&quot;&gt;&quot;3&quot;&lt;/span&gt;:&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  17:&lt;/span&gt;    citiesObj.options[0] = &lt;span style=&quot;color:#0000ff;&quot;&gt;new&lt;/span&gt; Option(&lt;span style=&quot;color:#006080;&quot;&gt;&quot;Comondú&quot;&lt;/span&gt;,17);&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  18:&lt;/span&gt;    citiesObj.options[1] = &lt;span style=&quot;color:#0000ff;&quot;&gt;new&lt;/span&gt; Option(&lt;span style=&quot;color:#006080;&quot;&gt;&quot;La Paz&quot;&lt;/span&gt;,18);&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  19:&lt;/span&gt;    citiesObj.options[2] = &lt;span style=&quot;color:#0000ff;&quot;&gt;new&lt;/span&gt; Option(&lt;span style=&quot;color:#006080;&quot;&gt;&quot;Loreto&quot;&lt;/span&gt;,19);&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  20:&lt;/span&gt;    citiesObj.options[3] = &lt;span style=&quot;color:#0000ff;&quot;&gt;new&lt;/span&gt; Option(&lt;span style=&quot;color:#006080;&quot;&gt;&quot;Los Cabos&quot;&lt;/span&gt;,20);&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  21:&lt;/span&gt;    citiesObj.options[4] = &lt;span style=&quot;color:#0000ff;&quot;&gt;new&lt;/span&gt; Option(&lt;span style=&quot;color:#006080;&quot;&gt;&quot;Mulegé&quot;&lt;/span&gt;,21);&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  22:&lt;/span&gt;    citiesObj.options[0].selected = &lt;span style=&quot;color:#0000ff;&quot;&gt;true&lt;/span&gt;;&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  23:&lt;/span&gt;    &lt;span style=&quot;color:#0000ff;&quot;&gt;break&lt;/span&gt;;&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  24:&lt;/span&gt;  &lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  25:&lt;/span&gt;     }&lt;/pre&gt;&lt;br /&gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;  26:&lt;/span&gt; }...&lt;/pre&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;&lt;a href=&quot;http://lh5.ggpht.com/_0wpDOZY7yrU/SkKXEyMrMTI/AAAAAAAAAjY/WI0cJPR8AY0/s1600-h/image%5B5%5D.png&quot;&gt;&lt;img title=&quot;image&quot; style=&quot;BORDER-TOP-WIDTH: 0px; DISPLAY: inline; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px&quot; height=&quot;107&quot; alt=&quot;image&quot; src=&quot;http://lh3.ggpht.com/_0wpDOZY7yrU/SkKXFTqjiLI/AAAAAAAAAjc/e0qNcVQarvI/image_thumb%5B3%5D.png?imgmax=800&quot; width=&quot;244&quot; border=&quot;0&quot; /&gt;&lt;/a&gt; &lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;Php tiene una instrucción para transformar esto caracteres, de su valor al carácter que queremos:&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;div style=&quot;BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 4px; PADDING-BOTTOM: 4px; MARGIN: 20px 0px 10px; OVERFLOW: auto; BORDER-LEFT: gray 1px solid; WIDTH: 97.5%; CURSOR: text; MAX-HEIGHT: 200px; LINE-HEIGHT: 12pt; PADDING-TOP: 4px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 92pxfont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;br /&gt;&lt;div style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; HEIGHT: 80px; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;   1:&lt;/span&gt; &lt;span style=&quot;color:#0000ff;&quot;&gt;&amp;lt;?&lt;/span&gt;&lt;span style=&quot;color:#800000;&quot;&gt;php&lt;/span&gt; &lt;span style=&quot;color:#ff0000;&quot;&gt;html_entity_decode&lt;/span&gt;(“&amp;amp;#&lt;span style=&quot;color:#ff0000;&quot;&gt;250”&lt;/span&gt;); ?&lt;span style=&quot;color:#0000ff;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;Debe dar como resultado “ú”&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;&lt;a href=&quot;http://lh6.ggpht.com/_0wpDOZY7yrU/SkKXFht9o7I/AAAAAAAAAjg/fngtsGdpbMg/s1600-h/image%5B14%5D.png&quot;&gt;&lt;img title=&quot;image&quot; style=&quot;BORDER-TOP-WIDTH: 0px; DISPLAY: inline; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px&quot; height=&quot;125&quot; alt=&quot;image&quot; src=&quot;http://lh4.ggpht.com/_0wpDOZY7yrU/SkKXF3qS9gI/AAAAAAAAAjk/wZ9Ig7JRFHc/image_thumb%5B6%5D.png?imgmax=800&quot; width=&quot;244&quot; border=&quot;0&quot; /&gt;&lt;/a&gt; &lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;Pero como vemos en la imagen, el select no se despliega correctamente pues en realidad la instrucción html_entity_decode da como resultado un conjunto de caracteres “ISO-8859-1”, así que podemos optar por hacer una de dos cosas:&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;ol&gt;&lt;br /&gt;&lt;li&gt;Usar &lt;strong&gt;utf8_encode&lt;/strong&gt;:&lt;br /&gt;&lt;br /&gt;&lt;div style=&quot;BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 4px; PADDING-BOTTOM: 4px; MARGIN: 20px 0px 10px; OVERFLOW: auto; BORDER-LEFT: gray 1px solid; WIDTH: 97.5%; CURSOR: text; MAX-HEIGHT: 200px; LINE-HEIGHT: 12pt; PADDING-TOP: 4px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 108pxfont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;br /&gt;&lt;div style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;   1:&lt;/span&gt; &lt;span style=&quot;color:#0000ff;&quot;&gt;&amp;lt;?&lt;/span&gt;&lt;span style=&quot;color:#800000;&quot;&gt;php&lt;/span&gt; &lt;span style=&quot;color:#ff0000;&quot;&gt;utf8_encode&lt;/span&gt;(&lt;span style=&quot;color:#ff0000;&quot;&gt;html_entity_decode&lt;/span&gt;(“&amp;amp;#&lt;span style=&quot;color:#ff0000;&quot;&gt;250”&lt;/span&gt;)); ?&lt;span style=&quot;color:#0000ff;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;&lt;/li&gt;&lt;br /&gt;&lt;br /&gt;&lt;li&gt;Cambiar la opción del conjunto de caracteres en la instrucción html_entity_decode(string,quotestyle,&lt;strong&gt;character-set&lt;/strong&gt;): &lt;/li&gt;&lt;br /&gt;&lt;br /&gt;&lt;div style=&quot;BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 4px; PADDING-BOTTOM: 4px; MARGIN: 20px 0px 10px; OVERFLOW: auto; BORDER-LEFT: gray 1px solid; WIDTH: 97.5%; CURSOR: text; MAX-HEIGHT: 200px; LINE-HEIGHT: 12pt; PADDING-TOP: 4px; BORDER-BOTTOM: gray 1px solidfont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;br /&gt;&lt;div style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:#f4f4f4;&quot;   &gt;&lt;br /&gt;&lt;pre style=&quot;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0em; OVERFLOW: visible; WIDTH: 100%; COLOR: black; BORDER-TOP-STYLE: none; LINE-HEIGHT: 12pt; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-: nonefont-family:consolas, &#39;Courier New&#39;, courier, monospace;font-size:8pt;color:white;&quot;   &gt;&lt;span style=&quot;color:#606060;&quot;&gt;   1:&lt;/span&gt; &lt;span style=&quot;color:#0000ff;&quot;&gt;&amp;lt;?&lt;/span&gt;&lt;span style=&quot;color:#800000;&quot;&gt;php&lt;/span&gt; &lt;span style=&quot;color:#ff0000;&quot;&gt;html_entity_decode&lt;/span&gt;(&lt;span style=&quot;color:#0000ff;&quot;&gt;&quot;&amp;amp;250;&quot;&lt;/span&gt;,&lt;span style=&quot;color:#ff0000;&quot;&gt;ENT_COMPAT&lt;/span&gt;,&lt;span style=&quot;color:#0000ff;&quot;&gt;&quot;UTF-8&quot;&lt;/span&gt;) ?&lt;span style=&quot;color:#0000ff;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;&lt;/div&gt;&lt;br /&gt;&lt;/ol&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;El despliegue es:&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;&lt;a href=&quot;http://lh5.ggpht.com/_0wpDOZY7yrU/SkKXGJKGKuI/AAAAAAAAAjo/h8CzP_ALM0c/s1600-h/image%5B17%5D.png&quot;&gt;&lt;img title=&quot;image&quot; style=&quot;BORDER-RIGHT: 0px; BORDER-TOP: 0px; DISPLAY: inline; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px&quot; height=&quot;122&quot; alt=&quot;image&quot; src=&quot;http://lh3.ggpht.com/_0wpDOZY7yrU/SkKXGv7KwLI/AAAAAAAAAjs/N4nARkNotP4/image_thumb%5B7%5D.png?imgmax=800&quot; width=&quot;244&quot; border=&quot;0&quot; /&gt;&lt;/a&gt; &lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;Listo!&lt;/p&gt;</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/3495986796964396436/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/3495986796964396436' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/3495986796964396436'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/3495986796964396436'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2009/06/manejando-palabras-acentuadas-en-php-y.html' title='Manejando palabras acentuadas en PHP y Javascript'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="http://lh3.ggpht.com/_0wpDOZY7yrU/SkKXFTqjiLI/AAAAAAAAAjc/e0qNcVQarvI/s72-c/image_thumb%5B3%5D.png?imgmax=800" height="72" width="72"/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-6755252386286761933</id><published>2009-06-12T21:23:00.001-05:00</published><updated>2009-06-12T21:23:47.935-05:00</updated><title type='text'>Cambiar el tamaño de un archivo vdi de VirtualBox</title><content type='html'>&lt;p&gt;No me gusta colocar tutoriales que se ubican en otro sitio web, pero en este caso, además de que el tutorial resolvió el problema que tenia con el tamaño inicial del disco de windows xp en virtualbox, es tan claro de seguir que no tuve problemas con llevar el cambio de tamaño del disco duro virtual de la partición.&lt;/p&gt;  &lt;p&gt;&lt;a title=&quot;http://www.my-guides.net/en/content/view/122/26/&quot; href=&quot;http://www.my-guides.net/en/content/view/122/26/&quot;&gt;http://www.my-guides.net/en/content/view/122/26/&lt;/a&gt;&lt;/p&gt;  &lt;p&gt;Si a alguien le interesa de todos modos una traduccion, solo avisar.&lt;/p&gt;  &lt;p&gt;Listo!&lt;/p&gt;  </content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/6755252386286761933/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/6755252386286761933' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/6755252386286761933'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/6755252386286761933'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2009/06/cambiar-el-tamano-de-un-archivo-vdi-de.html' title='Cambiar el tamaño de un archivo vdi de VirtualBox'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-4408016136962778164</id><published>2009-06-01T22:54:00.001-05:00</published><updated>2009-06-01T22:54:32.226-05:00</updated><title type='text'>¿Dónde esta el folder de patrones en Fireworks CS3?</title><content type='html'>&lt;p&gt;En ocasiones me pongo a realizar maquetas de algun sitio web en Fireworks, aun cuando trato de usar Photoshop, lo cierto es que FW es bastante ligero y no me da lata sobretodo para la maquetacion.&amp;#160; Estoy trabajando en él para un sitio y se me ocurrio casi terminar el diseño del sitio.&lt;/p&gt;  &lt;p&gt;Pero al momento de comenzar con la creacion de los archivos de CSS para la parte grafica me tope que no sabia cual era el tamaño de los patrones que habia colocado como relleno en algunos de los fondos, lo anterior es importante para optimizar el tamaño de las imagenes.&lt;/p&gt;  &lt;p&gt;Asi que como me pase un ratito en la busqueda, pongo el folder exacto que se usa en WIndows Vista:&lt;/p&gt;  &lt;p&gt;C:\Program Files\Adobe\Adobe Fireworks CS3\Configuration\Textures&lt;/p&gt;  &lt;p&gt;Listo!&lt;/p&gt;  </content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/4408016136962778164/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/4408016136962778164' title='1 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/4408016136962778164'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/4408016136962778164'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2009/06/donde-esta-el-folder-de-patrones-en.html' title='¿Dónde esta el folder de patrones en Fireworks CS3?'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-8333897201255663489</id><published>2009-05-07T18:25:00.004-05:00</published><updated>2009-05-07T18:51:00.567-05:00</updated><title type='text'>Instalando Ubuntu 9.04 en una Compaq Presario 1200 LA</title><content type='html'>Me tomo un par de dias realizar la instalación de Ubuntu 9.04 en una Laptop Compaq Presario 1200. Hace tiempo ya le había instalado Ubuntu 6.10, y había funcionado de maravilla, recuerdo que en su momento probé varias versiones de Linux y la que mejor me respondió, de inicio a fin fue la de Ubuntu. Sigue gustandome esa interface que muestra. Preste esta Laptop a mi primo por una temporada, en lo que me movía de lugar y resolvía algunas cosas de la oficina. Cuando la tenia de vuelta le habian instalado Windows XP. Por supuesto que estaba muy lenta. Horas sólo para que apareciera el Internet Explorer.&lt;br /&gt;Por lo que enseguida me dí a la tarea de montar de nuevo linux. Revisé que ya estaba la nueva versión de ubuntu, la 9.04, que como su número indica representa la del mes de abril del 2009 (cada 6 meses lanzan una versión), decidí bajarla mediante un torrent, y obtuve la imagen ISO para quemar en CD. En una tarde obtuve el software para instalar.&lt;br /&gt;Ya una vez que inserte el CD, aparecio una bonita pantalla que me decía si quería instalarlo o solo ejecutarlo de forma &quot;Live&quot;. Y de aquí en adelante la aventura.&lt;br /&gt;Resulta que desde la versión 7.10, Ubuntu maneja una versión actualizada del sistema Xorg, que trata de encontrar de forma automatica el mejor driver, monitor y resolución de la computadora donde se instala, pero en mi caso, mi tarjeta Trident no fue detectada. Esto no lo supe hasta el siguiente día en que me puse a verificar, el por qué me aparecia una pantalla vacía después de quererse instalar.&lt;div&gt;El truco aquí es instalar Ubuntu en &lt;span class=&quot;Apple-style-span&quot; style=&quot;font-weight: bold;&quot;&gt;&quot;modo seguro de gráficos&quot;&lt;/span&gt;, al momento de la pantalla inicial se debe apretar el botón &lt;span class=&quot;Apple-style-span&quot; style=&quot;font-weight: bold;&quot;&gt;F4&lt;/span&gt;. De esta manera se puede lograr la instalación. Una vez finalizado el paso anterior, es importante colocar la configuración pertinente sobre la tarjeta de video. Después de varias preguntas en ubuntuforums.org y un poco de lectura sobre el asunto. Termine con la siguiente modificacion al archivo xorg.conf (una buena recomendación es respaldar el archivo antes de cambiarlo):&lt;/div&gt;&lt;div&gt;&lt;code&gt;&lt;br /&gt;/etc/X11/xorg.conf&lt;/code&gt;&lt;/div&gt;&lt;div&gt;&lt;span class=&quot;Apple-style-span&quot;   style=&quot; ;font-family:-webkit-monospace;font-size:13px;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span class=&quot;Apple-style-span&quot;   style=&quot; ;font-family:-webkit-monospace;font-size:13px;&quot;&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;Section &quot;Device&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   Identifier &quot;Trident Microsystems CyberBlade XPAi1&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   Driver &quot;trident&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   BusID &quot;PCI:1:0:0&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;EndSection&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;br /&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;Section &quot;Monitor&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   Identifier &quot;Generic Monitor&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   Option &quot;DPMS&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   HorizSync 28-51&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   VertRefresh 43-60&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;EndSection&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;br /&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;Section &quot;Screen&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   Identifier &quot;Default Screen&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   Monitor  &quot;Generic Monitor&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   Device  &quot;Trident Microsystems CyberBlade XPAi1&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   SubSection &quot;Display&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;     Depth 8&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;     Modes &quot;1024x768&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   EndSubSection&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   SubSection &quot;Display&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;     Depth 16&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;     Modes &quot;1024x768&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   EndSubSection&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   SubSection &quot;Display&quot; &lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;     Depth 24&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;     Modes &quot;1024x768&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   EndSubSection&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   SubSection &quot;Display&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;     Depth 32&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;     Modes &quot;1024x768&quot;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;   EndSubSection&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;p style=&quot;margin-bottom: 0cm&quot;&gt;&lt;span style=&quot;color:#000000;&quot;&gt;&lt;span style=&quot;font-family:Courier, monospace;&quot;&gt;&lt;span style=&quot;font-size:100%;&quot;&gt;EndSection&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt; &lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span class=&quot;Apple-style-span&quot;   style=&quot; ;font-family:-webkit-monospace;font-size:13px;&quot;&gt;&lt;br /&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;De esta manera al reiniciar la laptop, ya contaba con Ubuntu 9.04 en todo su esplendor a 1024*768 sin problemas.&lt;/div&gt;&lt;div&gt;&lt;br /&gt;&lt;/div&gt;&lt;div&gt;Listo!&lt;/div&gt;</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/8333897201255663489/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/8333897201255663489' title='2 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/8333897201255663489'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/8333897201255663489'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2009/05/instalando-ubuntu-904-en-una-compaq.html' title='Instalando Ubuntu 9.04 en una Compaq Presario 1200 LA'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><thr:total>2</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-4194043140992320653</id><published>2008-11-13T16:54:00.001-06:00</published><updated>2008-11-13T16:54:58.600-06:00</updated><title type='text'>Notas Innovation Tour 08 en Veracruz</title><content type='html'>&lt;p&gt;Generalmente este tipo de posts lo hago en realidad con una libreta de notas al lado, siempre en estos eventos de Microsoft, dan algo y siempre los aprovecho para ir colocando las cosas interesantes o por lo menos que yo no sabia sobre los eventos.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;El dia de hoy no tengo esta libreta a mi lado, simple y sencillamente porque no dieron en esta ocasion, no se si se debio a que era la ultima presentacion del Innovation Tour, o a que casi no se realiza en el puerto el evento.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Lo unico que tengo a mi lado son un par de postales publicitarios, uno sobre el Innovation Tour con las direcciones de algunos de los blogs de gente de Microsoft Mexico, los cuales ya tengo instalados en mi Google Reader; y el otro sobe InnovateOn.En este ultimo, tengo anotado mis notas sobre el evento:&lt;/p&gt;&lt;br /&gt;&lt;ul&gt;&lt;br /&gt;    &lt;li&gt;www.thirteen23.com&lt;/li&gt;&lt;br /&gt;    &lt;li&gt;Asahiyama Zoo y&lt;/li&gt;&lt;br /&gt;    &lt;li&gt;Channer 9 WPF.&lt;/li&gt;&lt;br /&gt;&lt;/ul&gt;&lt;br /&gt;&lt;p&gt;¡Y eso es todo lo que tengo!. Caray, muy mal de verdad. Fueron 3 presentaciones, la primera de Omar Aviles, hablando sobre Open Source, PHP y FastCGI. Crei que al mencionar PHP en windows hablariamos sobre Phalanger, pero no simplemente se hablo sobre como configurar PHP en Windows Server. Y eso fue todo. Honestamente un poco aburrido, lo unico rescatable fue la presentacion de Bizpark, del cual yo no tenia datos.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;En la siguiente platica hablamos sobre WPF con Roman Lozano. Me parece que presentar Tafiti, Contoso y Family.Show, como demostraciones, no se hace atractivo en lo mas minimo, solo por el echo de que tienen mucho tiempo en linea, o en el mercado como se guste decir.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Por qué? si es desarrollador Roman, no prosento algo desarrolla en la emprea  Intellekt, algo que actualmente funcione y que tengo ya en produccion.. Eso hubiera estamos mas interesante, el final.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;El final de la platica termino con una rifas, por lo moenos me llevo un llaverito con el logo del evento, algo es mejor que nada.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Lo que mas me sorprende es la gente que asistio al evento, creo que no fue las mas pobre, seguramente el evento anterior de presentacion de SQL 2008, fue el de menos asistencia. &lt;/p&gt;&lt;br /&gt;&lt;p&gt;Pero en esta ocasion el problema fue la asistencia de alumnos de la universidad, como si estubieran siendo regañados para que fieran al evento. &lt;/p&gt;&lt;br /&gt;&lt;p&gt;Aplaudo el interes de la Universidad Villa Rica, pero que pena los alumnos que no aprovecha no solo no aprovechan estos eventos, si no que tambien lo toman a broma, Yo  recuerdo haber realizado un poco de bromas en su momento, pero si vas a entrar a un evento solo para bromar con lo amigos y jugar por red WarCraft.... mejor hubiera valido la pena quedarse en el salon.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Por otra partte, creo que los regalos que ganaron los chicos de la univerdad, en espeacial el de software gratuito, seran muy desaprovechados, espero alguien le puege codigo para que no sea un desperdicio.&lt;/p&gt;&lt;br /&gt;&lt;p&gt;Listo!&lt;/p&gt;&lt;br /&gt;</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/4194043140992320653/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/4194043140992320653' title='0 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/4194043140992320653'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/4194043140992320653'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2008/11/notas-innovation-tour-08-en-veracruz.html' title='Notas Innovation Tour 08 en Veracruz'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-43785816843829110</id><published>2008-09-23T12:58:00.002-05:00</published><updated>2008-09-23T13:04:09.613-05:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="Asp.Net"/><category scheme="http://www.blogger.com/atom/ns#" term="Consejos"/><category scheme="http://www.blogger.com/atom/ns#" term="encriptar"/><category scheme="http://www.blogger.com/atom/ns#" term="Microsoft"/><title type='text'>Guardar errores en un archivo de texto de forma encriptada</title><content type='html'>&lt;p&gt;Siempre es buena practica llevar un registro de los errores que se presentan en cualquier aplicacion, creo que lo mas comun es colocar los errores en un archivo de texto, como una especie de log, o en su caso dentro de una base de datos para llevar un registro. Los habra mas sofisticados que pondra la informacion como un evento de windows.&lt;/p&gt;&lt;p&gt;Pero si no queremos que los usuarios de la aplicacion que estan de curiosos, vean y lean los errores que se producen en nuestra aplicacion, una forma practica es la de encriptar el archivo. El problema con esto es que si el archivo de texto se vuelve muy grande la encriptacion puede hacer lenta la aplicacion, ya que tienes que abrir el archivo desencriptar, colocar un mensaje, y volver a encriptar el archivo.&lt;/p&gt;&lt;p&gt;Siendo lo anterior un poco impractico decidi mejor colocar los mensajes encriptados dentro del archivo. Para lo cual modifique la clase que estoy utilizando para guardar los mensajes:&lt;/p&gt;&lt;p&gt; &lt;/p&gt;&lt;div class=&quot;csharpcode&quot;&gt;&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;   1:  &lt;/span&gt;    &lt;span class=&quot;kwrd&quot;&gt;Public&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Shared&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Sub&lt;/span&gt; WriteError(&lt;span class=&quot;kwrd&quot;&gt;ByVal&lt;/span&gt; errorMessage &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;String&lt;/span&gt;)&lt;/pre&gt;&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;   2:  &lt;/span&gt;        &lt;span class=&quot;kwrd&quot;&gt;Try&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;   3:  &lt;/span&gt;            &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; path &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;String&lt;/span&gt; = &lt;span class=&quot;str&quot;&gt;&quot;error.txt&quot;&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;   4:  &lt;/span&gt;            &lt;span class=&quot;kwrd&quot;&gt;If&lt;/span&gt; (&lt;span class=&quot;kwrd&quot;&gt;Not&lt;/span&gt; File.Exists(System.Web.HttpContext.Current.Server.MapPath(path))) &lt;span class=&quot;kwrd&quot;&gt;Then&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;   5:  &lt;/span&gt;                File.Create(System.Web.HttpContext.Current.Server.MapPath(path)).Close()&lt;/pre&gt;&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;   6:  &lt;/span&gt;            &lt;span class=&quot;kwrd&quot;&gt;End&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;If&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;   7:  &lt;/span&gt;            Using w &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; StreamWriter = File.AppendText(System.Web.HttpContext.Current.Server.MapPath(path))&lt;/pre&gt;&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;   8:  &lt;/span&gt;                w.WriteLine(Constants.vbCrLf &amp;amp; &lt;span class=&quot;str&quot;&gt;&quot;Error : &quot;&lt;/span&gt;)&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;   9:  &lt;/span&gt;                w.WriteLine(&lt;span class=&quot;str&quot;&gt;&quot;{0}&quot;&lt;/span&gt;, DateTime.Now.ToString(CultureInfo.InvariantCulture))&lt;/pre&gt;&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  10:  &lt;/span&gt;                &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; err &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;String&lt;/span&gt; = &lt;span class=&quot;str&quot;&gt;&quot;En linea: &quot;&lt;/span&gt; &amp;amp; System.Web.HttpContext.Current.Request.Url.ToString() &amp;amp; &lt;span class=&quot;str&quot;&gt;&quot;. Mensaje:&quot;&lt;/span&gt; &amp;amp; errorMessage&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  11:  &lt;/span&gt;                w.WriteLine(Encrypt(err, &lt;span class=&quot;kwrd&quot;&gt;True&lt;/span&gt;))&lt;/pre&gt;&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  12:  &lt;/span&gt;                w.WriteLine(&lt;span class=&quot;str&quot;&gt;&quot;__________________________&quot;&lt;/span&gt;)&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  13:  &lt;/span&gt;                w.Flush()&lt;/pre&gt;&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  14:  &lt;/span&gt;                w.Close()&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  15:  &lt;/span&gt;            &lt;span class=&quot;kwrd&quot;&gt;End&lt;/span&gt; Using&lt;/pre&gt;&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  16:  &lt;/span&gt;        &lt;span class=&quot;kwrd&quot;&gt;Catch&lt;/span&gt; ex &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; Exception&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  17:  &lt;/span&gt;            WriteError(ex.Message)&lt;/pre&gt;&lt;pre&gt;&lt;span class=&quot;lnum&quot;&gt;  18:  &lt;/span&gt;        &lt;span class=&quot;kwrd&quot;&gt;End&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Try&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;lnum&quot;&gt;  19:  &lt;/span&gt;    &lt;span class=&quot;kwrd&quot;&gt;End&lt;/span&gt; Sub&lt;br /&gt;&lt;style type=&quot;text/css&quot;&gt;&lt;br /&gt;.csharpcode, .csharpcode pre&lt;br /&gt;{&lt;br /&gt; font-size: small;&lt;br /&gt; color: black;&lt;br /&gt; font-family: consolas, &quot;Courier New&quot;, courier, monospace;&lt;br /&gt; background-color: #ffffff;&lt;br /&gt; /*white-space: pre;*/&lt;br /&gt;}&lt;br /&gt;.csharpcode pre { margin: 0em; }&lt;br /&gt;.csharpcode .rem { color: #008000; }&lt;br /&gt;.csharpcode .kwrd { color: #0000ff; }&lt;br /&gt;.csharpcode .str { color: #006080; }&lt;br /&gt;.csharpcode .op { color: #0000c0; }&lt;br /&gt;.csharpcode .preproc { color: #cc6633; }&lt;br /&gt;.csharpcode .asp { background-color: #ffff00; }&lt;br /&gt;.csharpcode .html { color: #800000; }&lt;br /&gt;.csharpcode .attr { color: #ff0000; }&lt;br /&gt;.csharpcode .alt&lt;br /&gt;{&lt;br /&gt; background-color: #f4f4f4;&lt;br /&gt; width: 100%;&lt;br /&gt; margin: 0em;&lt;br /&gt;}&lt;br /&gt;.csharpcode .lnum { color: #606060; }&lt;/style&gt;&lt;br /&gt;&lt;br /&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Si observan en la linea 11 puse la palabra Encrypt, es ahi donde estoy haciendo llamar otra funcion, importando en el archivo la libreria de .net de criptografia:&lt;/p&gt;&lt;p&gt;&lt;strong&gt;Imports System.Security.Cryptography&lt;/strong&gt;&lt;/p&gt;&lt;div class=&quot;csharpcode&quot;&gt;&lt;br /&gt;&lt;pre class=&quot;alt&quot;&gt;    &lt;span class=&quot;kwrd&quot;&gt;Public&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Function&lt;/span&gt; Encrypt(&lt;span class=&quot;kwrd&quot;&gt;ByVal&lt;/span&gt; toEncrypt &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;String&lt;/span&gt;, &lt;span class=&quot;kwrd&quot;&gt;ByVal&lt;/span&gt; useHashing &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Boolean&lt;/span&gt;) &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;String&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;        &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; keyArray &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Byte&lt;/span&gt;()&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; toEncryptArray &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Byte&lt;/span&gt;() = UTF8Encoding.UTF8.GetBytes(toEncrypt)&lt;/pre&gt;&lt;pre&gt;        &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; key &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;String&lt;/span&gt; = &lt;span class=&quot;str&quot;&gt;&quot;MyKEY&quot;&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;        &lt;span class=&quot;kwrd&quot;&gt;If&lt;/span&gt; useHashing &lt;span class=&quot;kwrd&quot;&gt;Then&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;            &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; hashmd5 &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;New&lt;/span&gt; MD5CryptoServiceProvider()&lt;/pre&gt;&lt;pre&gt;            keyArray = hashmd5.ComputeHash(UTF8Encoding.UTF8.GetBytes(key))&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;            hashmd5.Clear()&lt;/pre&gt;&lt;pre&gt;        &lt;span class=&quot;kwrd&quot;&gt;Else&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;            keyArray = UTF8Encoding.UTF8.GetBytes(key)&lt;/pre&gt;&lt;pre&gt;        &lt;span class=&quot;kwrd&quot;&gt;End&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;If&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; tdes &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;New&lt;/span&gt; TripleDESCryptoServiceProvider()&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        tdes.Key = keyArray&lt;/pre&gt;&lt;pre&gt;        tdes.Mode = CipherMode.ECB&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        tdes.Padding = PaddingMode.PKCS7&lt;/pre&gt;&lt;pre&gt;        &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; cTransform &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; ICryptoTransform = tdes.CreateEncryptor()&lt;/pre&gt;&lt;pre&gt;        &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; resultArray &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Byte&lt;/span&gt;() = cTransform.TransformFinalBlock(toEncryptArray, 0, toEncryptArray.Length)&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        tdes.Clear()&lt;/pre&gt;&lt;pre&gt;        &lt;span class=&quot;kwrd&quot;&gt;Return&lt;/span&gt; Convert.ToBase64String(resultArray, 0, resultArray.Length)&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;    &lt;span class=&quot;kwrd&quot;&gt;End&lt;/span&gt; Function&lt;/pre&gt;&lt;/div&gt;&lt;br /&gt;&lt;style type=&quot;text/css&quot;&gt;&lt;br /&gt;.csharpcode, .csharpcode pre&lt;br /&gt;{&lt;br /&gt; font-size: small;&lt;br /&gt; color: black;&lt;br /&gt; font-family: consolas, &quot;Courier New&quot;, courier, monospace;&lt;br /&gt; background-color: #ffffff;&lt;br /&gt; /*white-space: pre;*/&lt;br /&gt;}&lt;br /&gt;.csharpcode pre { margin: 0em; }&lt;br /&gt;.csharpcode .rem { color: #008000; }&lt;br /&gt;.csharpcode .kwrd { color: #0000ff; }&lt;br /&gt;.csharpcode .str { color: #006080; }&lt;br /&gt;.csharpcode .op { color: #0000c0; }&lt;br /&gt;.csharpcode .preproc { color: #cc6633; }&lt;br /&gt;.csharpcode .asp { background-color: #ffff00; }&lt;br /&gt;.csharpcode .html { color: #800000; }&lt;br /&gt;.csharpcode .attr { color: #ff0000; }&lt;br /&gt;.csharpcode .alt&lt;br /&gt;{&lt;br /&gt; background-color: #f4f4f4;&lt;br /&gt; width: 100%;&lt;br /&gt; margin: 0em;&lt;br /&gt;}&lt;br /&gt;.csharpcode .lnum { color: #606060; }&lt;/style&gt;&lt;br /&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;Ahora ya tendremos nuestros mensajes encriptados. Si queremos desencriptar los mensajes solo tendremos que usar la siguiente funcion en algun lugar y hacerla llamar:&lt;/p&gt;&lt;br /&gt;&lt;div class=&quot;csharpcode&quot;&gt;&lt;br /&gt;&lt;pre class=&quot;alt&quot;&gt;    &lt;span class=&quot;kwrd&quot;&gt;Public&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Shared&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Function&lt;/span&gt; Decrypt(&lt;span class=&quot;kwrd&quot;&gt;ByVal&lt;/span&gt; cipherString &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;String&lt;/span&gt;, &lt;span class=&quot;kwrd&quot;&gt;ByVal&lt;/span&gt; useHashing &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Boolean&lt;/span&gt;) &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;String&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;       &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; keyArray &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Byte&lt;/span&gt;()&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; toEncryptArray &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Byte&lt;/span&gt;() = Convert.FromBase64String(cipherString)&lt;/pre&gt;&lt;pre&gt;        &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; key &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;String&lt;/span&gt; = &lt;span class=&quot;str&quot;&gt;&quot;MyKEY&quot;&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        &lt;span class=&quot;kwrd&quot;&gt;If&lt;/span&gt; useHashing &lt;span class=&quot;kwrd&quot;&gt;Then&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;            &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; hashmd5 &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;New&lt;/span&gt; MD5CryptoServiceProvider()&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;            keyArray = hashmd5.ComputeHash(UTF8Encoding.UTF8.GetBytes(key))&lt;/pre&gt;&lt;pre&gt;            hashmd5.Clear()&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        &lt;span class=&quot;kwrd&quot;&gt;Else&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;            keyArray = UTF8Encoding.UTF8.GetBytes(key)&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        &lt;span class=&quot;kwrd&quot;&gt;End&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;If&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;        &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; tdes &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;New&lt;/span&gt; TripleDESCryptoServiceProvider()&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        tdes.Key = keyArray&lt;/pre&gt;&lt;pre&gt;        tdes.Mode = CipherMode.ECB&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        tdes.Padding = PaddingMode.PKCS7&lt;/pre&gt;&lt;pre&gt;        &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; cTransform &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; ICryptoTransform = tdes.CreateDecryptor()&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        &lt;span class=&quot;kwrd&quot;&gt;Dim&lt;/span&gt; resultArray &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Byte&lt;/span&gt;() = cTransform.TransformFinalBlock(toEncryptArray, 0, toEncryptArray.Length)&lt;/pre&gt;&lt;pre&gt;        tdes.Clear()&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        &lt;span class=&quot;kwrd&quot;&gt;Return&lt;/span&gt; UTF8Encoding.UTF8.GetString(resultArray)&lt;/pre&gt;&lt;pre&gt;    &lt;span class=&quot;kwrd&quot;&gt;End&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Function&lt;/span&gt;&lt;/pre&gt;&lt;/div&gt;&lt;style type=&quot;text/css&quot;&gt;&lt;br /&gt;.csharpcode, .csharpcode pre&lt;br /&gt;{&lt;br /&gt; font-size: small;&lt;br /&gt; color: black;&lt;br /&gt; font-family: consolas, &quot;Courier New&quot;, courier, monospace;&lt;br /&gt; background-color: #ffffff;&lt;br /&gt; /*white-space: pre;*/&lt;br /&gt;}&lt;br /&gt;.csharpcode pre { margin: 0em; }&lt;br /&gt;.csharpcode .rem { color: #008000; }&lt;br /&gt;.csharpcode .kwrd { color: #0000ff; }&lt;br /&gt;.csharpcode .str { color: #006080; }&lt;br /&gt;.csharpcode .op { color: #0000c0; }&lt;br /&gt;.csharpcode .preproc { color: #cc6633; }&lt;br /&gt;.csharpcode .asp { background-color: #ffff00; }&lt;br /&gt;.csharpcode .html { color: #800000; }&lt;br /&gt;.csharpcode .attr { color: #ff0000; }&lt;br /&gt;.csharpcode .alt&lt;br /&gt;{&lt;br /&gt; background-color: #f4f4f4;&lt;br /&gt; width: 100%;&lt;br /&gt; margin: 0em;&lt;br /&gt;}&lt;br /&gt;.csharpcode .lnum { color: #606060; }&lt;/style&gt;&lt;br /&gt;&lt;p&gt;Tal vez usar una forma de aspx que reciba el codigo encriptado:&lt;/p&gt;&lt;div class=&quot;csharpcode&quot;&gt;&lt;br /&gt;&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;asp&quot;&gt;&amp;lt;%@ Page Language=&quot;vb&quot; AutoEventWireup=&quot;false&quot; CodeBehind=&quot;WebForm1.aspx.vb&quot; Inherits=&quot;Bintech.WebForm1&quot; %&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;!&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;DOCTYPE&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;html&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;PUBLIC&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;&quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot;&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;&quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;html&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;xmlns&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;http://www.w3.org/1999/xhtml&quot;&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;head&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;runat&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;server&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;title&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;Untitled Page&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;title&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;head&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;body&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;form&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;id&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;form1&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;runat&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;server&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;        Forma de desencriptacion:&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;br&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;/&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;asp:TextBox&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;ID&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;TextBoxEncriptado&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;runat&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;server&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;Height&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;173px&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;TextMode&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;MultiLine&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;Width&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;308px&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;asp:TextBox&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;        &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;br&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;/&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;asp:Button&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;ID&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;Button1&quot;&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;            &lt;span class=&quot;attr&quot;&gt;runat&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;server&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;Text&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;Button&quot;&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;/&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;        &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;br&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;/&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;        &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;asp:Label&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;ID&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;LabelResult&quot;&lt;/span&gt; &lt;span class=&quot;attr&quot;&gt;runat&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;=&quot;server&quot;&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;asp:Label&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;div&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;    &lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;form&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;body&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&quot;html&quot;&gt;html&lt;/span&gt;&lt;span class=&quot;kwrd&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;&lt;br /&gt;&lt;style type=&quot;text/css&quot;&gt;&lt;br /&gt;.csharpcode, .csharpcode pre&lt;br /&gt;{&lt;br /&gt; font-size: small;&lt;br /&gt; color: black;&lt;br /&gt; font-family: consolas, &quot;Courier New&quot;, courier, monospace;&lt;br /&gt; background-color: #ffffff;&lt;br /&gt; /*white-space: pre;*/&lt;br /&gt;}&lt;br /&gt;.csharpcode pre { margin: 0em; }&lt;br /&gt;.csharpcode .rem { color: #008000; }&lt;br /&gt;.csharpcode .kwrd { color: #0000ff; }&lt;br /&gt;.csharpcode .str { color: #006080; }&lt;br /&gt;.csharpcode .op { color: #0000c0; }&lt;br /&gt;.csharpcode .preproc { color: #cc6633; }&lt;br /&gt;.csharpcode .asp { background-color: #ffff00; }&lt;br /&gt;.csharpcode .html { color: #800000; }&lt;br /&gt;.csharpcode .attr { color: #ff0000; }&lt;br /&gt;.csharpcode .alt&lt;br /&gt;{&lt;br /&gt; background-color: #f4f4f4;&lt;br /&gt; width: 100%;&lt;br /&gt; margin: 0em;&lt;br /&gt;}&lt;br /&gt;.csharpcode .lnum { color: #606060; }&lt;/style&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Y agregar un evento al boton:&lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;p&gt;&lt;br /&gt; &lt;/p&gt;&lt;p&gt; &lt;/p&gt;&lt;br /&gt;&lt;br /&gt;&lt;div class=&quot;csharpcode&quot;&gt;&lt;br /&gt;&lt;pre class=&quot;alt&quot;&gt;    &lt;span class=&quot;kwrd&quot;&gt;Protected&lt;/span&gt; &lt;span class=&quot;kwrd&quot;&gt;Sub&lt;/span&gt; Button1_Click(&lt;span class=&quot;kwrd&quot;&gt;ByVal&lt;/span&gt; sender &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; System.&lt;span class=&quot;kwrd&quot;&gt;Object&lt;/span&gt;, &lt;span class=&quot;kwrd&quot;&gt;ByVal&lt;/span&gt; e &lt;span class=&quot;kwrd&quot;&gt;As&lt;/span&gt; System.EventArgs) &lt;span class=&quot;kwrd&quot;&gt;Handles&lt;/span&gt; Button1.Click&lt;/pre&gt;&lt;pre&gt;       LabelResult.Text = Decrypt(TextBoxEncriptado.Text, &lt;span class=&quot;kwrd&quot;&gt;False&lt;/span&gt;)&lt;/pre&gt;&lt;pre class=&quot;alt&quot;&gt;    &lt;span class=&quot;kwrd&quot;&gt;End&lt;/span&gt; Sub&lt;/pre&gt;&lt;br /&gt;&lt;/div&gt;&lt;style type=&quot;text/css&quot;&gt;&lt;br /&gt;.csharpcode, .csharpcode pre&lt;br /&gt;{&lt;br /&gt; font-size: small;&lt;br /&gt; color: black;&lt;br /&gt; font-family: consolas, &quot;Courier New&quot;, courier, monospace;&lt;br /&gt; background-color: #ffffff;&lt;br /&gt; /*white-space: pre;*/&lt;br /&gt;}&lt;br /&gt;.csharpcode pre { margin: 0em; }&lt;br /&gt;.csharpcode .rem { color: #008000; }&lt;br /&gt;.csharpcode .kwrd { color: #0000ff; }&lt;br /&gt;.csharpcode .str { color: #006080; }&lt;br /&gt;.csharpcode .op { color: #0000c0; }&lt;br /&gt;.csharpcode .preproc { color: #cc6633; }&lt;br /&gt;.csharpcode .asp { background-color: #ffff00; }&lt;br /&gt;.csharpcode .html { color: #800000; }&lt;br /&gt;.csharpcode .attr { color: #ff0000; }&lt;br /&gt;.csharpcode .alt&lt;br /&gt;{&lt;br /&gt; background-color: #f4f4f4;&lt;br /&gt; width: 100%;&lt;br /&gt; margin: 0em;&lt;br /&gt;}&lt;br /&gt;.csharpcode .lnum { color: #606060; }&lt;/style&gt;&lt;br /&gt;&lt;p&gt;Listo!&lt;/p&gt;</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/43785816843829110/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/43785816843829110' title='1 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/43785816843829110'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/43785816843829110'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2008/09/guardar-errores-en-un-archivo-de-texto.html' title='Guardar errores en un archivo de texto de forma encriptada'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-12602009.post-419026640561905570</id><published>2008-09-23T12:28:00.002-05:00</published><updated>2008-09-23T13:00:52.387-05:00</updated><category scheme="http://www.blogger.com/atom/ns#" term="Consejos"/><category scheme="http://www.blogger.com/atom/ns#" term="Microsoft"/><category scheme="http://www.blogger.com/atom/ns#" term="SQL"/><category scheme="http://www.blogger.com/atom/ns#" term="Tip"/><category scheme="http://www.blogger.com/atom/ns#" term="Truco"/><category scheme="http://www.blogger.com/atom/ns#" term="Visual Studio"/><title type='text'>¿Donde desea publicar su sitio web?</title><content type='html'>&lt;p&gt; Aqui dejo un extraño error que me tope con Visual Studio 2005 a la hora de publicar un sitio web. Primero un poco de antecedentes, generalmente publico los sitios web a niver raiz del servidor, es asi,&amp;#160; que siempre modifico las preferencias de publicacion del proyecto en el cual estoy trabajando y elimino la carpeta virtual que coloca por defecto visual studio:&lt;/p&gt;  &lt;p&gt;&amp;#160;&lt;/p&gt;  &lt;p&gt;&lt;a href=&quot;http://lh3.ggpht.com/vgarcias/SNknGTswmNI/AAAAAAAAAWE/5vlVHcg77xk/s1600-h/20080917z%5B3%5D.jpg&quot;&gt;&lt;img title=&quot;20080917z&quot; style=&quot;border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px&quot; height=&quot;187&quot; alt=&quot;20080917z&quot; src=&quot;http://lh5.ggpht.com/vgarcias/SNknHS-qbfI/AAAAAAAAAWI/L1mvqgyXh50/20080917z_thumb%5B1%5D.jpg?imgmax=800&quot; width=&quot;578&quot; border=&quot;0&quot; /&gt;&lt;/a&gt;&lt;/p&gt;  &lt;p&gt;&lt;/p&gt;  &lt;p&gt;De esta manera siempre que pruebo un sitio solo tengo que colocar el url http://localhost, en ocasiones coloco un puerto especifico para el servidor de desarrollo y el de publicacion se queda con el estandar 80.&lt;/p&gt;  &lt;p&gt;Esto siempre me ha resultado. El detalle fue que en esta ocasion el servidor de publicacion debe llevar una carpeta virtual.&lt;/p&gt;  &lt;p&gt;Para empezar la talacha de apuntar a una carpeta virtual en el codigo, particularmente para los archivos de javascript y de estilos. Y realizar cambios no esperados. En fin que regrese la configuracion a la anterior:&lt;/p&gt;  &lt;p&gt;&lt;a href=&quot;http://lh4.ggpht.com/vgarcias/SNknINEyIiI/AAAAAAAAAWM/b3v97uRbYt0/s1600-h/20080917c%5B3%5D.jpg&quot;&gt;&lt;img title=&quot;20080917c&quot; style=&quot;border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px&quot; height=&quot;581&quot; alt=&quot;20080917c&quot; src=&quot;http://lh6.ggpht.com/vgarcias/SNknJIac0tI/AAAAAAAAAWQ/pFonYRBHYNs/20080917c_thumb%5B1%5D.jpg?imgmax=800&quot; width=&quot;596&quot; border=&quot;0&quot; /&gt;&lt;/a&gt; &lt;/p&gt;  &lt;p&gt;Con lo anterior pude seguir trabajando sin problemas para hacer depuracion del sitio. Una vez que habia terminado se me ocurrio publica la aplicacion al servidor local:&lt;/p&gt;  &lt;p&gt;&amp;#160;&lt;/p&gt;  &lt;p&gt;&lt;a href=&quot;http://lh5.ggpht.com/vgarcias/SNknJ4KkzDI/AAAAAAAAAWU/NwGRG_XRmbs/s1600-h/20080917b%5B6%5D.jpg&quot;&gt;&lt;img title=&quot;20080917b&quot; style=&quot;border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px&quot; height=&quot;362&quot; alt=&quot;20080917b&quot; src=&quot;http://lh3.ggpht.com/vgarcias/SNknKvu7ClI/AAAAAAAAAWY/y4_-P-4FpTc/20080917b_thumb%5B2%5D.jpg?imgmax=800&quot; width=&quot;478&quot; border=&quot;0&quot; /&gt;&lt;/a&gt; &lt;/p&gt;  &lt;p&gt;¿Donde deseo publicar? en localhost por supuesto. Le di “publish” y:&lt;/p&gt;  &lt;p&gt;&amp;#160;&lt;/p&gt;  &lt;p&gt;&lt;/p&gt;  &lt;p&gt;&lt;/p&gt;  &lt;p&gt;&lt;/p&gt;  &lt;p&gt;&lt;/p&gt;  &lt;p&gt;&lt;a href=&quot;http://lh4.ggpht.com/vgarcias/SNknLFAmykI/AAAAAAAAAWc/OUE08ltkU7Q/s1600-h/20080917a%5B3%5D.jpg&quot;&gt;&lt;img title=&quot;20080917a&quot; style=&quot;border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px&quot; height=&quot;131&quot; alt=&quot;20080917a&quot; src=&quot;http://lh6.ggpht.com/vgarcias/SNknLga-ZXI/AAAAAAAAAWg/BTYIFWvN3ZY/20080917a_thumb%5B1%5D.jpg?imgmax=800&quot; width=&quot;486&quot; border=&quot;0&quot; /&gt;&lt;/a&gt; &lt;/p&gt;  &lt;p&gt;Que, ¿Que?. Como que no puedo publicar mi sitio de forma local. &lt;/p&gt;  &lt;p&gt;Si analizamos el mensaje, me esta diciendo que debo publicar en un sitio diferente al de la aplicacion web, pero lo cierto es que en ningun momento coloque que localhost es donde se encuentra mi aplicacion web, es mas en realidad, siendo estricto se encuentra en una carpeta llamada d:\dev.&lt;/p&gt;  &lt;p&gt;Por otra parte cuando se depura la aplicacion y se lanza el servidor de pruebas de visual studio, en ningun momento se coloca localhost, solo se coloca la carpeta virtual y a lo mas un puerto , que en mi caso era diferente al 80.&lt;/p&gt;  &lt;p&gt;Sin embargo, al parecer se guarda algun registro en algun lugar y se conserva localhost, donde se guarda el registro, no lo investigue, la verdad es que me apuraba, poder publicar el sitio para demostrarlo.&lt;/p&gt;  &lt;p&gt;Una busqueda rapida por Google, mencionaban que ese error se debia colocar a que yo estaba colocando el sitio en el mismo url, que lo cambiara por el de un sitio remoto, gran ayuda. Le di vueltas al asunto, y se me ocurrio prender la paloma de IIS Server como servidor de publicacion y colocar cualquier cosa que no fuera localhost:&lt;/p&gt;  &lt;p&gt;&amp;#160;&lt;/p&gt;  &lt;p&gt;&lt;a href=&quot;http://lh6.ggpht.com/vgarcias/SNknMOREy2I/AAAAAAAAAWk/xNfojearRqg/s1600-h/20080917d%5B3%5D.jpg&quot;&gt;&lt;img title=&quot;20080917d&quot; style=&quot;border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px&quot; height=&quot;308&quot; alt=&quot;20080917d&quot; src=&quot;http://lh4.ggpht.com/vgarcias/SNknMv3AtmI/AAAAAAAAAWo/UHJ5PiHtI5o/20080917d_thumb%5B1%5D.jpg?imgmax=800&quot; width=&quot;614&quot; border=&quot;0&quot; /&gt;&lt;/a&gt; &lt;/p&gt;  &lt;p&gt;Cambie de nuevo la opcion de usar Visual Studio Dev Server para seguir trabajando como normalmente lo hago,:&lt;/p&gt;  &lt;p&gt;&amp;#160;&lt;/p&gt;  &lt;p&gt;&lt;a href=&quot;http://lh4.ggpht.com/vgarcias/SNknNE9uq4I/AAAAAAAAAWs/ype5qPposBQ/s1600-h/20080917e%5B3%5D.jpg&quot;&gt;&lt;img title=&quot;20080917e&quot; style=&quot;border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px&quot; height=&quot;575&quot; alt=&quot;20080917e&quot; src=&quot;http://lh3.ggpht.com/vgarcias/SNknOD-BS4I/AAAAAAAAAWw/OeqyvNPs0Fw/20080917e_thumb%5B1%5D.jpg?imgmax=800&quot; width=&quot;549&quot; border=&quot;0&quot; /&gt;&lt;/a&gt; &lt;/p&gt;  &lt;p&gt;&lt;/p&gt;  &lt;p&gt;Como pueden apreciar el servidor de IIS no lo estoy utilizando, pero sin embargo si parece haber sido cambiado el parametro en algun lugar.&lt;/p&gt;  &lt;p&gt;Vuelvo a intentar publicar:&lt;/p&gt;  &lt;p&gt;&amp;#160;&lt;/p&gt;  &lt;p&gt;&lt;a href=&quot;http://lh3.ggpht.com/vgarcias/SNknOtJzkMI/AAAAAAAAAW0/MRDoUI8yfDg/s1600-h/20080917b%5B10%5D.jpg&quot;&gt;&lt;img title=&quot;20080917b&quot; style=&quot;border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px&quot; height=&quot;362&quot; alt=&quot;20080917b&quot; src=&quot;http://lh6.ggpht.com/vgarcias/SNknPI9Ut0I/AAAAAAAAAW4/OJKpFUrThb0/20080917b_thumb%5B4%5D.jpg?imgmax=800&quot; width=&quot;478&quot; border=&quot;0&quot; /&gt;&lt;/a&gt; &lt;/p&gt;  &lt;p&gt;&lt;/p&gt;  &lt;p&gt;Y esta vez sin errores!&lt;/p&gt;  &lt;p&gt;Listo!&lt;/p&gt;</content><link rel='replies' type='application/atom+xml' href='https://llanura.blogspot.com/feeds/419026640561905570/comments/default' title='Comentarios de la entrada'/><link rel='replies' type='text/html' href='https://www.blogger.com/comment/fullpage/post/12602009/419026640561905570' title='1 Comentarios'/><link rel='edit' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/419026640561905570'/><link rel='self' type='application/atom+xml' href='https://www.blogger.com/feeds/12602009/posts/default/419026640561905570'/><link rel='alternate' type='text/html' href='https://llanura.blogspot.com/2008/09/donde-desea-publicar-su-sitio-web.html' title='¿Donde desea publicar su sitio web?'/><author><name>vgarcias</name><uri>http://www.blogger.com/profile/09409315532297958857</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='32' height='31' src='//blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9x57I1cTmDwxeU4XFy8s3emTQRA4uC3wY7h_JaFjI_jWqzVlPXsK_wT660NsYjEdG9zpysPefZxpQ6rGM8A5Vd6sd8_ScpTr5PUrn8pSQXqgIImoNJ6T4hbUncijltg/s220/avatar.jpg'/></author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="http://lh5.ggpht.com/vgarcias/SNknHS-qbfI/AAAAAAAAAWI/L1mvqgyXh50/s72-c/20080917z_thumb%5B1%5D.jpg?imgmax=800" height="72" width="72"/><thr:total>1</thr:total></entry></feed>